diff options
Diffstat (limited to 'src/components/settings/navigation/SettingsNavigation.js')
-rw-r--r-- | src/components/settings/navigation/SettingsNavigation.js | 49 |
1 files changed, 25 insertions, 24 deletions
diff --git a/src/components/settings/navigation/SettingsNavigation.js b/src/components/settings/navigation/SettingsNavigation.js index 0a5ace586..72c7faa66 100644 --- a/src/components/settings/navigation/SettingsNavigation.js +++ b/src/components/settings/navigation/SettingsNavigation.js | |||
@@ -1,6 +1,6 @@ | |||
1 | import React, { Component } from 'react'; | 1 | import React, { Component } from 'react'; |
2 | import PropTypes from 'prop-types'; | 2 | import PropTypes from 'prop-types'; |
3 | import { defineMessages, intlShape } from 'react-intl'; | 3 | import { defineMessages, injectIntl } from 'react-intl'; |
4 | import { inject, observer } from 'mobx-react'; | 4 | import { inject, observer } from 'mobx-react'; |
5 | import { RouterStore } from 'mobx-react-router'; | 5 | import { RouterStore } from 'mobx-react-router'; |
6 | 6 | ||
@@ -15,35 +15,37 @@ import globalMessages from '../../../i18n/globalMessages'; | |||
15 | const messages = defineMessages({ | 15 | const messages = defineMessages({ |
16 | availableServices: { | 16 | availableServices: { |
17 | id: 'settings.navigation.availableServices', | 17 | id: 'settings.navigation.availableServices', |
18 | defaultMessage: '!!!Available services', | 18 | defaultMessage: 'Available services', |
19 | }, | 19 | }, |
20 | yourServices: { | 20 | yourServices: { |
21 | id: 'settings.navigation.yourServices', | 21 | id: 'settings.navigation.yourServices', |
22 | defaultMessage: '!!!Your services', | 22 | defaultMessage: 'Your services', |
23 | }, | 23 | }, |
24 | yourWorkspaces: { | 24 | yourWorkspaces: { |
25 | id: 'settings.navigation.yourWorkspaces', | 25 | id: 'settings.navigation.yourWorkspaces', |
26 | defaultMessage: '!!!Your workspaces', | 26 | defaultMessage: 'Your workspaces', |
27 | }, | 27 | }, |
28 | account: { | 28 | account: { |
29 | id: 'settings.navigation.account', | 29 | id: 'settings.navigation.account', |
30 | defaultMessage: '!!!Account', | 30 | defaultMessage: 'Account', |
31 | }, | 31 | }, |
32 | team: { | 32 | team: { |
33 | id: 'settings.navigation.team', | 33 | id: 'settings.navigation.team', |
34 | defaultMessage: '!!!Manage Team', | 34 | defaultMessage: 'Manage Team', |
35 | }, | 35 | }, |
36 | supportFerdi: { | 36 | supportFerdi: { |
37 | id: 'settings.navigation.supportFerdi', | 37 | id: 'settings.navigation.supportFerdi', |
38 | defaultMessage: '!!!About Ferdi', | 38 | defaultMessage: 'About Ferdi', |
39 | }, | 39 | }, |
40 | logout: { | 40 | logout: { |
41 | id: 'settings.navigation.logout', | 41 | id: 'settings.navigation.logout', |
42 | defaultMessage: '!!!Logout', | 42 | defaultMessage: 'Logout', |
43 | }, | 43 | }, |
44 | }); | 44 | }); |
45 | 45 | ||
46 | export default @inject('stores', 'actions') @observer class SettingsNavigation extends Component { | 46 | @inject('stores', 'actions') |
47 | @observer | ||
48 | class SettingsNavigation extends Component { | ||
47 | static propTypes = { | 49 | static propTypes = { |
48 | stores: PropTypes.shape({ | 50 | stores: PropTypes.shape({ |
49 | ui: PropTypes.instanceOf(UIStore).isRequired, | 51 | ui: PropTypes.instanceOf(UIStore).isRequired, |
@@ -58,13 +60,10 @@ export default @inject('stores', 'actions') @observer class SettingsNavigation e | |||
58 | workspaceCount: PropTypes.number.isRequired, | 60 | workspaceCount: PropTypes.number.isRequired, |
59 | }; | 61 | }; |
60 | 62 | ||
61 | static contextTypes = { | ||
62 | intl: intlShape, | ||
63 | }; | ||
64 | |||
65 | handleLoginLogout() { | 63 | handleLoginLogout() { |
66 | const isLoggedIn = Boolean(localStorage.getItem('authToken')); | 64 | const isLoggedIn = Boolean(localStorage.getItem('authToken')); |
67 | const isUsingWithoutAccount = this.props.stores.settings.app.server === LOCAL_SERVER; | 65 | const isUsingWithoutAccount = |
66 | this.props.stores.settings.app.server === LOCAL_SERVER; | ||
68 | 67 | ||
69 | if (isLoggedIn) { | 68 | if (isLoggedIn) { |
70 | // Remove current auth token | 69 | // Remove current auth token |
@@ -82,7 +81,9 @@ export default @inject('stores', 'actions') @observer class SettingsNavigation e | |||
82 | this.props.stores.user.isLoggingOut = true; | 81 | this.props.stores.user.isLoggingOut = true; |
83 | } | 82 | } |
84 | 83 | ||
85 | this.props.stores.router.push(isLoggedIn ? '/auth/logout' : '/auth/welcome'); | 84 | this.props.stores.router.push( |
85 | isLoggedIn ? '/auth/logout' : '/auth/welcome', | ||
86 | ); | ||
86 | 87 | ||
87 | if (isLoggedIn) { | 88 | if (isLoggedIn) { |
88 | // Reload Ferdi, otherwise many settings won't sync correctly with the server | 89 | // Reload Ferdi, otherwise many settings won't sync correctly with the server |
@@ -93,7 +94,7 @@ export default @inject('stores', 'actions') @observer class SettingsNavigation e | |||
93 | 94 | ||
94 | render() { | 95 | render() { |
95 | const { serviceCount, workspaceCount, stores } = this.props; | 96 | const { serviceCount, workspaceCount, stores } = this.props; |
96 | const { intl } = this.context; | 97 | const { intl } = this.props; |
97 | const isLoggedIn = Boolean(localStorage.getItem('authToken')); | 98 | const isLoggedIn = Boolean(localStorage.getItem('authToken')); |
98 | const isUsingWithoutAccount = stores.settings.app.server === LOCAL_SERVER; | 99 | const isUsingWithoutAccount = stores.settings.app.server === LOCAL_SERVER; |
99 | const isUsingFranzServer = stores.settings.app.server === LIVE_FRANZ_API; | 100 | const isUsingFranzServer = stores.settings.app.server === LIVE_FRANZ_API; |
@@ -113,11 +114,8 @@ export default @inject('stores', 'actions') @observer class SettingsNavigation e | |||
113 | activeClassName="is-active" | 114 | activeClassName="is-active" |
114 | disabled={!isLoggedIn} | 115 | disabled={!isLoggedIn} |
115 | > | 116 | > |
116 | {intl.formatMessage(messages.yourServices)} | 117 | {intl.formatMessage(messages.yourServices)}{' '} |
117 | {' '} | 118 | <span className="badge">{serviceCount}</span> |
118 | <span className="badge"> | ||
119 | {serviceCount} | ||
120 | </span> | ||
121 | </Link> | 119 | </Link> |
122 | {workspaceStore.isFeatureEnabled ? ( | 120 | {workspaceStore.isFeatureEnabled ? ( |
123 | <Link | 121 | <Link |
@@ -126,8 +124,7 @@ export default @inject('stores', 'actions') @observer class SettingsNavigation e | |||
126 | activeClassName="is-active" | 124 | activeClassName="is-active" |
127 | disabled={!isLoggedIn} | 125 | disabled={!isLoggedIn} |
128 | > | 126 | > |
129 | {intl.formatMessage(messages.yourWorkspaces)} | 127 | {intl.formatMessage(messages.yourWorkspaces)}{' '} |
130 | {' '} | ||
131 | <span className="badge">{workspaceCount}</span> | 128 | <span className="badge">{workspaceCount}</span> |
132 | </Link> | 129 | </Link> |
133 | ) : null} | 130 | ) : null} |
@@ -172,9 +169,13 @@ export default @inject('stores', 'actions') @observer class SettingsNavigation e | |||
172 | className="settings-navigation__link" | 169 | className="settings-navigation__link" |
173 | onClick={this.handleLoginLogout.bind(this)} | 170 | onClick={this.handleLoginLogout.bind(this)} |
174 | > | 171 | > |
175 | { isLoggedIn && !isUsingWithoutAccount ? intl.formatMessage(messages.logout) : 'Login'} | 172 | {isLoggedIn && !isUsingWithoutAccount |
173 | ? intl.formatMessage(messages.logout) | ||
174 | : 'Login'} | ||
176 | </button> | 175 | </button> |
177 | </div> | 176 | </div> |
178 | ); | 177 | ); |
179 | } | 178 | } |
180 | } | 179 | } |
180 | |||
181 | export default injectIntl(SettingsNavigation); | ||