wip

plugins/talk-plugin-auth/client/login/actions.js

@@ -14,3 +14,11 @@ export const setPassword = password => ({
   type: actions.SET_PASSWORD,
   password,
 });
+
+export const enableSubmitSignUpForm = () => ({
+  type: actions.ENABLE_SUBMIT_SIGNUP_FORM,
+});
+
+export const disableSubmitSignUpForm = () => ({
+  type: actions.DISABLE_SUBMIT_SIGNUP_FORM,
+});

plugins/talk-plugin-auth/client/login/components/SignUp.js

@@ -1,5 +1,6 @@
 import React from 'react';
 import PropTypes from 'prop-types';
+import { Slot } from 'plugin-api/beta/client/components';
 import {
   Button,
   TextField,
@@ -42,8 +43,15 @@ class SignUp extends React.Component {
       errorMessage,
       requireEmailConfirmation,
       success,
+      enableSubmitSignUpForm,
+      disableSubmitSignUpForm,
     } = this.props;
 
+    const slotPassthrough = {
+      enableSubmitSignUpForm,
+      disableSubmitSignUpForm,
+    };
+
     return (
       <div>
         <div className={styles.header}>
@@ -103,6 +111,10 @@ class SignUp extends React.Component {
                 onChange={this.handlePasswordRepeatChange}
                 minLength="8"
               />
+              <Slot
+                fill="talkPluginAuth-formField"
+                passthrough={slotPassthrough}
+              />
               <div className={styles.action}>
                 <Button
                   type="submit"
@@ -161,6 +173,8 @@ SignUp.propTypes = {
   errorMessage: PropTypes.string,
   requireEmailConfirmation: PropTypes.bool.isRequired,
   success: PropTypes.bool.isRequired,
+  enableSubmitSignUpForm: PropTypes.func.isRequired,
+  disableSubmitSignUpForm: PropTypes.func.isRequired,
 };
 
 export default SignUp;

plugins/talk-plugin-auth/client/login/constants.js

@@ -3,5 +3,5 @@ const prefix = 'TALK_AUTH';
 export const SET_VIEW = `${prefix}_SET_VIEW`;
 export const SET_EMAIL = `${prefix}_SET_EMAIL`;
 export const SET_PASSWORD = `${prefix}_SET_PASSWORD`;
-export const ENABLE_SUBMIT = `${prefix}_ENABLE_SUBMIT`;
-export const DISABLE_SUBMIT = `${prefix}_DISABLE_SUBMIT`;
+export const ENABLE_SUBMIT_SIGNUP_FORM = `${prefix}_ENABLE_SUBMIT_SIGNUP_FORM`;
+export const DISABLE_SUBMIT_SIGNUP_FORM = `${prefix}_DISABLE_SUBMIT_SIGNUP_FOR`;

plugins/talk-plugin-auth/client/login/containers/SignUp.js

@@ -5,7 +5,13 @@ import { compose } from 'recompose';
 import SignUp from '../components/SignUp';
 import { bindActionCreators } from 'redux';
 import * as views from '../enums/views';
-import { setView, setEmail, setPassword } from '../actions';
+import {
+  setView,
+  setEmail,
+  setPassword,
+  enableSubmitSignUpForm,
+  disableSubmitSignUpForm,
+} from '../actions';
 import { t } from 'plugin-api/beta/client/services';
 
 class SignUpContainer extends Component {
@@ -76,6 +82,9 @@ class SignUpContainer extends Component {
   render() {
     return (
       <SignUp
+        enableSubmitSignUpForm={this.props.enableSubmitSignUpForm}
+        disableSubmitSignUpForm={this.props.disableSubmitSignUpForm}
+        submitSignUpForm={this.props.submitSignUpForm}
         onSubmit={this.handleSubmit}
         onUsernameChange={this.setUsername}
         onEmailChange={this.props.setEmail}
@@ -113,11 +122,15 @@ SignUpContainer.propTypes = {
   requireEmailConfirmation: PropTypes.bool.isRequired,
   success: PropTypes.bool.isRequired,
   validate: PropTypes.func.isRequired,
+  submitSignUpForm: PropTypes.bool.isRequired,
+  enableSubmitSignUpForm: PropTypes.func.isRequired,
+  disableSubmitSignUpForm: PropTypes.func.isRequired,
 };
 
 const mapStateToProps = ({ talkPluginAuth: state }) => ({
   email: state.email,
   password: state.password,
+  submitSignUpForm: state.submitSignUpForm,
 });
 
 const mapDispatchToProps = dispatch =>
@@ -126,6 +139,8 @@ const mapDispatchToProps = dispatch =>
       setView,
       setEmail,
       setPassword,
+      enableSubmitSignUpForm,
+      disableSubmitSignUpForm,
     },
     dispatch
   );

plugins/talk-plugin-auth/client/login/reducer.js

@@ -5,20 +5,20 @@ const initialState = {
   view: views.SIGN_IN,
   email: '',
   password: '',
-  enableSubmit: true,
+  submitSignUpForm: true,
 };
 
 export default function reducer(state = initialState, action) {
   switch (action.type) {
-    case actions.ENABLE_SUBMIT:
+    case actions.ENABLE_SUBMIT_SIGNUP_FORM:
       return {
         ...state,
-        enableSubmit: true,
+        submitSignUpForm: true,
       };
-    case actions.DISABLE_SUBMIT:
+    case actions.DISABLE_SUBMIT_SIGNUP_FORM:
       return {
         ...state,
-        enableSubmit: false,
+        submitSignUpForm: false,
       };
     case actions.SET_VIEW:
       return {