diff options
Diffstat (limited to 'src/components/settings/navigation')
-rw-r--r-- | src/components/settings/navigation/SettingsNavigation.tsx (renamed from src/components/settings/navigation/SettingsNavigation.jsx) | 70 |
1 files changed, 30 insertions, 40 deletions
diff --git a/src/components/settings/navigation/SettingsNavigation.jsx b/src/components/settings/navigation/SettingsNavigation.tsx index e1242a7fe..95c69027c 100644 --- a/src/components/settings/navigation/SettingsNavigation.jsx +++ b/src/components/settings/navigation/SettingsNavigation.tsx | |||
@@ -1,18 +1,13 @@ | |||
1 | import { Component } from 'react'; | 1 | import { Component } from 'react'; |
2 | import PropTypes from 'prop-types'; | 2 | import { defineMessages, injectIntl, WrappedComponentProps } from 'react-intl'; |
3 | import { defineMessages, injectIntl } from 'react-intl'; | ||
4 | import { inject, observer } from 'mobx-react'; | 3 | import { inject, observer } from 'mobx-react'; |
5 | import { RouterStore } from '@superwf/mobx-react-router'; | ||
6 | |||
7 | import { NavLink } from 'react-router-dom'; | 4 | import { NavLink } from 'react-router-dom'; |
5 | import { StoresProps } from '../../../@types/ferdium-components.types'; | ||
8 | import { | 6 | import { |
9 | LOCAL_SERVER, | 7 | LOCAL_SERVER, |
10 | LIVE_FERDIUM_API, | 8 | LIVE_FERDIUM_API, |
11 | LIVE_FRANZ_API, | 9 | LIVE_FRANZ_API, |
12 | } from '../../../config'; | 10 | } from '../../../config'; |
13 | import UIStore from '../../../stores/UIStore'; | ||
14 | import SettingsStore from '../../../stores/SettingsStore'; | ||
15 | import UserStore from '../../../stores/UserStore'; | ||
16 | import globalMessages from '../../../i18n/globalMessages'; | 11 | import globalMessages from '../../../i18n/globalMessages'; |
17 | 12 | ||
18 | const messages = defineMessages({ | 13 | const messages = defineMessages({ |
@@ -50,40 +45,37 @@ const messages = defineMessages({ | |||
50 | }, | 45 | }, |
51 | }); | 46 | }); |
52 | 47 | ||
53 | class SettingsNavigation extends Component { | 48 | interface IProps extends Partial<StoresProps>, WrappedComponentProps { |
54 | static propTypes = { | 49 | serviceCount: number; |
55 | stores: PropTypes.shape({ | 50 | workspaceCount: number; |
56 | ui: PropTypes.instanceOf(UIStore).isRequired, | 51 | } |
57 | user: PropTypes.instanceOf(UserStore).isRequired, | 52 | |
58 | settings: PropTypes.instanceOf(SettingsStore).isRequired, | 53 | @inject('stores', 'actions') |
59 | router: PropTypes.instanceOf(RouterStore).isRequired, | 54 | @observer |
60 | }).isRequired, | 55 | class SettingsNavigation extends Component<IProps> { |
61 | actions: PropTypes.shape({ | 56 | constructor(props: IProps) { |
62 | settings: PropTypes.instanceOf(SettingsStore).isRequired, | 57 | super(props); |
63 | }).isRequired, | 58 | } |
64 | serviceCount: PropTypes.number.isRequired, | ||
65 | workspaceCount: PropTypes.number.isRequired, | ||
66 | }; | ||
67 | 59 | ||
68 | handleLogout() { | 60 | handleLogout(): void { |
69 | const isUsingWithoutAccount = | 61 | const isUsingWithoutAccount = |
70 | this.props.stores.settings.app.server === LOCAL_SERVER; | 62 | this.props.stores!.settings.app.server === LOCAL_SERVER; |
71 | 63 | ||
72 | // Remove current auth token | 64 | // Remove current auth token |
73 | localStorage.removeItem('authToken'); | 65 | localStorage.removeItem('authToken'); |
74 | 66 | ||
75 | if (isUsingWithoutAccount) { | 67 | if (isUsingWithoutAccount) { |
76 | // Reset server back to Ferdium API | 68 | // Reset server back to Ferdium API |
77 | this.props.actions.settings.update({ | 69 | this.props.actions!.settings.update({ |
78 | type: 'app', | 70 | type: 'app', |
79 | data: { | 71 | data: { |
80 | server: LIVE_FERDIUM_API, | 72 | server: LIVE_FERDIUM_API, |
81 | }, | 73 | }, |
82 | }); | 74 | }); |
83 | } | 75 | } |
84 | this.props.stores.user.isLoggingOut = true; | 76 | this.props.stores!.user.isLoggingOut = true; |
85 | 77 | ||
86 | this.props.stores.router.push('/auth/welcome'); | 78 | this.props.stores!.router.push('/auth/welcome'); |
87 | 79 | ||
88 | // Reload Ferdium, otherwise many settings won't sync correctly with the server | 80 | // Reload Ferdium, otherwise many settings won't sync correctly with the server |
89 | // after logging into another account | 81 | // after logging into another account |
@@ -91,10 +83,9 @@ class SettingsNavigation extends Component { | |||
91 | } | 83 | } |
92 | 84 | ||
93 | render() { | 85 | render() { |
94 | const { serviceCount, workspaceCount, stores } = this.props; | 86 | const { serviceCount, workspaceCount, stores, intl } = this.props; |
95 | const { intl } = this.props; | 87 | const isUsingWithoutAccount = stores!.settings.app.server === LOCAL_SERVER; |
96 | const isUsingWithoutAccount = stores.settings.app.server === LOCAL_SERVER; | 88 | const isUsingFranzServer = stores!.settings.app.server === LIVE_FRANZ_API; |
97 | const isUsingFranzServer = stores.settings.app.server === LIVE_FRANZ_API; | ||
98 | 89 | ||
99 | return ( | 90 | return ( |
100 | <div className="settings-navigation"> | 91 | <div className="settings-navigation"> |
@@ -163,12 +154,12 @@ class SettingsNavigation extends Component { | |||
163 | } | 154 | } |
164 | > | 155 | > |
165 | {intl.formatMessage(globalMessages.settings)} | 156 | {intl.formatMessage(globalMessages.settings)} |
166 | {stores.settings.app.automaticUpdates && | 157 | {stores!.settings.app.automaticUpdates && |
167 | (stores.ui.showServicesUpdatedInfoBar || | 158 | (stores!.ui.showServicesUpdatedInfoBar || |
168 | stores.app.updateStatus === | 159 | stores!.app.updateStatus === |
169 | stores.app.updateStatusTypes.AVAILABLE || | 160 | stores!.app.updateStatusTypes.AVAILABLE || |
170 | stores.app.updateStatus === | 161 | stores!.app.updateStatus === |
171 | stores.app.updateStatusTypes.DOWNLOADED) && ( | 162 | stores!.app.updateStatusTypes.DOWNLOADED) && ( |
172 | <span className="update-available">•</span> | 163 | <span className="update-available">•</span> |
173 | )} | 164 | )} |
174 | </NavLink> | 165 | </NavLink> |
@@ -195,7 +186,8 @@ class SettingsNavigation extends Component { | |||
195 | <span className="settings-navigation__expander" /> | 186 | <span className="settings-navigation__expander" /> |
196 | <button | 187 | <button |
197 | type="button" | 188 | type="button" |
198 | to="/auth/logout" | 189 | // @ts-ignore |
190 | to="/auth/logout" // TODO - [TS DEBT] Need to check if button take this prop | ||
199 | className="settings-navigation__link" | 191 | className="settings-navigation__link" |
200 | onClick={this.handleLogout.bind(this)} | 192 | onClick={this.handleLogout.bind(this)} |
201 | > | 193 | > |
@@ -208,6 +200,4 @@ class SettingsNavigation extends Component { | |||
208 | } | 200 | } |
209 | } | 201 | } |
210 | 202 | ||
211 | export default injectIntl( | 203 | export default injectIntl(SettingsNavigation); |
212 | inject('stores', 'actions')(observer(SettingsNavigation)), | ||
213 | ); | ||