diff options
author | 2019-07-31 17:08:29 +0200 | |
---|---|---|
committer | 2019-07-31 17:08:29 +0200 | |
commit | bd49d59008d64db13e3f37277ec873a3a464ef9e (patch) | |
tree | 7d4f4a943477e543abbcacd2ceb2ac0002054910 /src/features | |
parent | Merge branch 'develop' into feature/todos (diff) | |
download | ferdium-app-bd49d59008d64db13e3f37277ec873a3a464ef9e.tar.gz ferdium-app-bd49d59008d64db13e3f37277ec873a3a464ef9e.tar.zst ferdium-app-bd49d59008d64db13e3f37277ec873a3a464ef9e.zip |
MVP for service <-> todos integration
Diffstat (limited to 'src/features')
-rw-r--r-- | src/features/todos/actions.js | 11 | ||||
-rw-r--r-- | src/features/todos/components/TodosWebview.js | 20 | ||||
-rw-r--r-- | src/features/todos/containers/TodosScreen.js | 3 | ||||
-rw-r--r-- | src/features/todos/preload.js | 21 | ||||
-rw-r--r-- | src/features/todos/store.js | 29 |
5 files changed, 81 insertions, 3 deletions
diff --git a/src/features/todos/actions.js b/src/features/todos/actions.js index 673ce8531..696568f7f 100644 --- a/src/features/todos/actions.js +++ b/src/features/todos/actions.js | |||
@@ -5,6 +5,17 @@ export const todoActions = createActionsFromDefinitions({ | |||
5 | resize: { | 5 | resize: { |
6 | width: PropTypes.number.isRequired, | 6 | width: PropTypes.number.isRequired, |
7 | }, | 7 | }, |
8 | setTodosWebview: { | ||
9 | webview: PropTypes.element.isRequired, | ||
10 | }, | ||
11 | handleHostMessage: { | ||
12 | action: PropTypes.string.isRequired, | ||
13 | data: PropTypes.object, | ||
14 | }, | ||
15 | handleClientMessage: { | ||
16 | action: PropTypes.string.isRequired, | ||
17 | data: PropTypes.object, | ||
18 | }, | ||
8 | }, PropTypes.checkPropTypes); | 19 | }, PropTypes.checkPropTypes); |
9 | 20 | ||
10 | export default todoActions; | 21 | export default todoActions; |
diff --git a/src/features/todos/components/TodosWebview.js b/src/features/todos/components/TodosWebview.js index 1d99b9388..1f4730094 100644 --- a/src/features/todos/components/TodosWebview.js +++ b/src/features/todos/components/TodosWebview.js | |||
@@ -35,6 +35,8 @@ class TodosWebview extends Component { | |||
35 | static propTypes = { | 35 | static propTypes = { |
36 | classes: PropTypes.object.isRequired, | 36 | classes: PropTypes.object.isRequired, |
37 | authToken: PropTypes.string.isRequired, | 37 | authToken: PropTypes.string.isRequired, |
38 | handleClientMessage: PropTypes.func.isRequired, | ||
39 | setTodosWebview: PropTypes.func.isRequired, | ||
38 | resize: PropTypes.func.isRequired, | 40 | resize: PropTypes.func.isRequired, |
39 | width: PropTypes.number.isRequired, | 41 | width: PropTypes.number.isRequired, |
40 | minWidth: PropTypes.number.isRequired, | 42 | minWidth: PropTypes.number.isRequired, |
@@ -43,7 +45,7 @@ class TodosWebview extends Component { | |||
43 | state = { | 45 | state = { |
44 | isDragging: false, | 46 | isDragging: false, |
45 | width: 300, | 47 | width: 300, |
46 | } | 48 | }; |
47 | 49 | ||
48 | componentWillMount() { | 50 | componentWillMount() { |
49 | const { width } = this.props; | 51 | const { width } = this.props; |
@@ -65,7 +67,7 @@ class TodosWebview extends Component { | |||
65 | initialPos: event.clientX, | 67 | initialPos: event.clientX, |
66 | delta: 0, | 68 | delta: 0, |
67 | }); | 69 | }); |
68 | } | 70 | }; |
69 | 71 | ||
70 | resizePanel(e) { | 72 | resizePanel(e) { |
71 | const { minWidth } = this.props; | 73 | const { minWidth } = this.props; |
@@ -113,10 +115,15 @@ class TodosWebview extends Component { | |||
113 | } | 115 | } |
114 | } | 116 | } |
115 | 117 | ||
118 | startListeningToIpcMessages() { | ||
119 | const { handleClientMessage } = this.props; | ||
120 | if (!this.webview) return; | ||
121 | this.webview.addEventListener('ipc-message', e => handleClientMessage(e.args[0])); | ||
122 | } | ||
123 | |||
116 | render() { | 124 | render() { |
117 | const { authToken, classes } = this.props; | 125 | const { authToken, classes } = this.props; |
118 | const { width, delta, isDragging } = this.state; | 126 | const { width, delta, isDragging } = this.state; |
119 | |||
120 | return ( | 127 | return ( |
121 | <> | 128 | <> |
122 | <div | 129 | <div |
@@ -138,6 +145,13 @@ class TodosWebview extends Component { | |||
138 | )} | 145 | )} |
139 | <Webview | 146 | <Webview |
140 | className={classes.webview} | 147 | className={classes.webview} |
148 | onDidAttach={() => { | ||
149 | this.props.setTodosWebview(this.webview); | ||
150 | this.startListeningToIpcMessages(); | ||
151 | }} | ||
152 | partition="persist:todos" | ||
153 | preload="./features/todos/preload.js" | ||
154 | ref={(webview) => { this.webview = webview ? webview.view : null; }} | ||
141 | src={`${environment.TODOS_FRONTEND}?authToken=${authToken}`} | 155 | src={`${environment.TODOS_FRONTEND}?authToken=${authToken}`} |
142 | /> | 156 | /> |
143 | </div> | 157 | </div> |
diff --git a/src/features/todos/containers/TodosScreen.js b/src/features/todos/containers/TodosScreen.js index 0759c22db..5b7c4531b 100644 --- a/src/features/todos/containers/TodosScreen.js +++ b/src/features/todos/containers/TodosScreen.js | |||
@@ -18,6 +18,7 @@ class TodosScreen extends Component { | |||
18 | actions: PropTypes.shape({ | 18 | actions: PropTypes.shape({ |
19 | todos: PropTypes.shape({ | 19 | todos: PropTypes.shape({ |
20 | resize: PropTypes.func.isRequired, | 20 | resize: PropTypes.func.isRequired, |
21 | handleIPCMessage: PropTypes.func.isRequired, | ||
21 | }), | 22 | }), |
22 | }).isRequired, | 23 | }).isRequired, |
23 | }; | 24 | }; |
@@ -33,6 +34,8 @@ class TodosScreen extends Component { | |||
33 | <ErrorBoundary> | 34 | <ErrorBoundary> |
34 | <TodosWebview | 35 | <TodosWebview |
35 | authToken={stores.user.authToken} | 36 | authToken={stores.user.authToken} |
37 | handleClientMessage={actions.todos.handleClientMessage} | ||
38 | setTodosWebview={webview => actions.todos.setTodosWebview({ webview })} | ||
36 | width={stores.todos.width} | 39 | width={stores.todos.width} |
37 | minWidth={TODOS_MIN_WIDTH} | 40 | minWidth={TODOS_MIN_WIDTH} |
38 | resize={width => actions.todos.resize({ width })} | 41 | resize={width => actions.todos.resize({ width })} |
diff --git a/src/features/todos/preload.js b/src/features/todos/preload.js new file mode 100644 index 000000000..533c9aea3 --- /dev/null +++ b/src/features/todos/preload.js | |||
@@ -0,0 +1,21 @@ | |||
1 | import { ipcRenderer } from 'electron'; | ||
2 | |||
3 | const debug = require('debug')('Franz:feature:todos:preload'); | ||
4 | |||
5 | debug('Preloading Todos Webview'); | ||
6 | |||
7 | let hostMessageListener = () => {}; | ||
8 | |||
9 | window.franz = { | ||
10 | onInitialize(ipcHostMessageListener) { | ||
11 | hostMessageListener = ipcHostMessageListener; | ||
12 | }, | ||
13 | sendToHost(message) { | ||
14 | ipcRenderer.sendToHost('clientMessage', message); | ||
15 | }, | ||
16 | }; | ||
17 | |||
18 | ipcRenderer.on('hostMessage', (event, message) => { | ||
19 | debug('Received host message', event, message); | ||
20 | hostMessageListener(message); | ||
21 | }); | ||
diff --git a/src/features/todos/store.js b/src/features/todos/store.js index e7e13b37f..737902946 100644 --- a/src/features/todos/store.js +++ b/src/features/todos/store.js | |||
@@ -18,6 +18,8 @@ export default class TodoStore extends FeatureStore { | |||
18 | 18 | ||
19 | @observable isFeatureActive = false; | 19 | @observable isFeatureActive = false; |
20 | 20 | ||
21 | webview = null; | ||
22 | |||
21 | @computed get width() { | 23 | @computed get width() { |
22 | const width = this.settings.width || DEFAULT_TODOS_WIDTH; | 24 | const width = this.settings.width || DEFAULT_TODOS_WIDTH; |
23 | 25 | ||
@@ -39,6 +41,9 @@ export default class TodoStore extends FeatureStore { | |||
39 | 41 | ||
40 | this._registerActions(createActionBindings([ | 42 | this._registerActions(createActionBindings([ |
41 | [todoActions.resize, this._resize], | 43 | [todoActions.resize, this._resize], |
44 | [todoActions.setTodosWebview, this._setTodosWebview], | ||
45 | [todoActions.handleHostMessage, this._handleHostMessage], | ||
46 | [todoActions.handleClientMessage, this._handleClientMessage], | ||
42 | ])); | 47 | ])); |
43 | 48 | ||
44 | // REACTIONS | 49 | // REACTIONS |
@@ -76,6 +81,30 @@ export default class TodoStore extends FeatureStore { | |||
76 | }); | 81 | }); |
77 | }; | 82 | }; |
78 | 83 | ||
84 | @action _setTodosWebview = ({ webview }) => { | ||
85 | debug('_setTodosWebview', webview); | ||
86 | this.webview = webview; | ||
87 | }; | ||
88 | |||
89 | @action _handleHostMessage = (message) => { | ||
90 | debug('_handleHostMessage', message); | ||
91 | if (message.action === 'create:todo') { | ||
92 | console.log(this.webview); | ||
93 | this.webview.send('hostMessage', message); | ||
94 | } | ||
95 | }; | ||
96 | |||
97 | @action _handleClientMessage = (message) => { | ||
98 | debug('_handleClientMessage', message); | ||
99 | if (message.action === 'goToService') { | ||
100 | const { url, serviceId } = message.data; | ||
101 | if (url) { | ||
102 | this.stores.services.one(serviceId).webview.loadURL(url); | ||
103 | } | ||
104 | this.actions.service.setActive({ serviceId }); | ||
105 | } | ||
106 | }; | ||
107 | |||
79 | // Reactions | 108 | // Reactions |
80 | 109 | ||
81 | _setFeatureEnabledReaction = () => { | 110 | _setFeatureEnabledReaction = () => { |