From 035002ceedf78d5ec73eabc0df7f06139939b967 Mon Sep 17 00:00:00 2001 From: Amine El Mouafik <412895+kytwb@users.noreply.github.com> Date: Mon, 8 Feb 2021 10:34:45 +0100 Subject: Synchronize with Franz 5.6.0 (#1033) Co-authored-by: FranzBot Co-authored-by: vantezzen Co-authored-by: Makazzz Co-authored-by: Stefan Malzner Co-authored-by: Amine Mouafik --- src/features/todos/actions.js | 9 +++-- src/features/todos/components/TodosWebview.js | 31 ++++++++++++++--- src/features/todos/containers/TodosScreen.js | 3 ++ src/features/todos/index.js | 2 ++ src/features/todos/preload.js | 7 +++- src/features/todos/store.js | 50 ++++++++++++++++++++++----- 6 files changed, 85 insertions(+), 17 deletions(-) (limited to 'src/features/todos') 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({ data: PropTypes.object, }, handleClientMessage: { - action: PropTypes.string.isRequired, - data: PropTypes.object, + channel: PropTypes.string.isRequired, + message: PropTypes.shape({ + action: PropTypes.string.isRequired, + data: PropTypes.object, + }), }, + openDevTools: {}, + reload: {}, }, PropTypes.checkPropTypes); 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'; import Webview from 'react-electron-web-view'; import { Icon } from '@meetfranz/ui'; import { defineMessages, intlShape } from 'react-intl'; +import classnames from 'classnames'; import { mdiCheckAll } from '@mdi/js'; import SettingsStore from '../../../stores/SettingsStore'; import Appear from '../../../components/ui/effects/Appear'; import UpgradeButton from '../../../components/ui/UpgradeButton'; +import { TODOS_PARTITION_ID } from '..'; import userAgent from '../../../helpers/userAgent-helpers'; @@ -49,7 +51,7 @@ const styles = theme => ({ borderLeft: [1, 'solid', theme.todos.todosLayer.borderLeftColor], zIndex: 300, - transform: ({ isVisible, width }) => `translateX(${isVisible ? 0 : width}px)`, + transform: ({ isVisible, width, isTodosServiceActive }) => `translateX(${isVisible || isTodosServiceActive ? 0 : width}px)`, '& webview': { height: '100%', @@ -91,12 +93,19 @@ const styles = theme => ({ premiumCTA: { marginTop: 40, }, + isTodosServiceActive: { + width: 'calc(100% - 368px)', + position: 'absolute', + right: 0, + zIndex: 0, + }, }); @injectSheet(styles) @inject('stores') @observer class TodosWebview extends Component { static propTypes = { classes: PropTypes.object.isRequired, + isTodosServiceActive: PropTypes.bool.isRequired, isVisible: PropTypes.bool.isRequired, handleClientMessage: PropTypes.func.isRequired, setTodosWebview: PropTypes.func.isRequired, @@ -194,12 +203,16 @@ class TodosWebview extends Component { startListeningToIpcMessages() { const { handleClientMessage } = this.props; if (!this.webview) return; - this.webview.addEventListener('ipc-message', e => handleClientMessage(e.args[0])); + this.webview.addEventListener('ipc-message', (e) => { + // console.log(e); + handleClientMessage({ channel: e.channel, message: e.args[0] }); + }); } render() { const { classes, + isTodosServiceActive, isVisible, isTodosIncludedInCurrentPlan, stores, @@ -222,13 +235,21 @@ class TodosWebview extends Component { isTodoUrlValid = validURL(todoUrl); } + let displayedWidth = isVisible ? width : 0; + if (isTodosServiceActive) { + displayedWidth = null; + } return (
this.stopResize()} ref={(node) => { this.node = node; }} + id="todos-panel" >
{ this.webview = webview ? webview.view : null; }} 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'; import ErrorBoundary from '../../../components/util/ErrorBoundary'; import { TODOS_MIN_WIDTH, todosStore } from '..'; import { todoActions } from '../actions'; +import ServicesStore from '../../../stores/ServicesStore'; @inject('stores', 'actions') @observer class TodosScreen extends Component { @@ -18,6 +19,7 @@ class TodosScreen extends Component { return ( {}; +let hostMessageListener = ({ action }) => { + switch (action) { + case 'todos:initialize-as-service': ipcRenderer.sendToHost('hello'); break; + default: + } +}; window.ferdi = { 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 { @observable isFeatureActive = false; - webview = null; + @observable webview = null; + + isInitialized = false; @computed get width() { const width = this.settings.width || DEFAULT_TODOS_WIDTH; @@ -65,6 +67,8 @@ export default class TodoStore extends FeatureStore { [todoActions.handleHostMessage, this._handleHostMessage], [todoActions.handleClientMessage, this._handleClientMessage], [todoActions.toggleTodosFeatureVisibility, this._toggleTodosFeatureVisibility], + [todoActions.openDevTools, this._openDevTools], + [todoActions.reload, this._reload], ])); // REACTIONS @@ -129,16 +133,28 @@ export default class TodoStore extends FeatureStore { } }; - @action _handleClientMessage = (message) => { - debug('_handleClientMessage', message); + @action _handleClientMessage = ({ channel, message = {} }) => { + debug('_handleClientMessage', channel, message); switch (message.action) { case 'todos:initialized': this._onTodosClientInitialized(); break; case 'todos:goToService': this._goToService(message.data); break; default: - debug('Unknown client message reiceived', message); + debug('Other message received', channel, message); + console.log('this.stores.services.isTodosServiceAdded', this.stores.services.isTodosServiceAdded); + if (this.stores.services.isTodosServiceAdded) { + this.actions.service.handleIPCMessage({ + serviceId: this.stores.services.isTodosServiceAdded.id, + channel, + args: message, + }); + } } }; + _handleNewWindowEvent = ({ url }) => { + this.actions.app.openExternalUrl({ url }); + } + @action _toggleTodosFeatureVisibility = () => { debug('_toggleTodosFeatureVisibility'); @@ -147,14 +163,28 @@ export default class TodoStore extends FeatureStore { }); }; + _openDevTools = () => { + debug('_openDevTools'); + + const webview = document.querySelector('#todos-panel webview'); + if (webview) webview.openDevTools(); + } + + _reload = () => { + debug('_reload'); + + const webview = document.querySelector('#todos-panel webview'); + if (webview) webview.reload(); + } + // Todos client message handlers - _onTodosClientInitialized = () => { + _onTodosClientInitialized = async () => { const { authToken } = this.stores.user; const { isDarkThemeActive } = this.stores.ui; const { locale } = this.stores.app; if (!this.webview) return; - this.webview.send(IPC.TODOS_HOST_CHANNEL, { + await this.webview.send(IPC.TODOS_HOST_CHANNEL, { action: 'todos:configure', data: { authToken, @@ -163,9 +193,11 @@ export default class TodoStore extends FeatureStore { }, }); - this.webview.addEventListener('new-window', ({ url }) => { - this.actions.app.openExternalUrl({ url }); - }); + if (!this.isInitialized) { + this.webview.addEventListener('new-window', this._handleNewWindowEvent); + + this.isInitialized = true; + } }; _goToService = ({ url, serviceId }) => { -- cgit v1.2.3-54-g00ecf