diff options
Diffstat (limited to 'src/components/auth/Login.js')
-rw-r--r-- | src/components/auth/Login.js | 46 |
1 files changed, 43 insertions, 3 deletions
diff --git a/src/components/auth/Login.js b/src/components/auth/Login.js index 5d21f8b60..e25121de0 100644 --- a/src/components/auth/Login.js +++ b/src/components/auth/Login.js | |||
@@ -1,11 +1,13 @@ | |||
1 | /* eslint jsx-a11y/anchor-is-valid: 0 */ | ||
1 | import React, { Component } from 'react'; | 2 | import React, { Component } from 'react'; |
2 | import PropTypes from 'prop-types'; | 3 | import PropTypes from 'prop-types'; |
3 | import { observer } from 'mobx-react'; | 4 | import { observer, inject } from 'mobx-react'; |
4 | import { defineMessages, intlShape } from 'react-intl'; | 5 | import { defineMessages, intlShape } from 'react-intl'; |
5 | 6 | ||
6 | import { isDevMode, useLiveAPI } from '../../environment'; | 7 | import { isDevMode, useLiveAPI } from '../../environment'; |
7 | import Form from '../../lib/Form'; | 8 | import Form from '../../lib/Form'; |
8 | import { required, email } from '../../helpers/validation-helpers'; | 9 | import { required, email } from '../../helpers/validation-helpers'; |
10 | import serverlessLogin from '../../helpers/serverless-helpers'; | ||
9 | import Input from '../ui/Input'; | 11 | import Input from '../ui/Input'; |
10 | import Button from '../ui/Button'; | 12 | import Button from '../ui/Button'; |
11 | import Link from '../ui/Link'; | 13 | import Link from '../ui/Link'; |
@@ -34,6 +36,14 @@ const messages = defineMessages({ | |||
34 | id: 'login.invalidCredentials', | 36 | id: 'login.invalidCredentials', |
35 | defaultMessage: '!!!Email or password not valid', | 37 | defaultMessage: '!!!Email or password not valid', |
36 | }, | 38 | }, |
39 | customServerQuestion: { | ||
40 | id: 'login.customServerQuestion', | ||
41 | defaultMessage: '!!!Using a Franz account to log in?', | ||
42 | }, | ||
43 | customServerSuggestion: { | ||
44 | id: 'login.customServerSuggestion', | ||
45 | defaultMessage: '!!!Try importing your Franz account into Ferdi', | ||
46 | }, | ||
37 | tokenExpired: { | 47 | tokenExpired: { |
38 | id: 'login.tokenExpired', | 48 | id: 'login.tokenExpired', |
39 | defaultMessage: '!!!Your session expired, please login again.', | 49 | defaultMessage: '!!!Your session expired, please login again.', |
@@ -46,13 +56,21 @@ const messages = defineMessages({ | |||
46 | id: 'login.link.signup', | 56 | id: 'login.link.signup', |
47 | defaultMessage: '!!!Create a free account', | 57 | defaultMessage: '!!!Create a free account', |
48 | }, | 58 | }, |
59 | changeServer: { | ||
60 | id: 'login.changeServer', | ||
61 | defaultMessage: '!!!Change server', | ||
62 | }, | ||
63 | serverless: { | ||
64 | id: 'services.serverless', | ||
65 | defaultMessage: '!!!Use Ferdi without an Account', | ||
66 | }, | ||
49 | passwordLink: { | 67 | passwordLink: { |
50 | id: 'login.link.password', | 68 | id: 'login.link.password', |
51 | defaultMessage: '!!!Forgot password', | 69 | defaultMessage: '!!!Forgot password', |
52 | }, | 70 | }, |
53 | }); | 71 | }); |
54 | 72 | ||
55 | export default @observer class Login extends Component { | 73 | export default @inject('actions') @observer class Login extends Component { |
56 | static propTypes = { | 74 | static propTypes = { |
57 | onSubmit: PropTypes.func.isRequired, | 75 | onSubmit: PropTypes.func.isRequired, |
58 | isSubmitting: PropTypes.bool.isRequired, | 76 | isSubmitting: PropTypes.bool.isRequired, |
@@ -61,6 +79,7 @@ export default @observer class Login extends Component { | |||
61 | signupRoute: PropTypes.string.isRequired, | 79 | signupRoute: PropTypes.string.isRequired, |
62 | passwordRoute: PropTypes.string.isRequired, | 80 | passwordRoute: PropTypes.string.isRequired, |
63 | error: globalErrorPropType.isRequired, | 81 | error: globalErrorPropType.isRequired, |
82 | actions: PropTypes.object.isRequired, | ||
64 | }; | 83 | }; |
65 | 84 | ||
66 | static contextTypes = { | 85 | static contextTypes = { |
@@ -95,6 +114,10 @@ export default @observer class Login extends Component { | |||
95 | }); | 114 | }); |
96 | } | 115 | } |
97 | 116 | ||
117 | useLocalServer() { | ||
118 | serverlessLogin(this.props.actions); | ||
119 | } | ||
120 | |||
98 | render() { | 121 | render() { |
99 | const { form } = this; | 122 | const { form } = this; |
100 | const { intl } = this.context; | 123 | const { intl } = this.context; |
@@ -137,7 +160,22 @@ export default @observer class Login extends Component { | |||
137 | showPasswordToggle | 160 | showPasswordToggle |
138 | /> | 161 | /> |
139 | {error.code === 'invalid-credentials' && ( | 162 | {error.code === 'invalid-credentials' && ( |
140 | <p className="error-message center">{intl.formatMessage(messages.invalidCredentials)}</p> | 163 | <> |
164 | <p className="error-message center">{intl.formatMessage(messages.invalidCredentials)}</p> | ||
165 | { window.ferdi.stores.settings.all.app.server !== 'https://api.franzinfra.com' && ( | ||
166 | <p className="error-message center"> | ||
167 | {intl.formatMessage(messages.customServerQuestion)} | ||
168 | {' '} | ||
169 | <Link | ||
170 | to={`${window.ferdi.stores.settings.all.app.server.replace('v1', '')}/import`} | ||
171 | target="_blank" | ||
172 | style={{ cursor: 'pointer', textDecoration: 'underline' }} | ||
173 | > | ||
174 | {intl.formatMessage(messages.customServerSuggestion)} | ||
175 | </Link> | ||
176 | </p> | ||
177 | )} | ||
178 | </> | ||
141 | )} | 179 | )} |
142 | {isSubmitting ? ( | 180 | {isSubmitting ? ( |
143 | <Button | 181 | <Button |
@@ -156,6 +194,8 @@ export default @observer class Login extends Component { | |||
156 | )} | 194 | )} |
157 | </form> | 195 | </form> |
158 | <div className="auth__links"> | 196 | <div className="auth__links"> |
197 | <Link to="/settings/app">{intl.formatMessage(messages.changeServer)}</Link> | ||
198 | <a onClick={this.useLocalServer.bind(this)}>{intl.formatMessage(messages.serverless)}</a> | ||
159 | <Link to={signupRoute}>{intl.formatMessage(messages.signupLink)}</Link> | 199 | <Link to={signupRoute}>{intl.formatMessage(messages.signupLink)}</Link> |
160 | <Link to={passwordRoute}>{intl.formatMessage(messages.passwordLink)}</Link> | 200 | <Link to={passwordRoute}>{intl.formatMessage(messages.passwordLink)}</Link> |
161 | </div> | 201 | </div> |