diff options
Diffstat (limited to 'src/components/ui/PremiumFeatureContainer/index.js')
-rw-r--r-- | src/components/ui/PremiumFeatureContainer/index.js | 22 |
1 files changed, 19 insertions, 3 deletions
diff --git a/src/components/ui/PremiumFeatureContainer/index.js b/src/components/ui/PremiumFeatureContainer/index.js index 3c1e0fac3..8d2746e22 100644 --- a/src/components/ui/PremiumFeatureContainer/index.js +++ b/src/components/ui/PremiumFeatureContainer/index.js | |||
@@ -10,6 +10,7 @@ import UserStore from '../../../stores/UserStore'; | |||
10 | 10 | ||
11 | import styles from './styles'; | 11 | import styles from './styles'; |
12 | import { gaEvent } from '../../../lib/analytics'; | 12 | import { gaEvent } from '../../../lib/analytics'; |
13 | import { FeatureStore } from '../../../features/utils/FeatureStore'; | ||
13 | 14 | ||
14 | const messages = defineMessages({ | 15 | const messages = defineMessages({ |
15 | action: { | 16 | action: { |
@@ -22,7 +23,10 @@ const messages = defineMessages({ | |||
22 | class PremiumFeatureContainer extends Component { | 23 | class PremiumFeatureContainer extends Component { |
23 | static propTypes = { | 24 | static propTypes = { |
24 | classes: PropTypes.object.isRequired, | 25 | classes: PropTypes.object.isRequired, |
25 | condition: PropTypes.bool, | 26 | condition: PropTypes.oneOfType([ |
27 | PropTypes.bool, | ||
28 | PropTypes.func, | ||
29 | ]), | ||
26 | gaEventInfo: PropTypes.shape({ | 30 | gaEventInfo: PropTypes.shape({ |
27 | category: PropTypes.string.isRequired, | 31 | category: PropTypes.string.isRequired, |
28 | event: PropTypes.string.isRequired, | 32 | event: PropTypes.string.isRequired, |
@@ -31,7 +35,7 @@ class PremiumFeatureContainer extends Component { | |||
31 | }; | 35 | }; |
32 | 36 | ||
33 | static defaultProps = { | 37 | static defaultProps = { |
34 | condition: true, | 38 | condition: null, |
35 | gaEventInfo: null, | 39 | gaEventInfo: null, |
36 | }; | 40 | }; |
37 | 41 | ||
@@ -51,7 +55,18 @@ class PremiumFeatureContainer extends Component { | |||
51 | 55 | ||
52 | const { intl } = this.context; | 56 | const { intl } = this.context; |
53 | 57 | ||
54 | return !stores.user.data.isPremium && !!condition ? ( | 58 | let showWrapper = !!condition; |
59 | |||
60 | if (condition === null) { | ||
61 | showWrapper = !stores.user.data.isPremium; | ||
62 | } else if (typeof condition === 'function') { | ||
63 | showWrapper = condition({ | ||
64 | isPremium: stores.user.data.isPremium, | ||
65 | features: stores.features.features, | ||
66 | }); | ||
67 | } | ||
68 | |||
69 | return showWrapper ? ( | ||
55 | <div className={classes.container}> | 70 | <div className={classes.container}> |
56 | <div className={classes.titleContainer}> | 71 | <div className={classes.titleContainer}> |
57 | <p className={classes.title}>Premium Feature</p> | 72 | <p className={classes.title}>Premium Feature</p> |
@@ -81,6 +96,7 @@ PremiumFeatureContainer.wrappedComponent.propTypes = { | |||
81 | children: oneOrManyChildElements.isRequired, | 96 | children: oneOrManyChildElements.isRequired, |
82 | stores: PropTypes.shape({ | 97 | stores: PropTypes.shape({ |
83 | user: PropTypes.instanceOf(UserStore).isRequired, | 98 | user: PropTypes.instanceOf(UserStore).isRequired, |
99 | features: PropTypes.instanceOf(FeatureStore).isRequired, | ||
84 | }).isRequired, | 100 | }).isRequired, |
85 | actions: PropTypes.shape({ | 101 | actions: PropTypes.shape({ |
86 | ui: PropTypes.shape({ | 102 | ui: PropTypes.shape({ |