Add inProgress state and examples to EmailVerificationForm

src/containers/EmailVerificationForm/EmailVerificationForm.example.js

@@ -0,0 +1,28 @@
+/* eslint-disable no-console */
+import { createCurrentUser } from '../../util/test-data';
+import EmailVerificationForm from './EmailVerificationForm';
+
+const notVerifiedUser = createCurrentUser('not-verified');
+notVerifiedUser.attributes.emailVerified = false;
+
+export const NotVerified = {
+  component: EmailVerificationForm,
+  props: {
+    currentUser: notVerifiedUser,
+    onSubmit(values) {
+      console.log('submit values:', values);
+    },
+  },
+  group: 'forms',
+};
+
+export const Verified = {
+  component: EmailVerificationForm,
+  props: {
+    currentUser: createCurrentUser('verified'),
+    onSubmit(values) {
+      console.log('submit values:', values);
+    },
+  },
+  group: 'forms',
+};

src/containers/EmailVerificationForm/EmailVerificationForm.js

@@ -25,6 +25,9 @@ const EmailVerificationFormComponent = props => {
     </div>
   );
 
+  const submitInProgress = submitting || inProgress;
+  const submitDisabled = submitInProgress;
+
   const verifyEmail = (
     <div className={css.root}>
       <div>
@@ -45,7 +48,7 @@ const EmailVerificationFormComponent = props => {
         <Field component="input" type="hidden" name="verificationToken" />
 
         <div className={css.bottomWrapper}>
-          <PrimaryButton type="submit" disabled={submitting || inProgress}>
+          <PrimaryButton type="submit" inProgress={submitInProgress} disabled={submitDisabled}>
 
             {submitting || inProgress
               ? <FormattedMessage id="EmailVerificationForm.verifying" />

src/examples.js

@@ -52,6 +52,8 @@ import * as EditListingPhotosForm
   from './containers/EditListingPhotosForm/EditListingPhotosForm.example';
 import * as EditListingPricingForm
   from './containers/EditListingPricingForm/EditListingPricingForm.example';
+import * as EmailVerificationForm
+  from './containers/EmailVerificationForm/EmailVerificationForm.example';
 import * as LoginForm from './containers/LoginForm/LoginForm.example';
 import * as PasswordRecoveryForm
   from './containers/PasswordRecoveryForm/PasswordRecoveryForm.example';
@@ -78,6 +80,7 @@ export {
   EditListingPhotosForm,
   EditListingPricingForm,
   EditListingWizard,
+  EmailVerificationForm,
   ExpandingTextarea,
   IconBannedUser,
   IconCheckmark,