diff options
Diffstat (limited to 'src/components/auth/Invite.js')
-rw-r--r-- | src/components/auth/Invite.js | 54 |
1 files changed, 42 insertions, 12 deletions
diff --git a/src/components/auth/Invite.js b/src/components/auth/Invite.js index a420f98a2..1fe594d73 100644 --- a/src/components/auth/Invite.js +++ b/src/components/auth/Invite.js | |||
@@ -30,6 +30,10 @@ const messages = defineMessages({ | |||
30 | id: 'invite.skip.label', | 30 | id: 'invite.skip.label', |
31 | defaultMessage: '!!!I want to do this later', | 31 | defaultMessage: '!!!I want to do this later', |
32 | }, | 32 | }, |
33 | noEmailAddresses: { | ||
34 | id: 'invite.error.noEmails', | ||
35 | defaultMessage: '!!!At least one email address is required', | ||
36 | } | ||
33 | }); | 37 | }); |
34 | 38 | ||
35 | @observer | 39 | @observer |
@@ -45,17 +49,17 @@ export default class Invite extends Component { | |||
45 | form = new Form({ | 49 | form = new Form({ |
46 | fields: { | 50 | fields: { |
47 | invite: [...Array(3).fill({ | 51 | invite: [...Array(3).fill({ |
48 | name: { | 52 | fields: { |
49 | label: this.context.intl.formatMessage(messages.nameLabel), | 53 | name: { |
50 | // value: '', | 54 | label: this.context.intl.formatMessage(messages.nameLabel), |
51 | placeholder: this.context.intl.formatMessage(messages.nameLabel), | 55 | placeholder: this.context.intl.formatMessage(messages.nameLabel), |
52 | }, | 56 | }, |
53 | email: { | 57 | email: { |
54 | label: this.context.intl.formatMessage(messages.emailLabel), | 58 | label: this.context.intl.formatMessage(messages.emailLabel), |
55 | // value: '', | 59 | placeholder: this.context.intl.formatMessage(messages.emailLabel), |
56 | validators: [email], | 60 | validators: [email], |
57 | placeholder: this.context.intl.formatMessage(messages.emailLabel), | 61 | } |
58 | }, | 62 | } |
59 | })], | 63 | })], |
60 | }, | 64 | }, |
61 | }, this.context.intl); | 65 | }, this.context.intl); |
@@ -64,6 +68,21 @@ export default class Invite extends Component { | |||
64 | e.preventDefault(); | 68 | e.preventDefault(); |
65 | this.form.submit({ | 69 | this.form.submit({ |
66 | onSuccess: (form) => { | 70 | onSuccess: (form) => { |
71 | |||
72 | this.props.onSubmit({ | ||
73 | invites: form.values().invite, | ||
74 | from: this.props.from | ||
75 | }); | ||
76 | |||
77 | const atLeastOneEmailAddress = form.$('invite') | ||
78 | .map(invite => {return invite.$('email').value}) | ||
79 | .some(email => email.trim() !== '') | ||
80 | |||
81 | if (!atLeastOneEmailAddress) { | ||
82 | form.invalidate('no-email-addresses') | ||
83 | return | ||
84 | } | ||
85 | |||
67 | this.props.onSubmit({ invites: form.values().invite }); | 86 | this.props.onSubmit({ invites: form.values().invite }); |
68 | }, | 87 | }, |
69 | onError: () => {}, | 88 | onError: () => {}, |
@@ -73,6 +92,11 @@ export default class Invite extends Component { | |||
73 | render() { | 92 | render() { |
74 | const { form } = this; | 93 | const { form } = this; |
75 | const { intl } = this.context; | 94 | const { intl } = this.context; |
95 | const { from } = this.props; | ||
96 | |||
97 | const atLeastOneEmailAddress = form.$('invite') | ||
98 | .map(invite => {return invite.$('email').value}) | ||
99 | .some(email => email.trim() !== '') | ||
76 | 100 | ||
77 | return ( | 101 | return ( |
78 | <div className="auth__container auth__container--signup"> | 102 | <div className="auth__container auth__container--signup"> |
@@ -93,13 +117,19 @@ export default class Invite extends Component { | |||
93 | </div> | 117 | </div> |
94 | </div> | 118 | </div> |
95 | ))} | 119 | ))} |
120 | {form.error === 'no-email-addresses' && ( | ||
121 | <p className="franz-form__error invite-form__error"> | ||
122 | {intl.formatMessage(messages.noEmailAddresses)} | ||
123 | </p> | ||
124 | )} | ||
96 | <Button | 125 | <Button |
97 | type="submit" | 126 | type="submit" |
98 | className="auth__button" | 127 | className="auth__button" |
128 | disabled={!atLeastOneEmailAddress} | ||
99 | label={intl.formatMessage(messages.submitButtonLabel)} | 129 | label={intl.formatMessage(messages.submitButtonLabel)} |
100 | /> | 130 | /> |
101 | <Link | 131 | <Link |
102 | to="/" | 132 | to={ !!from ? from : '/'} |
103 | className="franz-form__button franz-form__button--secondary auth__button auth__button--skip" | 133 | className="franz-form__button franz-form__button--secondary auth__button auth__button--skip" |
104 | > | 134 | > |
105 | {intl.formatMessage(messages.skipButtonLabel)} | 135 | {intl.formatMessage(messages.skipButtonLabel)} |