diff options
Diffstat (limited to 'src/components/auth')
-rw-r--r-- | src/components/auth/Invite.js | 82 |
1 files changed, 41 insertions, 41 deletions
diff --git a/src/components/auth/Invite.js b/src/components/auth/Invite.js index 9f85c3152..285ebebcf 100644 --- a/src/components/auth/Invite.js +++ b/src/components/auth/Invite.js | |||
@@ -36,19 +36,19 @@ const messages = defineMessages({ | |||
36 | inviteSuccessInfo: { | 36 | inviteSuccessInfo: { |
37 | id: 'invite.successInfo', | 37 | id: 'invite.successInfo', |
38 | defaultMessage: '!!!Invitations sent successfully', | 38 | defaultMessage: '!!!Invitations sent successfully', |
39 | } | 39 | }, |
40 | }); | 40 | }); |
41 | 41 | ||
42 | @observer | 42 | @observer |
43 | export default class Invite extends Component { | 43 | export default class Invite extends Component { |
44 | static propTypes = { | 44 | static propTypes = { |
45 | onSubmit: PropTypes.func.isRequired, | 45 | onSubmit: PropTypes.func.isRequired, |
46 | from: PropTypes.string, | ||
47 | embed: PropTypes.bool, | 46 | embed: PropTypes.bool, |
47 | isInviteSuccessful: PropTypes.bool.isRequired, | ||
48 | isLoadingInvite: PropTypes.bool.isRequired, | ||
48 | }; | 49 | }; |
49 | 50 | ||
50 | static defaultProps = { | 51 | static defaultProps = { |
51 | from: '/', | ||
52 | embed: false, | 52 | embed: false, |
53 | }; | 53 | }; |
54 | 54 | ||
@@ -59,9 +59,9 @@ export default class Invite extends Component { | |||
59 | state = { showSuccessInfo: false }; | 59 | state = { showSuccessInfo: false }; |
60 | 60 | ||
61 | handlers = { | 61 | handlers = { |
62 | onChange: (field) => { | 62 | onChange: () => { |
63 | this.setState({ showSuccessInfo: false }) | 63 | this.setState({ showSuccessInfo: false }); |
64 | } | 64 | }, |
65 | }; | 65 | }; |
66 | 66 | ||
67 | form = new Form({ | 67 | form = new Form({ |
@@ -87,15 +87,15 @@ export default class Invite extends Component { | |||
87 | 87 | ||
88 | submit(e) { | 88 | submit(e) { |
89 | e.preventDefault(); | 89 | e.preventDefault(); |
90 | 90 | ||
91 | this.form.submit({ | 91 | this.form.submit({ |
92 | onSuccess: (form) => { | 92 | onSuccess: (form) => { |
93 | this.props.onSubmit({ invites: form.values().invite }); | 93 | this.props.onSubmit({ invites: form.values().invite }); |
94 | 94 | ||
95 | this.form.clear() | 95 | this.form.clear(); |
96 | // this.form.$('invite.0.name').focus() // path accepted but does not focus ;( | 96 | // this.form.$('invite.0.name').focus(); // path accepted but does not focus ;( |
97 | document.querySelector('input:first-child').focus() | 97 | document.querySelector('input:first-child').focus(); |
98 | this.setState({ showSuccessInfo: true }) | 98 | this.setState({ showSuccessInfo: true }); |
99 | }, | 99 | }, |
100 | onError: () => {}, | 100 | onError: () => {}, |
101 | }); | 101 | }); |
@@ -127,37 +127,37 @@ export default class Invite extends Component { | |||
127 | </Infobox> | 127 | </Infobox> |
128 | </Appear>)} | 128 | </Appear>)} |
129 | 129 | ||
130 | <form className="franz-form auth__form" onSubmit={e => this.submit(e)}> | 130 | <form className="franz-form auth__form" onSubmit={e => this.submit(e)}> |
131 | {!embed && (<img | 131 | {!embed && (<img |
132 | src="./assets/images/logo.svg" | 132 | src="./assets/images/logo.svg" |
133 | className="auth__logo" | 133 | className="auth__logo" |
134 | alt="" | 134 | alt="" |
135 | />)} | 135 | />)} |
136 | <h1 className={embed && 'invite__embed'}> | 136 | <h1 className={embed && 'invite__embed'}> |
137 | {intl.formatMessage(messages.headline)} | 137 | {intl.formatMessage(messages.headline)} |
138 | </h1> | 138 | </h1> |
139 | {form.$('invite').map(invite => ( | 139 | {form.$('invite').map(invite => ( |
140 | <div className="grid" key={invite.key}> | 140 | <div className="grid" key={invite.key}> |
141 | <div className="grid__row"> | 141 | <div className="grid__row"> |
142 | <Input field={invite.$('name')} showLabel={false} /> | 142 | <Input field={invite.$('name')} showLabel={false} /> |
143 | <Input field={invite.$('email')} showLabel={false} /> | 143 | <Input field={invite.$('email')} showLabel={false} /> |
144 | </div> | ||
144 | </div> | 145 | </div> |
145 | </div> | 146 | ))} |
146 | ))} | 147 | <Button |
147 | <Button | 148 | type="submit" |
148 | type="submit" | 149 | className={sendButtonClassName} |
149 | className={sendButtonClassName} | 150 | disabled={!atLeastOneEmailAddress} |
150 | disabled={!atLeastOneEmailAddress} | 151 | label={intl.formatMessage(messages.submitButtonLabel)} |
151 | label={intl.formatMessage(messages.submitButtonLabel)} | 152 | loaded={!isLoadingInvite} |
152 | loaded={!isLoadingInvite} | 153 | /> |
153 | /> | 154 | {!embed && (<Link |
154 | {!embed && (<Link | 155 | to="/" |
155 | to="/" | 156 | className="franz-form__button franz-form__button--secondary auth__button auth__button--skip" |
156 | className="franz-form__button franz-form__button--secondary auth__button auth__button--skip" | 157 | > |
157 | > | 158 | {intl.formatMessage(messages.skipButtonLabel)} |
158 | {intl.formatMessage(messages.skipButtonLabel)} | 159 | </Link>)} |
159 | </Link>)} | 160 | </form> |
160 | </form> | ||
161 | </div> | 161 | </div> |
162 | ); | 162 | ); |
163 | } | 163 | } |