diff options
author | 2018-01-19 17:26:17 +0100 | |
---|---|---|
committer | 2018-01-19 17:26:17 +0100 | |
commit | 56520969f508c1db257d7573962ad6b762205e56 (patch) | |
tree | 24b13a491da0d72ee8d6010cbb8d8b44aa81c7ac /src | |
parent | implemented check for at least one email address (diff) | |
download | ferdium-app-56520969f508c1db257d7573962ad6b762205e56.tar.gz ferdium-app-56520969f508c1db257d7573962ad6b762205e56.tar.zst ferdium-app-56520969f508c1db257d7573962ad6b762205e56.zip |
alternative UX implementation of check for email address count > 0
comment out line 122 to test
Diffstat (limited to 'src')
-rw-r--r-- | src/components/auth/Invite.js | 19 | ||||
-rw-r--r-- | src/i18n/locales/en-US.json | 1 | ||||
-rw-r--r-- | src/styles/invite.scss | 4 | ||||
-rw-r--r-- | src/styles/main.scss | 1 |
4 files changed, 25 insertions, 0 deletions
diff --git a/src/components/auth/Invite.js b/src/components/auth/Invite.js index 3eb1f2765..c4c35d538 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 |
@@ -64,6 +68,16 @@ 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 | const atLeastOneEmailAddress = form.$('invite') | ||
73 | .map(invite => {return invite.$('email').value}) | ||
74 | .some(email => email.trim() !== '') | ||
75 | |||
76 | if (!atLeastOneEmailAddress) { | ||
77 | form.invalidate('no-email-addresses') | ||
78 | return | ||
79 | } | ||
80 | |||
67 | this.props.onSubmit({ invites: form.values().invite }); | 81 | this.props.onSubmit({ invites: form.values().invite }); |
68 | }, | 82 | }, |
69 | onError: () => {}, | 83 | onError: () => {}, |
@@ -97,6 +111,11 @@ export default class Invite extends Component { | |||
97 | </div> | 111 | </div> |
98 | </div> | 112 | </div> |
99 | ))} | 113 | ))} |
114 | {form.error === 'no-email-addresses' && ( | ||
115 | <p className="franz-form__error invite-form__error"> | ||
116 | {intl.formatMessage(messages.noEmailAddresses)} | ||
117 | </p> | ||
118 | )} | ||
100 | <Button | 119 | <Button |
101 | type="submit" | 120 | type="submit" |
102 | className="auth__button" | 121 | className="auth__button" |
diff --git a/src/i18n/locales/en-US.json b/src/i18n/locales/en-US.json index 63d7ce60b..f58d5634b 100644 --- a/src/i18n/locales/en-US.json +++ b/src/i18n/locales/en-US.json | |||
@@ -45,6 +45,7 @@ | |||
45 | "invite.name.label": "Name", | 45 | "invite.name.label": "Name", |
46 | "invite.email.label": "Email address", | 46 | "invite.email.label": "Email address", |
47 | "invite.skip.label": "I want to do this later", | 47 | "invite.skip.label": "I want to do this later", |
48 | "invite.error.noEmails": "At least one email address is required", | ||
48 | "subscription.submit.label": "I want to support the development of Franz", | 49 | "subscription.submit.label": "I want to support the development of Franz", |
49 | "subscription.paymentSessionError": "Could not initialize payment form", | 50 | "subscription.paymentSessionError": "Could not initialize payment form", |
50 | "subscription.includedFeatures": "Paid Franz Premium Supporter Account includes", | 51 | "subscription.includedFeatures": "Paid Franz Premium Supporter Account includes", |
diff --git a/src/styles/invite.scss b/src/styles/invite.scss new file mode 100644 index 000000000..345095da8 --- /dev/null +++ b/src/styles/invite.scss | |||
@@ -0,0 +1,4 @@ | |||
1 | .invite-form__error { | ||
2 | text-align: center; | ||
3 | margin-bottom: 20px !important; /* otherwise overridden by rule: p:last-of-type */ | ||
4 | } | ||
diff --git a/src/styles/main.scss b/src/styles/main.scss index 261396f6f..20f1803e4 100644 --- a/src/styles/main.scss +++ b/src/styles/main.scss | |||
@@ -18,6 +18,7 @@ $mdi-font-path: '../node_modules/mdi/fonts'; | |||
18 | @import './type.scss'; | 18 | @import './type.scss'; |
19 | @import './welcome.scss'; | 19 | @import './welcome.scss'; |
20 | @import './auth.scss'; | 20 | @import './auth.scss'; |
21 | @import './invite.scss'; | ||
21 | @import './tooltip.scss'; | 22 | @import './tooltip.scss'; |
22 | @import './info-bar.scss'; | 23 | @import './info-bar.scss'; |
23 | @import './status-bar-target-url.scss'; | 24 | @import './status-bar-target-url.scss'; |