diff options
author | Amine Mouafik <amine@mouafik.fr> | 2019-05-12 20:00:41 +0700 |
---|---|---|
committer | Amine Mouafik <amine@mouafik.fr> | 2019-05-12 20:00:41 +0700 |
commit | d8a1d5f9151cc31f4c2b5c0096a35e49b2c74d61 (patch) | |
tree | 3974d449d8ef389fc61bf880ae758b5debc22a80 /src/components/settings/navigation/SettingsNavigation.js | |
parent | Use dark background in SVG logo (diff) | |
parent | Update CHANGELOG.md (diff) | |
download | ferdium-app-d8a1d5f9151cc31f4c2b5c0096a35e49b2c74d61.tar.gz ferdium-app-d8a1d5f9151cc31f4c2b5c0096a35e49b2c74d61.tar.zst ferdium-app-d8a1d5f9151cc31f4c2b5c0096a35e49b2c74d61.zip |
Merge tag 'v5.1.0'
# Conflicts:
# README.md
# src/components/layout/AppLayout.js
Diffstat (limited to 'src/components/settings/navigation/SettingsNavigation.js')
-rw-r--r-- | src/components/settings/navigation/SettingsNavigation.js | 46 |
1 files changed, 45 insertions, 1 deletions
diff --git a/src/components/settings/navigation/SettingsNavigation.js b/src/components/settings/navigation/SettingsNavigation.js index 953f702f8..df4b3b3b2 100644 --- a/src/components/settings/navigation/SettingsNavigation.js +++ b/src/components/settings/navigation/SettingsNavigation.js | |||
@@ -2,8 +2,12 @@ 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, intlShape } from 'react-intl'; |
4 | import { inject, observer } from 'mobx-react'; | 4 | import { inject, observer } from 'mobx-react'; |
5 | import { ProBadge } from '@meetfranz/ui'; | ||
5 | 6 | ||
6 | import Link from '../../ui/Link'; | 7 | import Link from '../../ui/Link'; |
8 | import { workspaceStore } from '../../../features/workspaces'; | ||
9 | import UIStore from '../../../stores/UIStore'; | ||
10 | import UserStore from '../../../stores/UserStore'; | ||
7 | 11 | ||
8 | const messages = defineMessages({ | 12 | const messages = defineMessages({ |
9 | availableServices: { | 13 | availableServices: { |
@@ -14,10 +18,18 @@ const messages = defineMessages({ | |||
14 | id: 'settings.navigation.yourServices', | 18 | id: 'settings.navigation.yourServices', |
15 | defaultMessage: '!!!Your services', | 19 | defaultMessage: '!!!Your services', |
16 | }, | 20 | }, |
21 | yourWorkspaces: { | ||
22 | id: 'settings.navigation.yourWorkspaces', | ||
23 | defaultMessage: '!!!Your workspaces', | ||
24 | }, | ||
17 | account: { | 25 | account: { |
18 | id: 'settings.navigation.account', | 26 | id: 'settings.navigation.account', |
19 | defaultMessage: '!!!Account', | 27 | defaultMessage: '!!!Account', |
20 | }, | 28 | }, |
29 | team: { | ||
30 | id: 'settings.navigation.team', | ||
31 | defaultMessage: '!!!Manage Team', | ||
32 | }, | ||
21 | settings: { | 33 | settings: { |
22 | id: 'settings.navigation.settings', | 34 | id: 'settings.navigation.settings', |
23 | defaultMessage: '!!!Settings', | 35 | defaultMessage: '!!!Settings', |
@@ -34,7 +46,12 @@ const messages = defineMessages({ | |||
34 | 46 | ||
35 | export default @inject('stores') @observer class SettingsNavigation extends Component { | 47 | export default @inject('stores') @observer class SettingsNavigation extends Component { |
36 | static propTypes = { | 48 | static propTypes = { |
49 | stores: PropTypes.shape({ | ||
50 | ui: PropTypes.instanceOf(UIStore).isRequired, | ||
51 | user: PropTypes.instanceOf(UserStore).isRequired, | ||
52 | }).isRequired, | ||
37 | serviceCount: PropTypes.number.isRequired, | 53 | serviceCount: PropTypes.number.isRequired, |
54 | workspaceCount: PropTypes.number.isRequired, | ||
38 | }; | 55 | }; |
39 | 56 | ||
40 | static contextTypes = { | 57 | static contextTypes = { |
@@ -42,7 +59,9 @@ export default @inject('stores') @observer class SettingsNavigation extends Comp | |||
42 | }; | 59 | }; |
43 | 60 | ||
44 | render() { | 61 | render() { |
45 | const { serviceCount } = this.props; | 62 | const { serviceCount, workspaceCount, stores } = this.props; |
63 | const { isDarkThemeActive } = stores.ui; | ||
64 | const { router, user } = stores; | ||
46 | const { intl } = this.context; | 65 | const { intl } = this.context; |
47 | 66 | ||
48 | return ( | 67 | return ( |
@@ -63,6 +82,21 @@ export default @inject('stores') @observer class SettingsNavigation extends Comp | |||
63 | {' '} | 82 | {' '} |
64 | <span className="badge">{serviceCount}</span> | 83 | <span className="badge">{serviceCount}</span> |
65 | </Link> | 84 | </Link> |
85 | {workspaceStore.isFeatureEnabled ? ( | ||
86 | <Link | ||
87 | to="/settings/workspaces" | ||
88 | className="settings-navigation__link" | ||
89 | activeClassName="is-active" | ||
90 | > | ||
91 | {intl.formatMessage(messages.yourWorkspaces)} | ||
92 | {' '} | ||
93 | {workspaceStore.isPremiumUpgradeRequired ? ( | ||
94 | <ProBadge inverted={!isDarkThemeActive && workspaceStore.isSettingsRouteActive} /> | ||
95 | ) : ( | ||
96 | <span className="badge">{workspaceCount}</span> | ||
97 | )} | ||
98 | </Link> | ||
99 | ) : null} | ||
66 | <Link | 100 | <Link |
67 | to="/settings/user" | 101 | to="/settings/user" |
68 | className="settings-navigation__link" | 102 | className="settings-navigation__link" |
@@ -71,6 +105,16 @@ export default @inject('stores') @observer class SettingsNavigation extends Comp | |||
71 | {intl.formatMessage(messages.account)} | 105 | {intl.formatMessage(messages.account)} |
72 | </Link> | 106 | </Link> |
73 | <Link | 107 | <Link |
108 | to="/settings/team" | ||
109 | className="settings-navigation__link" | ||
110 | activeClassName="is-active" | ||
111 | > | ||
112 | {intl.formatMessage(messages.team)} | ||
113 | {!user.data.isPremium && ( | ||
114 | <ProBadge inverted={!isDarkThemeActive && router.location.pathname === '/settings/team'} /> | ||
115 | )} | ||
116 | </Link> | ||
117 | <Link | ||
74 | to="/settings/app" | 118 | to="/settings/app" |
75 | className="settings-navigation__link" | 119 | className="settings-navigation__link" |
76 | activeClassName="is-active" | 120 | activeClassName="is-active" |