diff options
author | Stefan Malzner <stefan@adlk.io> | 2019-09-04 15:37:56 +0200 |
---|---|---|
committer | Stefan Malzner <stefan@adlk.io> | 2019-09-04 15:37:56 +0200 |
commit | c6dda35baf7eb9a7d89bf224c38973a1b6171c14 (patch) | |
tree | 98f562911fcccc356a0594427f6891ce0e12f22a /src/features/todos | |
parent | Fix icons & button color (diff) | |
download | ferdium-app-c6dda35baf7eb9a7d89bf224c38973a1b6171c14.tar.gz ferdium-app-c6dda35baf7eb9a7d89bf224c38973a1b6171c14.tar.zst ferdium-app-c6dda35baf7eb9a7d89bf224c38973a1b6171c14.zip |
bugfixing & polishing
Diffstat (limited to 'src/features/todos')
-rw-r--r-- | src/features/todos/components/TodosWebview.js | 14 | ||||
-rw-r--r-- | src/features/todos/containers/TodosScreen.js | 6 | ||||
-rw-r--r-- | src/features/todos/store.js | 3 |
3 files changed, 8 insertions, 15 deletions
diff --git a/src/features/todos/components/TodosWebview.js b/src/features/todos/components/TodosWebview.js index d8d96ba85..9cf925444 100644 --- a/src/features/todos/components/TodosWebview.js +++ b/src/features/todos/components/TodosWebview.js | |||
@@ -10,6 +10,7 @@ import { mdiChevronRight, mdiCheckAll } from '@mdi/js'; | |||
10 | import { Button } from '@meetfranz/forms'; | 10 | import { Button } from '@meetfranz/forms'; |
11 | import * as environment from '../../../environment'; | 11 | import * as environment from '../../../environment'; |
12 | import Appear from '../../../components/ui/effects/Appear'; | 12 | import Appear from '../../../components/ui/effects/Appear'; |
13 | import ActivateTrialButton from '../../../components/ui/activateTrialButton'; | ||
13 | 14 | ||
14 | const OPEN_TODOS_BUTTON_SIZE = 45; | 15 | const OPEN_TODOS_BUTTON_SIZE = 45; |
15 | const CLOSE_TODOS_BUTTON_SIZE = 35; | 16 | const CLOSE_TODOS_BUTTON_SIZE = 35; |
@@ -70,7 +71,7 @@ const styles = theme => ({ | |||
70 | height: OPEN_TODOS_BUTTON_SIZE, | 71 | height: OPEN_TODOS_BUTTON_SIZE, |
71 | background: theme.todos.toggleButton.background, | 72 | background: theme.todos.toggleButton.background, |
72 | position: 'absolute', | 73 | position: 'absolute', |
73 | bottom: 80, | 74 | bottom: 120, |
74 | right: props => (props.width + (props.isVisible ? -OPEN_TODOS_BUTTON_SIZE / 2 : 0)), | 75 | right: props => (props.width + (props.isVisible ? -OPEN_TODOS_BUTTON_SIZE / 2 : 0)), |
75 | borderRadius: OPEN_TODOS_BUTTON_SIZE / 2, | 76 | borderRadius: OPEN_TODOS_BUTTON_SIZE / 2, |
76 | opacity: props => (props.isVisible ? 0 : 1), | 77 | opacity: props => (props.isVisible ? 0 : 1), |
@@ -94,7 +95,7 @@ const styles = theme => ({ | |||
94 | height: CLOSE_TODOS_BUTTON_SIZE, | 95 | height: CLOSE_TODOS_BUTTON_SIZE, |
95 | background: theme.todos.toggleButton.background, | 96 | background: theme.todos.toggleButton.background, |
96 | position: 'absolute', | 97 | position: 'absolute', |
97 | bottom: 80, | 98 | bottom: 120, |
98 | right: ({ width }) => (width + -CLOSE_TODOS_BUTTON_SIZE / 2), | 99 | right: ({ width }) => (width + -CLOSE_TODOS_BUTTON_SIZE / 2), |
99 | borderRadius: CLOSE_TODOS_BUTTON_SIZE / 2, | 100 | borderRadius: CLOSE_TODOS_BUTTON_SIZE / 2, |
100 | opacity: ({ isTodosIncludedInCurrentPlan }) => (!isTodosIncludedInCurrentPlan ? 1 : 0), | 101 | opacity: ({ isTodosIncludedInCurrentPlan }) => (!isTodosIncludedInCurrentPlan ? 1 : 0), |
@@ -143,7 +144,6 @@ class TodosWebview extends Component { | |||
143 | width: PropTypes.number.isRequired, | 144 | width: PropTypes.number.isRequired, |
144 | minWidth: PropTypes.number.isRequired, | 145 | minWidth: PropTypes.number.isRequired, |
145 | isTodosIncludedInCurrentPlan: PropTypes.bool.isRequired, | 146 | isTodosIncludedInCurrentPlan: PropTypes.bool.isRequired, |
146 | upgradeAccount: PropTypes.func.isRequired, | ||
147 | }; | 147 | }; |
148 | 148 | ||
149 | state = { | 149 | state = { |
@@ -235,7 +235,6 @@ class TodosWebview extends Component { | |||
235 | isVisible, | 235 | isVisible, |
236 | togglePanel, | 236 | togglePanel, |
237 | isTodosIncludedInCurrentPlan, | 237 | isTodosIncludedInCurrentPlan, |
238 | upgradeAccount, | ||
239 | } = this.props; | 238 | } = this.props; |
240 | 239 | ||
241 | const { | 240 | const { |
@@ -291,11 +290,10 @@ class TodosWebview extends Component { | |||
291 | <Icon icon={mdiCheckAll} className={classes.premiumIcon} size={5} /> | 290 | <Icon icon={mdiCheckAll} className={classes.premiumIcon} size={5} /> |
292 | <p>{intl.formatMessage(messages.premiumInfo)}</p> | 291 | <p>{intl.formatMessage(messages.premiumInfo)}</p> |
293 | <p>{intl.formatMessage(messages.rolloutInfo)}</p> | 292 | <p>{intl.formatMessage(messages.rolloutInfo)}</p> |
294 | <Button | 293 | <ActivateTrialButton |
295 | label={intl.formatMessage(messages.upgradeCTA)} | ||
296 | className={classes.premiumCTA} | 294 | className={classes.premiumCTA} |
297 | onClick={upgradeAccount} | 295 | gaEventInfo={{ category: 'Todos', event: 'upgrade' }} |
298 | buttonType="inverted" | 296 | short |
299 | /> | 297 | /> |
300 | </div> | 298 | </div> |
301 | </Appear> | 299 | </Appear> |
diff --git a/src/features/todos/containers/TodosScreen.js b/src/features/todos/containers/TodosScreen.js index 7f3688828..65afc985b 100644 --- a/src/features/todos/containers/TodosScreen.js +++ b/src/features/todos/containers/TodosScreen.js | |||
@@ -26,7 +26,6 @@ class TodosScreen extends Component { | |||
26 | minWidth={TODOS_MIN_WIDTH} | 26 | minWidth={TODOS_MIN_WIDTH} |
27 | resize={width => todoActions.resize({ width })} | 27 | resize={width => todoActions.resize({ width })} |
28 | isTodosIncludedInCurrentPlan={this.props.stores.features.features.isTodosIncludedInCurrentPlan || false} | 28 | isTodosIncludedInCurrentPlan={this.props.stores.features.features.isTodosIncludedInCurrentPlan || false} |
29 | upgradeAccount={() => this.props.actions.ui.openSettings({ path: 'user' })} | ||
30 | /> | 29 | /> |
31 | </ErrorBoundary> | 30 | </ErrorBoundary> |
32 | ); | 31 | ); |
@@ -39,9 +38,4 @@ TodosScreen.wrappedComponent.propTypes = { | |||
39 | stores: PropTypes.shape({ | 38 | stores: PropTypes.shape({ |
40 | features: PropTypes.instanceOf(FeaturesStore).isRequired, | 39 | features: PropTypes.instanceOf(FeaturesStore).isRequired, |
41 | }).isRequired, | 40 | }).isRequired, |
42 | actions: PropTypes.shape({ | ||
43 | ui: PropTypes.shape({ | ||
44 | openSettings: PropTypes.func.isRequired, | ||
45 | }).isRequired, | ||
46 | }).isRequired, | ||
47 | }; | 41 | }; |
diff --git a/src/features/todos/store.js b/src/features/todos/store.js index 7da3b7f49..56e117c6c 100644 --- a/src/features/todos/store.js +++ b/src/features/todos/store.js | |||
@@ -12,6 +12,7 @@ import { createReactions } from '../../stores/lib/Reaction'; | |||
12 | import { createActionBindings } from '../utils/ActionBinding'; | 12 | import { createActionBindings } from '../utils/ActionBinding'; |
13 | import { DEFAULT_TODOS_WIDTH, TODOS_MIN_WIDTH, DEFAULT_TODOS_VISIBLE } from '.'; | 13 | import { DEFAULT_TODOS_WIDTH, TODOS_MIN_WIDTH, DEFAULT_TODOS_VISIBLE } from '.'; |
14 | import { IPC } from './constants'; | 14 | import { IPC } from './constants'; |
15 | import { state as delayAppState } from '../delayApp'; | ||
15 | 16 | ||
16 | const debug = require('debug')('Franz:feature:todos:store'); | 17 | const debug = require('debug')('Franz:feature:todos:store'); |
17 | 18 | ||
@@ -29,7 +30,7 @@ export default class TodoStore extends FeatureStore { | |||
29 | } | 30 | } |
30 | 31 | ||
31 | @computed get isTodosPanelVisible() { | 32 | @computed get isTodosPanelVisible() { |
32 | if (this.stores.services.all.length === 0) return false; | 33 | if (this.stores.services.all.length === 0 || delayAppState.isDelayAppScreenVisible) return false; |
33 | if (this.settings.isTodosPanelVisible === undefined) return DEFAULT_TODOS_VISIBLE; | 34 | if (this.settings.isTodosPanelVisible === undefined) return DEFAULT_TODOS_VISIBLE; |
34 | 35 | ||
35 | return this.settings.isTodosPanelVisible; | 36 | return this.settings.isTodosPanelVisible; |