diff options
Diffstat (limited to 'src/features')
-rw-r--r-- | src/features/todos/components/TodosWebview.js | 58 | ||||
-rw-r--r-- | src/features/todos/store.js | 6 |
2 files changed, 6 insertions, 58 deletions
diff --git a/src/features/todos/components/TodosWebview.js b/src/features/todos/components/TodosWebview.js index c06183e37..d052da6f2 100644 --- a/src/features/todos/components/TodosWebview.js +++ b/src/features/todos/components/TodosWebview.js | |||
@@ -6,14 +6,11 @@ import Webview from 'react-electron-web-view'; | |||
6 | import { Icon } from '@meetfranz/ui'; | 6 | import { Icon } from '@meetfranz/ui'; |
7 | import { defineMessages, intlShape } from 'react-intl'; | 7 | import { defineMessages, intlShape } from 'react-intl'; |
8 | 8 | ||
9 | import { mdiChevronRight, mdiCheckAll } from '@mdi/js'; | 9 | import { mdiCheckAll } from '@mdi/js'; |
10 | import * as environment from '../../../environment'; | 10 | import * as environment from '../../../environment'; |
11 | import Appear from '../../../components/ui/effects/Appear'; | 11 | import Appear from '../../../components/ui/effects/Appear'; |
12 | import UpgradeButton from '../../../components/ui/UpgradeButton'; | 12 | import UpgradeButton from '../../../components/ui/UpgradeButton'; |
13 | 13 | ||
14 | const OPEN_TODOS_BUTTON_SIZE = 45; | ||
15 | const CLOSE_TODOS_BUTTON_SIZE = 35; | ||
16 | |||
17 | const messages = defineMessages({ | 14 | const messages = defineMessages({ |
18 | premiumInfo: { | 15 | premiumInfo: { |
19 | id: 'feature.todos.premium.info', | 16 | id: 'feature.todos.premium.info', |
@@ -61,50 +58,6 @@ const styles = theme => ({ | |||
61 | background: theme.todos.dragIndicator.background, | 58 | background: theme.todos.dragIndicator.background, |
62 | 59 | ||
63 | }, | 60 | }, |
64 | openTodosButton: { | ||
65 | width: OPEN_TODOS_BUTTON_SIZE, | ||
66 | height: OPEN_TODOS_BUTTON_SIZE, | ||
67 | background: theme.todos.toggleButton.background, | ||
68 | position: 'absolute', | ||
69 | bottom: 120, | ||
70 | right: props => (props.width + (props.isVisible ? -OPEN_TODOS_BUTTON_SIZE / 2 : 0)), | ||
71 | borderRadius: OPEN_TODOS_BUTTON_SIZE / 2, | ||
72 | opacity: props => (props.isVisible ? 0 : 1), | ||
73 | transition: 'right 0.5s', | ||
74 | zIndex: 600, | ||
75 | display: 'flex', | ||
76 | alignItems: 'center', | ||
77 | justifyContent: 'center', | ||
78 | boxShadow: [0, 0, 10, theme.todos.toggleButton.shadowColor], | ||
79 | |||
80 | borderTopRightRadius: props => (props.isVisible ? null : 0), | ||
81 | borderBottomRightRadius: props => (props.isVisible ? null : 0), | ||
82 | |||
83 | '& svg': { | ||
84 | fill: theme.todos.toggleButton.textColor, | ||
85 | transition: 'all 0.5s', | ||
86 | }, | ||
87 | }, | ||
88 | closeTodosButton: { | ||
89 | width: CLOSE_TODOS_BUTTON_SIZE, | ||
90 | height: CLOSE_TODOS_BUTTON_SIZE, | ||
91 | background: theme.todos.toggleButton.background, | ||
92 | position: 'absolute', | ||
93 | bottom: 120, | ||
94 | right: ({ width }) => (width + -CLOSE_TODOS_BUTTON_SIZE / 2), | ||
95 | borderRadius: CLOSE_TODOS_BUTTON_SIZE / 2, | ||
96 | opacity: ({ isTodosIncludedInCurrentPlan }) => (!isTodosIncludedInCurrentPlan ? 1 : 0), | ||
97 | transition: 'opacity 0.5s', | ||
98 | zIndex: 600, | ||
99 | display: 'flex', | ||
100 | alignItems: 'center', | ||
101 | justifyContent: 'center', | ||
102 | boxShadow: [0, 0, 10, theme.todos.toggleButton.shadowColor], | ||
103 | |||
104 | '& svg': { | ||
105 | fill: theme.todos.toggleButton.textColor, | ||
106 | }, | ||
107 | }, | ||
108 | premiumContainer: { | 61 | premiumContainer: { |
109 | display: 'flex', | 62 | display: 'flex', |
110 | flexDirection: 'column', | 63 | flexDirection: 'column', |
@@ -132,7 +85,6 @@ class TodosWebview extends Component { | |||
132 | static propTypes = { | 85 | static propTypes = { |
133 | classes: PropTypes.object.isRequired, | 86 | classes: PropTypes.object.isRequired, |
134 | isVisible: PropTypes.bool.isRequired, | 87 | isVisible: PropTypes.bool.isRequired, |
135 | togglePanel: PropTypes.func.isRequired, | ||
136 | handleClientMessage: PropTypes.func.isRequired, | 88 | handleClientMessage: PropTypes.func.isRequired, |
137 | setTodosWebview: PropTypes.func.isRequired, | 89 | setTodosWebview: PropTypes.func.isRequired, |
138 | resize: PropTypes.func.isRequired, | 90 | resize: PropTypes.func.isRequired, |
@@ -228,7 +180,6 @@ class TodosWebview extends Component { | |||
228 | const { | 180 | const { |
229 | classes, | 181 | classes, |
230 | isVisible, | 182 | isVisible, |
231 | togglePanel, | ||
232 | isTodosIncludedInCurrentPlan, | 183 | isTodosIncludedInCurrentPlan, |
233 | } = this.props; | 184 | } = this.props; |
234 | 185 | ||
@@ -247,13 +198,6 @@ class TodosWebview extends Component { | |||
247 | onMouseUp={() => this.stopResize()} | 198 | onMouseUp={() => this.stopResize()} |
248 | ref={(node) => { this.node = node; }} | 199 | ref={(node) => { this.node = node; }} |
249 | > | 200 | > |
250 | <button | ||
251 | onClick={() => togglePanel()} | ||
252 | className={isVisible ? classes.closeTodosButton : classes.openTodosButton} | ||
253 | type="button" | ||
254 | > | ||
255 | <Icon icon={isVisible ? mdiChevronRight : mdiCheckAll} size={2} /> | ||
256 | </button> | ||
257 | <div | 201 | <div |
258 | className={classes.resizeHandler} | 202 | className={classes.resizeHandler} |
259 | style={Object.assign({ left: delta }, isDragging ? { width: 600, marginLeft: -200 } : {})} // This hack is required as resizing with webviews beneath behaves quite bad | 203 | style={Object.assign({ left: delta }, isDragging ? { width: 600, marginLeft: -200 } : {})} // This hack is required as resizing with webviews beneath behaves quite bad |
diff --git a/src/features/todos/store.js b/src/features/todos/store.js index 05eef4ec1..abf176604 100644 --- a/src/features/todos/store.js +++ b/src/features/todos/store.js | |||
@@ -33,7 +33,7 @@ export default class TodoStore extends FeatureStore { | |||
33 | 33 | ||
34 | @computed get isTodosPanelForceHidden() { | 34 | @computed get isTodosPanelForceHidden() { |
35 | const { isAnnouncementShown } = this.stores.announcements; | 35 | const { isAnnouncementShown } = this.stores.announcements; |
36 | return delayAppState.isDelayAppScreenVisible || !this.settings.isFeatureEnabledByUser || isAnnouncementShown; | 36 | return delayAppState.isDelayAppScreenVisible || !this.isFeatureEnabledByUser || isAnnouncementShown; |
37 | } | 37 | } |
38 | 38 | ||
39 | @computed get isTodosPanelVisible() { | 39 | @computed get isTodosPanelVisible() { |
@@ -41,6 +41,10 @@ export default class TodoStore extends FeatureStore { | |||
41 | return this.settings.isTodosPanelVisible; | 41 | return this.settings.isTodosPanelVisible; |
42 | } | 42 | } |
43 | 43 | ||
44 | @computed get isFeatureEnabledByUser() { | ||
45 | return this.settings.isFeatureEnabledByUser; | ||
46 | } | ||
47 | |||
44 | @computed get settings() { | 48 | @computed get settings() { |
45 | return localStorage.getItem('todos') || {}; | 49 | return localStorage.getItem('todos') || {}; |
46 | } | 50 | } |