diff options
author | 2019-03-28 16:23:17 +0100 | |
---|---|---|
committer | 2019-03-28 16:23:17 +0100 | |
commit | 7941831bf773b49944001c095a1949a1bdec2cf2 (patch) | |
tree | 5dbcbf097e340c381617410e032c2db6b811096e /src/components | |
parent | improve styling of workspace switch indicator (diff) | |
download | ferdium-app-7941831bf773b49944001c095a1949a1bdec2cf2.tar.gz ferdium-app-7941831bf773b49944001c095a1949a1bdec2cf2.tar.zst ferdium-app-7941831bf773b49944001c095a1949a1bdec2cf2.zip |
add workspace premium notice to dashboard
Diffstat (limited to 'src/components')
-rw-r--r-- | src/components/layout/Sidebar.js | 2 | ||||
-rw-r--r-- | src/components/settings/navigation/SettingsNavigation.js | 2 | ||||
-rw-r--r-- | src/components/settings/services/EditServiceForm.js | 10 | ||||
-rw-r--r-- | src/components/settings/settings/EditSettingsForm.js | 1 | ||||
-rw-r--r-- | src/components/ui/PremiumFeatureContainer/index.js | 21 | ||||
-rw-r--r-- | src/components/ui/PremiumFeatureContainer/styles.js | 3 |
6 files changed, 32 insertions, 7 deletions
diff --git a/src/components/layout/Sidebar.js b/src/components/layout/Sidebar.js index 4fa5e79de..327f76392 100644 --- a/src/components/layout/Sidebar.js +++ b/src/components/layout/Sidebar.js | |||
@@ -90,7 +90,7 @@ export default @observer class Sidebar extends Component { | |||
90 | enableToolTip={() => this.enableToolTip()} | 90 | enableToolTip={() => this.enableToolTip()} |
91 | disableToolTip={() => this.disableToolTip()} | 91 | disableToolTip={() => this.disableToolTip()} |
92 | /> | 92 | /> |
93 | {workspaceStore.isFeatureActive ? ( | 93 | {workspaceStore.isFeatureEnabled ? ( |
94 | <button | 94 | <button |
95 | type="button" | 95 | type="button" |
96 | onClick={() => { | 96 | onClick={() => { |
diff --git a/src/components/settings/navigation/SettingsNavigation.js b/src/components/settings/navigation/SettingsNavigation.js index a0eb7d796..dc3c1d6f1 100644 --- a/src/components/settings/navigation/SettingsNavigation.js +++ b/src/components/settings/navigation/SettingsNavigation.js | |||
@@ -69,7 +69,7 @@ export default @inject('stores') @observer class SettingsNavigation extends Comp | |||
69 | {' '} | 69 | {' '} |
70 | <span className="badge">{serviceCount}</span> | 70 | <span className="badge">{serviceCount}</span> |
71 | </Link> | 71 | </Link> |
72 | {workspaceStore.isFeatureActive ? ( | 72 | {workspaceStore.isFeatureEnabled ? ( |
73 | <Link | 73 | <Link |
74 | to="/settings/workspaces" | 74 | to="/settings/workspaces" |
75 | className="settings-navigation__link" | 75 | className="settings-navigation__link" |
diff --git a/src/components/settings/services/EditServiceForm.js b/src/components/settings/services/EditServiceForm.js index 21616b5de..4ba2eb844 100644 --- a/src/components/settings/services/EditServiceForm.js +++ b/src/components/settings/services/EditServiceForm.js | |||
@@ -341,14 +341,20 @@ export default @observer class EditServiceForm extends Component { | |||
341 | </div> | 341 | </div> |
342 | </div> | 342 | </div> |
343 | 343 | ||
344 | <PremiumFeatureContainer condition={isSpellcheckerPremiumFeature}> | 344 | <PremiumFeatureContainer |
345 | condition={isSpellcheckerPremiumFeature} | ||
346 | gaEventInfo={{ category: 'User', event: 'upgrade', label: 'spellchecker' }} | ||
347 | > | ||
345 | <div className="settings__settings-group"> | 348 | <div className="settings__settings-group"> |
346 | <Select field={form.$('spellcheckerLanguage')} /> | 349 | <Select field={form.$('spellcheckerLanguage')} /> |
347 | </div> | 350 | </div> |
348 | </PremiumFeatureContainer> | 351 | </PremiumFeatureContainer> |
349 | 352 | ||
350 | {isProxyFeatureEnabled && ( | 353 | {isProxyFeatureEnabled && ( |
351 | <PremiumFeatureContainer condition={isProxyPremiumFeature}> | 354 | <PremiumFeatureContainer |
355 | condition={isProxyPremiumFeature} | ||
356 | gaEventInfo={{ category: 'User', event: 'upgrade', label: 'proxy' }} | ||
357 | > | ||
352 | <div className="settings__settings-group"> | 358 | <div className="settings__settings-group"> |
353 | <h3> | 359 | <h3> |
354 | {intl.formatMessage(messages.headlineProxy)} | 360 | {intl.formatMessage(messages.headlineProxy)} |
diff --git a/src/components/settings/settings/EditSettingsForm.js b/src/components/settings/settings/EditSettingsForm.js index a92e559f3..8429d0ecb 100644 --- a/src/components/settings/settings/EditSettingsForm.js +++ b/src/components/settings/settings/EditSettingsForm.js | |||
@@ -170,6 +170,7 @@ export default @observer class EditSettingsForm extends Component { | |||
170 | <Select field={form.$('locale')} showLabel={false} /> | 170 | <Select field={form.$('locale')} showLabel={false} /> |
171 | <PremiumFeatureContainer | 171 | <PremiumFeatureContainer |
172 | condition={isSpellcheckerPremiumFeature} | 172 | condition={isSpellcheckerPremiumFeature} |
173 | gaEventInfo={{ category: 'User', event: 'upgrade', label: 'spellchecker' }} | ||
173 | > | 174 | > |
174 | <Fragment> | 175 | <Fragment> |
175 | <Toggle | 176 | <Toggle |
diff --git a/src/components/ui/PremiumFeatureContainer/index.js b/src/components/ui/PremiumFeatureContainer/index.js index 67cd6af0b..3c1e0fac3 100644 --- a/src/components/ui/PremiumFeatureContainer/index.js +++ b/src/components/ui/PremiumFeatureContainer/index.js | |||
@@ -9,6 +9,7 @@ import { oneOrManyChildElements } from '../../../prop-types'; | |||
9 | import UserStore from '../../../stores/UserStore'; | 9 | import UserStore from '../../../stores/UserStore'; |
10 | 10 | ||
11 | import styles from './styles'; | 11 | import styles from './styles'; |
12 | import { gaEvent } from '../../../lib/analytics'; | ||
12 | 13 | ||
13 | const messages = defineMessages({ | 14 | const messages = defineMessages({ |
14 | action: { | 15 | action: { |
@@ -17,14 +18,21 @@ const messages = defineMessages({ | |||
17 | }, | 18 | }, |
18 | }); | 19 | }); |
19 | 20 | ||
20 | export default @inject('stores', 'actions') @injectSheet(styles) @observer class PremiumFeatureContainer extends Component { | 21 | @inject('stores', 'actions') @injectSheet(styles) @observer |
22 | class PremiumFeatureContainer extends Component { | ||
21 | static propTypes = { | 23 | static propTypes = { |
22 | classes: PropTypes.object.isRequired, | 24 | classes: PropTypes.object.isRequired, |
23 | condition: PropTypes.bool, | 25 | condition: PropTypes.bool, |
26 | gaEventInfo: PropTypes.shape({ | ||
27 | category: PropTypes.string.isRequired, | ||
28 | event: PropTypes.string.isRequired, | ||
29 | label: PropTypes.string, | ||
30 | }), | ||
24 | }; | 31 | }; |
25 | 32 | ||
26 | static defaultProps = { | 33 | static defaultProps = { |
27 | condition: true, | 34 | condition: true, |
35 | gaEventInfo: null, | ||
28 | }; | 36 | }; |
29 | 37 | ||
30 | static contextTypes = { | 38 | static contextTypes = { |
@@ -38,6 +46,7 @@ export default @inject('stores', 'actions') @injectSheet(styles) @observer class | |||
38 | actions, | 46 | actions, |
39 | condition, | 47 | condition, |
40 | stores, | 48 | stores, |
49 | gaEventInfo, | ||
41 | } = this.props; | 50 | } = this.props; |
42 | 51 | ||
43 | const { intl } = this.context; | 52 | const { intl } = this.context; |
@@ -49,7 +58,13 @@ export default @inject('stores', 'actions') @injectSheet(styles) @observer class | |||
49 | <button | 58 | <button |
50 | className={classes.actionButton} | 59 | className={classes.actionButton} |
51 | type="button" | 60 | type="button" |
52 | onClick={() => actions.ui.openSettings({ path: 'user' })} | 61 | onClick={() => { |
62 | actions.ui.openSettings({ path: 'user' }); | ||
63 | if (gaEventInfo) { | ||
64 | const { category, event, label } = gaEventInfo; | ||
65 | gaEvent(category, event, label); | ||
66 | } | ||
67 | }} | ||
53 | > | 68 | > |
54 | {intl.formatMessage(messages.action)} | 69 | {intl.formatMessage(messages.action)} |
55 | </button> | 70 | </button> |
@@ -73,3 +88,5 @@ PremiumFeatureContainer.wrappedComponent.propTypes = { | |||
73 | }).isRequired, | 88 | }).isRequired, |
74 | }).isRequired, | 89 | }).isRequired, |
75 | }; | 90 | }; |
91 | |||
92 | export default PremiumFeatureContainer; | ||
diff --git a/src/components/ui/PremiumFeatureContainer/styles.js b/src/components/ui/PremiumFeatureContainer/styles.js index 81d6666c6..615ed0a79 100644 --- a/src/components/ui/PremiumFeatureContainer/styles.js +++ b/src/components/ui/PremiumFeatureContainer/styles.js | |||
@@ -6,6 +6,7 @@ export default theme => ({ | |||
6 | padding: 20, | 6 | padding: 20, |
7 | 'border-radius': theme.borderRadius, | 7 | 'border-radius': theme.borderRadius, |
8 | pointerEvents: 'none', | 8 | pointerEvents: 'none', |
9 | height: 'auto', | ||
9 | }, | 10 | }, |
10 | titleContainer: { | 11 | titleContainer: { |
11 | display: 'flex', | 12 | display: 'flex', |
@@ -26,7 +27,7 @@ export default theme => ({ | |||
26 | content: { | 27 | content: { |
27 | opacity: 0.5, | 28 | opacity: 0.5, |
28 | 'margin-top': 20, | 29 | 'margin-top': 20, |
29 | '& :last-child': { | 30 | '& > :last-child': { |
30 | 'margin-bottom': 0, | 31 | 'margin-bottom': 0, |
31 | }, | 32 | }, |
32 | }, | 33 | }, |