diff options
author | Amine El Mouafik <412895+kytwb@users.noreply.github.com> | 2021-02-08 10:34:45 +0100 |
---|---|---|
committer | GitHub <noreply@github.com> | 2021-02-08 10:34:45 +0100 |
commit | 035002ceedf78d5ec73eabc0df7f06139939b967 (patch) | |
tree | 1c0d1e9531bae05fb65d70b9ea25baf404b74fe1 /src/features | |
parent | docs: add k0staa as a contributor (#1193) (diff) | |
download | ferdium-app-035002ceedf78d5ec73eabc0df7f06139939b967.tar.gz ferdium-app-035002ceedf78d5ec73eabc0df7f06139939b967.tar.zst ferdium-app-035002ceedf78d5ec73eabc0df7f06139939b967.zip |
Synchronize with Franz 5.6.0 (#1033)
Co-authored-by: FranzBot <i18n@meetfranz.com>
Co-authored-by: vantezzen <hello@vantezzen.io>
Co-authored-by: Makazzz <makazzzpro@live.ca>
Co-authored-by: Stefan Malzner <stefan@adlk.io>
Co-authored-by: Amine Mouafik <amine@mouafik.fr>
Diffstat (limited to 'src/features')
-rw-r--r-- | src/features/todos/actions.js | 9 | ||||
-rw-r--r-- | src/features/todos/components/TodosWebview.js | 31 | ||||
-rw-r--r-- | src/features/todos/containers/TodosScreen.js | 3 | ||||
-rw-r--r-- | src/features/todos/index.js | 2 | ||||
-rw-r--r-- | src/features/todos/preload.js | 7 | ||||
-rw-r--r-- | src/features/todos/store.js | 50 |
6 files changed, 85 insertions, 17 deletions
diff --git a/src/features/todos/actions.js b/src/features/todos/actions.js index 1ccc9a592..cc17e919b 100644 --- a/src/features/todos/actions.js +++ b/src/features/todos/actions.js | |||
@@ -15,9 +15,14 @@ export const todoActions = createActionsFromDefinitions({ | |||
15 | data: PropTypes.object, | 15 | data: PropTypes.object, |
16 | }, | 16 | }, |
17 | handleClientMessage: { | 17 | handleClientMessage: { |
18 | action: PropTypes.string.isRequired, | 18 | channel: PropTypes.string.isRequired, |
19 | data: PropTypes.object, | 19 | message: PropTypes.shape({ |
20 | action: PropTypes.string.isRequired, | ||
21 | data: PropTypes.object, | ||
22 | }), | ||
20 | }, | 23 | }, |
24 | openDevTools: {}, | ||
25 | reload: {}, | ||
21 | }, PropTypes.checkPropTypes); | 26 | }, PropTypes.checkPropTypes); |
22 | 27 | ||
23 | export default todoActions; | 28 | export default todoActions; |
diff --git a/src/features/todos/components/TodosWebview.js b/src/features/todos/components/TodosWebview.js index c612702b0..90575ebac 100644 --- a/src/features/todos/components/TodosWebview.js +++ b/src/features/todos/components/TodosWebview.js | |||
@@ -5,12 +5,14 @@ import injectSheet from 'react-jss'; | |||
5 | import Webview from 'react-electron-web-view'; | 5 | 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 | import classnames from 'classnames'; | ||
8 | 9 | ||
9 | import { mdiCheckAll } from '@mdi/js'; | 10 | import { mdiCheckAll } from '@mdi/js'; |
10 | import SettingsStore from '../../../stores/SettingsStore'; | 11 | import SettingsStore from '../../../stores/SettingsStore'; |
11 | 12 | ||
12 | import Appear from '../../../components/ui/effects/Appear'; | 13 | import Appear from '../../../components/ui/effects/Appear'; |
13 | import UpgradeButton from '../../../components/ui/UpgradeButton'; | 14 | import UpgradeButton from '../../../components/ui/UpgradeButton'; |
15 | import { TODOS_PARTITION_ID } from '..'; | ||
14 | 16 | ||
15 | import userAgent from '../../../helpers/userAgent-helpers'; | 17 | import userAgent from '../../../helpers/userAgent-helpers'; |
16 | 18 | ||
@@ -49,7 +51,7 @@ const styles = theme => ({ | |||
49 | borderLeft: [1, 'solid', theme.todos.todosLayer.borderLeftColor], | 51 | borderLeft: [1, 'solid', theme.todos.todosLayer.borderLeftColor], |
50 | zIndex: 300, | 52 | zIndex: 300, |
51 | 53 | ||
52 | transform: ({ isVisible, width }) => `translateX(${isVisible ? 0 : width}px)`, | 54 | transform: ({ isVisible, width, isTodosServiceActive }) => `translateX(${isVisible || isTodosServiceActive ? 0 : width}px)`, |
53 | 55 | ||
54 | '& webview': { | 56 | '& webview': { |
55 | height: '100%', | 57 | height: '100%', |
@@ -91,12 +93,19 @@ const styles = theme => ({ | |||
91 | premiumCTA: { | 93 | premiumCTA: { |
92 | marginTop: 40, | 94 | marginTop: 40, |
93 | }, | 95 | }, |
96 | isTodosServiceActive: { | ||
97 | width: 'calc(100% - 368px)', | ||
98 | position: 'absolute', | ||
99 | right: 0, | ||
100 | zIndex: 0, | ||
101 | }, | ||
94 | }); | 102 | }); |
95 | 103 | ||
96 | @injectSheet(styles) @inject('stores') @observer | 104 | @injectSheet(styles) @inject('stores') @observer |
97 | class TodosWebview extends Component { | 105 | class TodosWebview extends Component { |
98 | static propTypes = { | 106 | static propTypes = { |
99 | classes: PropTypes.object.isRequired, | 107 | classes: PropTypes.object.isRequired, |
108 | isTodosServiceActive: PropTypes.bool.isRequired, | ||
100 | isVisible: PropTypes.bool.isRequired, | 109 | isVisible: PropTypes.bool.isRequired, |
101 | handleClientMessage: PropTypes.func.isRequired, | 110 | handleClientMessage: PropTypes.func.isRequired, |
102 | setTodosWebview: PropTypes.func.isRequired, | 111 | setTodosWebview: PropTypes.func.isRequired, |
@@ -194,12 +203,16 @@ class TodosWebview extends Component { | |||
194 | startListeningToIpcMessages() { | 203 | startListeningToIpcMessages() { |
195 | const { handleClientMessage } = this.props; | 204 | const { handleClientMessage } = this.props; |
196 | if (!this.webview) return; | 205 | if (!this.webview) return; |
197 | this.webview.addEventListener('ipc-message', e => handleClientMessage(e.args[0])); | 206 | this.webview.addEventListener('ipc-message', (e) => { |
207 | // console.log(e); | ||
208 | handleClientMessage({ channel: e.channel, message: e.args[0] }); | ||
209 | }); | ||
198 | } | 210 | } |
199 | 211 | ||
200 | render() { | 212 | render() { |
201 | const { | 213 | const { |
202 | classes, | 214 | classes, |
215 | isTodosServiceActive, | ||
203 | isVisible, | 216 | isVisible, |
204 | isTodosIncludedInCurrentPlan, | 217 | isTodosIncludedInCurrentPlan, |
205 | stores, | 218 | stores, |
@@ -222,13 +235,21 @@ class TodosWebview extends Component { | |||
222 | isTodoUrlValid = validURL(todoUrl); | 235 | isTodoUrlValid = validURL(todoUrl); |
223 | } | 236 | } |
224 | 237 | ||
238 | let displayedWidth = isVisible ? width : 0; | ||
239 | if (isTodosServiceActive) { | ||
240 | displayedWidth = null; | ||
241 | } | ||
225 | 242 | ||
226 | return ( | 243 | return ( |
227 | <div | 244 | <div |
228 | className={classes.root} | 245 | className={classnames({ |
229 | style={{ width: isVisible ? width : 0 }} | 246 | [classes.root]: true, |
247 | [classes.isTodosServiceActive]: isTodosServiceActive, | ||
248 | })} | ||
249 | style={{ width: displayedWidth }} | ||
230 | onMouseUp={() => this.stopResize()} | 250 | onMouseUp={() => this.stopResize()} |
231 | ref={(node) => { this.node = node; }} | 251 | ref={(node) => { this.node = node; }} |
252 | id="todos-panel" | ||
232 | > | 253 | > |
233 | <div | 254 | <div |
234 | className={classes.resizeHandler} | 255 | className={classes.resizeHandler} |
@@ -251,7 +272,7 @@ class TodosWebview extends Component { | |||
251 | setTodosWebview(this.webview); | 272 | setTodosWebview(this.webview); |
252 | this.startListeningToIpcMessages(); | 273 | this.startListeningToIpcMessages(); |
253 | }} | 274 | }} |
254 | partition="persist:todos" | 275 | partition={TODOS_PARTITION_ID} |
255 | preload="./features/todos/preload.js" | 276 | preload="./features/todos/preload.js" |
256 | ref={(webview) => { this.webview = webview ? webview.view : null; }} | 277 | ref={(webview) => { this.webview = webview ? webview.view : null; }} |
257 | src={todoUrl} | 278 | src={todoUrl} |
diff --git a/src/features/todos/containers/TodosScreen.js b/src/features/todos/containers/TodosScreen.js index bc05a587d..884925be6 100644 --- a/src/features/todos/containers/TodosScreen.js +++ b/src/features/todos/containers/TodosScreen.js | |||
@@ -7,6 +7,7 @@ import TodosWebview from '../components/TodosWebview'; | |||
7 | import ErrorBoundary from '../../../components/util/ErrorBoundary'; | 7 | import ErrorBoundary from '../../../components/util/ErrorBoundary'; |
8 | import { TODOS_MIN_WIDTH, todosStore } from '..'; | 8 | import { TODOS_MIN_WIDTH, todosStore } from '..'; |
9 | import { todoActions } from '../actions'; | 9 | import { todoActions } from '../actions'; |
10 | import ServicesStore from '../../../stores/ServicesStore'; | ||
10 | 11 | ||
11 | @inject('stores', 'actions') @observer | 12 | @inject('stores', 'actions') @observer |
12 | class TodosScreen extends Component { | 13 | class TodosScreen extends Component { |
@@ -18,6 +19,7 @@ class TodosScreen extends Component { | |||
18 | return ( | 19 | return ( |
19 | <ErrorBoundary> | 20 | <ErrorBoundary> |
20 | <TodosWebview | 21 | <TodosWebview |
22 | isTodosServiceActive={this.props.stores.services.isTodosServiceActive || false} | ||
21 | isVisible={todosStore.isTodosPanelVisible} | 23 | isVisible={todosStore.isTodosPanelVisible} |
22 | togglePanel={todoActions.toggleTodosPanel} | 24 | togglePanel={todoActions.toggleTodosPanel} |
23 | handleClientMessage={todoActions.handleClientMessage} | 25 | handleClientMessage={todoActions.handleClientMessage} |
@@ -37,5 +39,6 @@ export default TodosScreen; | |||
37 | TodosScreen.wrappedComponent.propTypes = { | 39 | TodosScreen.wrappedComponent.propTypes = { |
38 | stores: PropTypes.shape({ | 40 | stores: PropTypes.shape({ |
39 | features: PropTypes.instanceOf(FeaturesStore).isRequired, | 41 | features: PropTypes.instanceOf(FeaturesStore).isRequired, |
42 | services: PropTypes.instanceOf(ServicesStore).isRequired, | ||
40 | }).isRequired, | 43 | }).isRequired, |
41 | }; | 44 | }; |
diff --git a/src/features/todos/index.js b/src/features/todos/index.js index 9f355e9ba..8ff06f190 100644 --- a/src/features/todos/index.js +++ b/src/features/todos/index.js | |||
@@ -9,6 +9,8 @@ export const DEFAULT_TODOS_WIDTH = 300; | |||
9 | export const TODOS_MIN_WIDTH = 200; | 9 | export const TODOS_MIN_WIDTH = 200; |
10 | export const DEFAULT_TODOS_VISIBLE = true; | 10 | export const DEFAULT_TODOS_VISIBLE = true; |
11 | export const DEFAULT_IS_FEATURE_ENABLED_BY_USER = true; | 11 | export const DEFAULT_IS_FEATURE_ENABLED_BY_USER = true; |
12 | export const TODOS_RECIPE_ID = 'franz-todos'; | ||
13 | export const TODOS_PARTITION_ID = 'persist:todos"'; | ||
12 | 14 | ||
13 | export const TODOS_ROUTES = { | 15 | export const TODOS_ROUTES = { |
14 | TARGET: '/todos', | 16 | TARGET: '/todos', |
diff --git a/src/features/todos/preload.js b/src/features/todos/preload.js index d834cf547..9bd76a704 100644 --- a/src/features/todos/preload.js +++ b/src/features/todos/preload.js | |||
@@ -5,7 +5,12 @@ const debug = require('debug')('Ferdi:feature:todos:preload'); | |||
5 | 5 | ||
6 | debug('Preloading Todos Webview'); | 6 | debug('Preloading Todos Webview'); |
7 | 7 | ||
8 | let hostMessageListener = () => {}; | 8 | let hostMessageListener = ({ action }) => { |
9 | switch (action) { | ||
10 | case 'todos:initialize-as-service': ipcRenderer.sendToHost('hello'); break; | ||
11 | default: | ||
12 | } | ||
13 | }; | ||
9 | 14 | ||
10 | window.ferdi = { | 15 | window.ferdi = { |
11 | onInitialize(ipcHostMessageListener) { | 16 | onInitialize(ipcHostMessageListener) { |
diff --git a/src/features/todos/store.js b/src/features/todos/store.js index a05203a04..c1d6a9049 100644 --- a/src/features/todos/store.js +++ b/src/features/todos/store.js | |||
@@ -23,7 +23,9 @@ export default class TodoStore extends FeatureStore { | |||
23 | 23 | ||
24 | @observable isFeatureActive = false; | 24 | @observable isFeatureActive = false; |
25 | 25 | ||
26 | webview = null; | 26 | @observable webview = null; |
27 | |||
28 | isInitialized = false; | ||
27 | 29 | ||
28 | @computed get width() { | 30 | @computed get width() { |
29 | const width = this.settings.width || DEFAULT_TODOS_WIDTH; | 31 | const width = this.settings.width || DEFAULT_TODOS_WIDTH; |
@@ -65,6 +67,8 @@ export default class TodoStore extends FeatureStore { | |||
65 | [todoActions.handleHostMessage, this._handleHostMessage], | 67 | [todoActions.handleHostMessage, this._handleHostMessage], |
66 | [todoActions.handleClientMessage, this._handleClientMessage], | 68 | [todoActions.handleClientMessage, this._handleClientMessage], |
67 | [todoActions.toggleTodosFeatureVisibility, this._toggleTodosFeatureVisibility], | 69 | [todoActions.toggleTodosFeatureVisibility, this._toggleTodosFeatureVisibility], |
70 | [todoActions.openDevTools, this._openDevTools], | ||
71 | [todoActions.reload, this._reload], | ||
68 | ])); | 72 | ])); |
69 | 73 | ||
70 | // REACTIONS | 74 | // REACTIONS |
@@ -129,16 +133,28 @@ export default class TodoStore extends FeatureStore { | |||
129 | } | 133 | } |
130 | }; | 134 | }; |
131 | 135 | ||
132 | @action _handleClientMessage = (message) => { | 136 | @action _handleClientMessage = ({ channel, message = {} }) => { |
133 | debug('_handleClientMessage', message); | 137 | debug('_handleClientMessage', channel, message); |
134 | switch (message.action) { | 138 | switch (message.action) { |
135 | case 'todos:initialized': this._onTodosClientInitialized(); break; | 139 | case 'todos:initialized': this._onTodosClientInitialized(); break; |
136 | case 'todos:goToService': this._goToService(message.data); break; | 140 | case 'todos:goToService': this._goToService(message.data); break; |
137 | default: | 141 | default: |
138 | debug('Unknown client message reiceived', message); | 142 | debug('Other message received', channel, message); |
143 | console.log('this.stores.services.isTodosServiceAdded', this.stores.services.isTodosServiceAdded); | ||
144 | if (this.stores.services.isTodosServiceAdded) { | ||
145 | this.actions.service.handleIPCMessage({ | ||
146 | serviceId: this.stores.services.isTodosServiceAdded.id, | ||
147 | channel, | ||
148 | args: message, | ||
149 | }); | ||
150 | } | ||
139 | } | 151 | } |
140 | }; | 152 | }; |
141 | 153 | ||
154 | _handleNewWindowEvent = ({ url }) => { | ||
155 | this.actions.app.openExternalUrl({ url }); | ||
156 | } | ||
157 | |||
142 | @action _toggleTodosFeatureVisibility = () => { | 158 | @action _toggleTodosFeatureVisibility = () => { |
143 | debug('_toggleTodosFeatureVisibility'); | 159 | debug('_toggleTodosFeatureVisibility'); |
144 | 160 | ||
@@ -147,14 +163,28 @@ export default class TodoStore extends FeatureStore { | |||
147 | }); | 163 | }); |
148 | }; | 164 | }; |
149 | 165 | ||
166 | _openDevTools = () => { | ||
167 | debug('_openDevTools'); | ||
168 | |||
169 | const webview = document.querySelector('#todos-panel webview'); | ||
170 | if (webview) webview.openDevTools(); | ||
171 | } | ||
172 | |||
173 | _reload = () => { | ||
174 | debug('_reload'); | ||
175 | |||
176 | const webview = document.querySelector('#todos-panel webview'); | ||
177 | if (webview) webview.reload(); | ||
178 | } | ||
179 | |||
150 | // Todos client message handlers | 180 | // Todos client message handlers |
151 | 181 | ||
152 | _onTodosClientInitialized = () => { | 182 | _onTodosClientInitialized = async () => { |
153 | const { authToken } = this.stores.user; | 183 | const { authToken } = this.stores.user; |
154 | const { isDarkThemeActive } = this.stores.ui; | 184 | const { isDarkThemeActive } = this.stores.ui; |
155 | const { locale } = this.stores.app; | 185 | const { locale } = this.stores.app; |
156 | if (!this.webview) return; | 186 | if (!this.webview) return; |
157 | this.webview.send(IPC.TODOS_HOST_CHANNEL, { | 187 | await this.webview.send(IPC.TODOS_HOST_CHANNEL, { |
158 | action: 'todos:configure', | 188 | action: 'todos:configure', |
159 | data: { | 189 | data: { |
160 | authToken, | 190 | authToken, |
@@ -163,9 +193,11 @@ export default class TodoStore extends FeatureStore { | |||
163 | }, | 193 | }, |
164 | }); | 194 | }); |
165 | 195 | ||
166 | this.webview.addEventListener('new-window', ({ url }) => { | 196 | if (!this.isInitialized) { |
167 | this.actions.app.openExternalUrl({ url }); | 197 | this.webview.addEventListener('new-window', this._handleNewWindowEvent); |
168 | }); | 198 | |
199 | this.isInitialized = true; | ||
200 | } | ||
169 | }; | 201 | }; |
170 | 202 | ||
171 | _goToService = ({ url, serviceId }) => { | 203 | _goToService = ({ url, serviceId }) => { |