From 1bae1dfcbc4a5f590c51103635006198ae6a91d6 Mon Sep 17 00:00:00 2001 From: Stefan Malzner Date: Tue, 30 Apr 2019 15:23:38 +0200 Subject: Enforce service limit --- .../serviceLimit/components/LimitReachedInfobox.js | 74 ++++++++++++++++++++++ 1 file changed, 74 insertions(+) create mode 100644 src/features/serviceLimit/components/LimitReachedInfobox.js (limited to 'src/features/serviceLimit/components/LimitReachedInfobox.js') diff --git a/src/features/serviceLimit/components/LimitReachedInfobox.js b/src/features/serviceLimit/components/LimitReachedInfobox.js new file mode 100644 index 000000000..ee0d7cb27 --- /dev/null +++ b/src/features/serviceLimit/components/LimitReachedInfobox.js @@ -0,0 +1,74 @@ +import React, { Component } from 'react'; +import PropTypes from 'prop-types'; +import { inject, observer } from 'mobx-react'; +import { defineMessages, intlShape } from 'react-intl'; +import injectSheet from 'react-jss'; +import { Infobox } from '@meetfranz/ui'; + +import { gaEvent } from '../../../lib/analytics'; + +const messages = defineMessages({ + limitReached: { + id: 'feature.serviceLimit.limitReached', + defaultMessage: '!!!You have added {amount} of {limit} services. Please upgrade your account to add more services.', + }, + action: { + id: 'premiumFeature.button.upgradeAccount', + defaultMessage: '!!!Upgrade account', + }, +}); + +const styles = theme => ({ + container: { + height: 'auto', + background: theme.styleTypes.primary.accent, + color: theme.styleTypes.primary.contrast, + borderRadius: 0, + marginBottom: 0, + + '& button': { + color: theme.styleTypes.primary.contrast, + }, + }, +}); + + +@inject('stores', 'actions') @injectSheet(styles) @observer +class LimitReachedInfobox extends Component { + static propTypes = { + classes: PropTypes.object.isRequired, + stores: PropTypes.object.isRequired, + actions: PropTypes.object.isRequired, + }; + + static contextTypes = { + intl: intlShape, + }; + + render() { + const { classes, stores, actions } = this.props; + const { intl } = this.context; + + const { + serviceLimit, + } = stores; + + if (!serviceLimit.userHasReachedServiceLimit) return null; + + return ( + { + actions.ui.openSettings({ path: 'user' }); + gaEvent('Service Limit', 'upgrade', 'Upgrade account'); + }} + > + {intl.formatMessage(messages.limitReached, { amount: serviceLimit.serviceCount, limit: serviceLimit.serviceLimit })} + + ); + } +} + +export default LimitReachedInfobox; -- cgit v1.2.3-70-g09d2 From 66647005ae23bccf1691a43ea36565cae4ce9518 Mon Sep 17 00:00:00 2001 From: Stefan Malzner Date: Thu, 13 Jun 2019 15:15:38 +0200 Subject: Improve serviceLimit implementation --- src/components/settings/navigation/SettingsNavigation.js | 8 +++++++- src/features/serviceLimit/components/LimitReachedInfobox.js | 4 ++++ src/features/serviceLimit/index.js | 2 +- src/features/serviceLimit/store.js | 6 +++--- src/i18n/locales/en-US.json | 2 +- 5 files changed, 16 insertions(+), 6 deletions(-) (limited to 'src/features/serviceLimit/components/LimitReachedInfobox.js') diff --git a/src/components/settings/navigation/SettingsNavigation.js b/src/components/settings/navigation/SettingsNavigation.js index df4b3b3b2..4696b82eb 100644 --- a/src/components/settings/navigation/SettingsNavigation.js +++ b/src/components/settings/navigation/SettingsNavigation.js @@ -8,6 +8,7 @@ import Link from '../../ui/Link'; import { workspaceStore } from '../../../features/workspaces'; import UIStore from '../../../stores/UIStore'; import UserStore from '../../../stores/UserStore'; +import { serviceLimitStore } from '../../../features/serviceLimit'; const messages = defineMessages({ availableServices: { @@ -80,7 +81,12 @@ export default @inject('stores') @observer class SettingsNavigation extends Comp > {intl.formatMessage(messages.yourServices)} {' '} - {serviceCount} + + {serviceCount} + {serviceLimitStore.serviceLimit !== 0 && ( + `/${serviceLimitStore.serviceLimit}` + )} + {workspaceStore.isFeatureEnabled ? ( ({ borderRadius: 0, marginBottom: 0, + '& > div': { + marginBottom: 0, + }, + '& button': { color: theme.styleTypes.primary.contrast, }, diff --git a/src/features/serviceLimit/index.js b/src/features/serviceLimit/index.js index 76f996195..92ad8bb98 100644 --- a/src/features/serviceLimit/index.js +++ b/src/features/serviceLimit/index.js @@ -15,7 +15,7 @@ export default function initServiceLimit(stores, actions) { // Toggle serviceLimit feature reaction( () => ( - features.features.hasServiceLimit + features.features.isServiceLimitEnabled ), (isEnabled) => { if (isEnabled) { diff --git a/src/features/serviceLimit/store.js b/src/features/serviceLimit/store.js index 752f71371..9836c5f51 100644 --- a/src/features/serviceLimit/store.js +++ b/src/features/serviceLimit/store.js @@ -24,12 +24,12 @@ export class ServiceLimitStore extends FeatureStore { @computed get userHasReachedServiceLimit() { if (!this.isServiceLimitEnabled) return false; - const { user } = this.stores; - - return !user.isPremium && this.serviceCount >= this.serviceLimit; + return this.serviceLimit !== 0 && this.serviceCount >= this.serviceLimit; } @computed get serviceLimit() { + if (!this.isServiceLimitEnabled || this.stores.features.features.serviceLimitCount === 0) return 0; + return this.stores.features.features.serviceLimitCount || DEFAULT_SERVICE_LIMIT; } diff --git a/src/i18n/locales/en-US.json b/src/i18n/locales/en-US.json index a821dbe39..eded7b79b 100644 --- a/src/i18n/locales/en-US.json +++ b/src/i18n/locales/en-US.json @@ -5,7 +5,7 @@ "feature.delayApp.action": "Get a Franz Supporter License", "feature.delayApp.headline": "Please purchase a Franz Supporter License to skip waiting", "feature.delayApp.text": "Franz will continue in {seconds} seconds.", - "feature.serviceLimit.limitReached": "You have added {amount} of {limit} services. Please upgrade your account to add more services.", + "feature.serviceLimit.limitReached": "You have added {amount} out of {limit} services that are included in your plan. Please upgrade your account to add more services.", "feature.shareFranz.action.email": "Send as email", "feature.shareFranz.action.facebook": "Share on Facebook", "feature.shareFranz.action.twitter": "Share on Twitter", -- cgit v1.2.3-70-g09d2 From 9e7e1893f10934de20c37bc810258a7797491a10 Mon Sep 17 00:00:00 2001 From: Stefan Malzner Date: Fri, 6 Sep 2019 09:34:24 +0200 Subject: Set type to warning --- src/features/serviceLimit/components/LimitReachedInfobox.js | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) (limited to 'src/features/serviceLimit/components/LimitReachedInfobox.js') diff --git a/src/features/serviceLimit/components/LimitReachedInfobox.js b/src/features/serviceLimit/components/LimitReachedInfobox.js index fc54dcf85..19285a4eb 100644 --- a/src/features/serviceLimit/components/LimitReachedInfobox.js +++ b/src/features/serviceLimit/components/LimitReachedInfobox.js @@ -21,8 +21,8 @@ const messages = defineMessages({ const styles = theme => ({ container: { height: 'auto', - background: theme.styleTypes.primary.accent, - color: theme.styleTypes.primary.contrast, + background: theme.styleTypes.warning.accent, + color: theme.styleTypes.warning.contrast, borderRadius: 0, marginBottom: 0, @@ -62,6 +62,7 @@ class LimitReachedInfobox extends Component { return ( { -- cgit v1.2.3-70-g09d2