refactor: Less boilerplate around SophieRenderer

12 files changed, 201 insertions, 154 deletions

diff --git a/packages/main/src/index.ts b/packages/main/src/index.ts
index 67f5546..7aa3ee9 100644
--- a/packages/main/src/index.ts
+++ b/packages/main/src/index.ts
@@ -35,9 +35,8 @@ import {
   WebSource,
 } from '@sophie/service-shared';
 import {
-  browserViewBounds,
+  action,
   MainToRendererIpcMessage,
-  themeSource,
   RendererToMainIpcMessage,
 } from '@sophie/shared';
 import { URL } from 'url';
@@ -194,19 +193,39 @@ function createWindow(): Promise<unknown> {
   });
   mainWindow.setBrowserView(browserView);
 
-  webContents.on('ipc-message', (_event, channel, ...args) => {
+  ipcMain.handle(RendererToMainIpcMessage.GetSharedStoreSnapshot, (event) => {
+    if (event.sender.id !== webContents.id) {
+      console.warn(
+        'Unexpected',
+        RendererToMainIpcMessage.GetSharedStoreSnapshot,
+        'from webContents',
+        event.sender.id,
+      );
+      return null;
+    }
+    return getSnapshot(store.shared);
+  });
+
+  ipcMain.on(RendererToMainIpcMessage.DispatchAction, (event, rawAction) => {
+    if (event.sender.id !== webContents.id) {
+      console.warn(
+        'Unexpected',
+        RendererToMainIpcMessage.DispatchAction,
+        'from webContents',
+        event.sender.id,
+      );
+      return;
+    }
     try {
-      switch (channel) {
-        case RendererToMainIpcMessage.SharedStoreSnapshotRequest:
-          webContents.send(MainToRendererIpcMessage.SharedStoreSnapshot, getSnapshot(store.shared));
+      const actionToDispatch = action.parse(rawAction);
+      switch (actionToDispatch.action) {
+        case 'set-browser-view-bounds':
+          store.setBrowserViewBounds(actionToDispatch.browserViewBounds);
           break;
-        case RendererToMainIpcMessage.SetBrowserViewBounds:
-          store.setBrowserViewBounds(browserViewBounds.parse(args[0]));
+        case 'set-theme-source':
+          store.config.setThemeSource(actionToDispatch.themeSource)
           break;
-        case RendererToMainIpcMessage.SetThemeSource:
-          store.config.setThemeSource(themeSource.parse(args[0]))
-          break;
-        case RendererToMainIpcMessage.ReloadAllServices:
+        case 'reload-all-services':
           readFile(serviceInjectPath, 'utf8').then((data) => {
             serviceInject.code = data;
           }).catch((err) => {
@@ -215,12 +234,9 @@ function createWindow(): Promise<unknown> {
             browserView.webContents.reload();
           });
           break;
-        default:
-          console.error('Unknown IPC message:', channel, args);
-          break;
       }
     } catch (err) {
-      console.error('Error while processing IPC message:', channel, args, err);
+      console.error('Error while dispatching renderer action', rawAction, err);
     }
   });
 
diff --git a/packages/preload/src/SophieRendererImpl.ts b/packages/preload/src/SophieRendererImpl.ts
deleted file mode 100644
index a06433f..0000000
--- a/packages/preload/src/SophieRendererImpl.ts
+++ /dev/null
@@ -1,112 +0,0 @@
-/*
- * Copyright (C)  2021-2022 Kristóf Marussy <kristof@marussy.com>
- *
- * This file is part of Sophie.
- *
- * Sophie is free software: you can redistribute it and/or modify
- * it under the terms of the GNU Affero General Public License as
- * published by the Free Software Foundation, version 3.
- *
- * This program is distributed in the hope that it will be useful,
- * but WITHOUT ANY WARRANTY; without even the implied warranty of
- * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
- * GNU Affero General Public License for more details.
- *
- * You should have received a copy of the GNU Affero General Public License
- * along with this program.  If not, see <https://www.gnu.org/licenses/>.
- *
- * SPDX-License-Identifier: AGPL-3.0-only
- */
-
-import { ipcRenderer } from 'electron';
-import type { IJsonPatch } from 'mobx-state-tree';
-import {
-  BrowserViewBounds,
-  browserViewBounds,
-  MainToRendererIpcMessage,
-  RendererToMainIpcMessage,
-  sharedStore,
-  SharedStoreListener,
-  SharedStoreSnapshotIn,
-  SophieRenderer,
-  themeSource,
-  ThemeSource,
-} from '@sophie/shared';
-
-export type MessageSender = (channel: RendererToMainIpcMessage, ...args: unknown[]) => void;
-
-export class SophieRendererImpl implements SophieRenderer {
-  readonly #send: MessageSender;
-
-  #listener: SharedStoreListener | null = null;
-
-  #snapshot: SharedStoreSnapshotIn | null = null;
-
-  constructor(send: MessageSender) {
-    this.#send = send;
-  }
-
-  sharedStoreSnapshotReceived(snapshot: unknown): void {
-    if (sharedStore.is(snapshot)) {
-      if (this.#listener === null) {
-        this.#snapshot = snapshot;
-      } else {
-        this.#listener.onSnapshot(snapshot);
-      }
-    } else {
-      console.error('Received invalid snapshot', snapshot);
-      this.#snapshot = null;
-    }
-  }
-
-  sharedStorePatchReceived(patch: unknown): void {
-    if (this.#listener !== null) {
-      // `mobx-state-tree` will validate the patch, so we can safely cast here.
-      this.#listener.onPatch(patch as IJsonPatch);
-    }
-  }
-
-  setSharedStoreListener(listener: SharedStoreListener): void {
-    this.#listener = listener;
-    if (this.#snapshot !== null) {
-      listener.onSnapshot(this.#snapshot);
-      this.#snapshot = null;
-    }
-    this.#send(RendererToMainIpcMessage.SharedStoreSnapshotRequest);
-  }
-
-  setBrowserViewBounds(bounds: BrowserViewBounds): void {
-    if (browserViewBounds.safeParse(bounds).success) {
-      this.#send(RendererToMainIpcMessage.SetBrowserViewBounds, bounds);
-    }
-  }
-
-  setThemeSource(mode: ThemeSource): void {
-    if (themeSource.safeParse(mode).success) {
-      this.#send(RendererToMainIpcMessage.SetThemeSource, mode);
-    }
-  }
-
-  reloadAllServices(): void {
-    this.#send(RendererToMainIpcMessage.ReloadAllServices);
-  }
-}
-
-export function createSophieRenderer(): SophieRenderer {
-  const impl = new SophieRendererImpl(ipcRenderer.send);
-
-  ipcRenderer.on(MainToRendererIpcMessage.SharedStoreSnapshot, (_event, snapshot) => {
-    impl.sharedStoreSnapshotReceived(snapshot);
-  });
-
-  ipcRenderer.on(MainToRendererIpcMessage.SharedStorePatch, (_event, patch) => {
-    impl.sharedStorePatchReceived(patch);
-  });
-
-  return {
-    setSharedStoreListener: impl.setSharedStoreListener.bind(impl),
-    setBrowserViewBounds: impl.setBrowserViewBounds.bind(impl),
-    setThemeSource: impl.setThemeSource.bind(impl),
-    reloadAllServices: impl.reloadAllServices.bind(impl),
-  };
-}
diff --git a/packages/preload/src/contextBridge/SophieRendererImpl.ts b/packages/preload/src/contextBridge/SophieRendererImpl.ts
new file mode 100644
index 0000000..5d29071
--- /dev/null
+++ b/packages/preload/src/contextBridge/SophieRendererImpl.ts
@@ -0,0 +1,74 @@
+/*
+ * Copyright (C)  2021-2022 Kristóf Marussy <kristof@marussy.com>
+ *
+ * This file is part of Sophie.
+ *
+ * Sophie is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as
+ * published by the Free Software Foundation, version 3.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+ *
+ * SPDX-License-Identifier: AGPL-3.0-only
+ */
+
+import type { IJsonPatch } from 'mobx-state-tree';
+import {
+  Action,
+  action,
+  sharedStore,
+  SharedStoreListener,
+  SophieRenderer,
+} from '@sophie/shared';
+
+import { RendererToMainIpcService } from '../services/RendererToMainIpcService';
+
+class SophieRendererImpl implements SophieRenderer {
+  readonly #ipcService: RendererToMainIpcService;
+
+  #listener: SharedStoreListener | null = null;
+
+  constructor(ipcService: RendererToMainIpcService) {
+    this.#ipcService = ipcService;
+    ipcService.onSharedStorePatch((patch) => {
+      // `mobx-state-tree` will validate the patch, so we can safely cast here.
+      this.#listener?.onPatch(patch as IJsonPatch);
+    });
+  }
+
+  onSharedStoreChange(listener: SharedStoreListener): void {
+    this.#ipcService.getSharedStoreSnapshot().then((snapshot) => {
+      if (sharedStore.is(snapshot)) {
+        listener.onSnapshot(snapshot);
+        this.#listener = listener;
+      } else {
+        console.error('Got invalid initial shared store snapshot', snapshot);
+      }
+    }).catch((err) => {
+      console.error('Failed set initial shared store snapshot', err);
+    });
+  }
+
+  dispatchAction(actionToDispatch: Action): void {
+    const parsedAction = action.safeParse(actionToDispatch);
+    if (parsedAction.success) {
+      this.#ipcService.dispatchAction(parsedAction.data);
+    } else {
+      console.error('Trying to dispatch invalid action', actionToDispatch, parsedAction.error);
+    }
+  }
+}
+
+export function createSophieRenderer(ipcService: RendererToMainIpcService): SophieRenderer {
+  const impl = new SophieRendererImpl(ipcService);
+  return {
+    onSharedStoreChange: impl.onSharedStoreChange.bind(impl),
+    dispatchAction: impl.dispatchAction.bind(impl),
+  };
+}
diff --git a/packages/preload/src/index.ts b/packages/preload/src/index.ts
index ef85f70..9336433 100644
--- a/packages/preload/src/index.ts
+++ b/packages/preload/src/index.ts
@@ -20,8 +20,9 @@
 
 import { contextBridge } from 'electron';
 
-import { createSophieRenderer } from './SophieRendererImpl';
+import { createSophieRenderer } from './contextBridge/SophieRendererImpl';
+import { RendererToMainIpcService } from './services/RendererToMainIpcService';
 
-const sophieRenderer = createSophieRenderer();
+const sophieRenderer = createSophieRenderer(new RendererToMainIpcService());
 
 contextBridge.exposeInMainWorld('sophieRenderer', sophieRenderer);
diff --git a/packages/preload/src/services/RendererToMainIpcService.ts b/packages/preload/src/services/RendererToMainIpcService.ts
new file mode 100644
index 0000000..40f1339
--- /dev/null
+++ b/packages/preload/src/services/RendererToMainIpcService.ts
@@ -0,0 +1,42 @@
+/*
+ * Copyright (C)  2021-2022 Kristóf Marussy <kristof@marussy.com>
+ *
+ * This file is part of Sophie.
+ *
+ * Sophie is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as
+ * published by the Free Software Foundation, version 3.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+ *
+ * SPDX-License-Identifier: AGPL-3.0-only
+ */
+
+import { ipcRenderer } from 'electron';
+import {
+  Action,
+  MainToRendererIpcMessage,
+  RendererToMainIpcMessage,
+} from '@sophie/shared';
+
+export class RendererToMainIpcService {
+  getSharedStoreSnapshot(): Promise<unknown> {
+    return ipcRenderer.invoke(RendererToMainIpcMessage.GetSharedStoreSnapshot);
+  }
+
+  dispatchAction(actionToDispatch: Action): void {
+    ipcRenderer.send(RendererToMainIpcMessage.DispatchAction, actionToDispatch);
+  }
+
+  onSharedStorePatch(callback: (patch: unknown) => void): void {
+    ipcRenderer.on(MainToRendererIpcMessage.SharedStorePatch, (_event, patch) => {
+      callback(patch);
+    })
+  }
+}
diff --git a/packages/renderer/src/devTools.ts b/packages/renderer/src/devTools.ts
index 44c87ae..7c44559 100644
--- a/packages/renderer/src/devTools.ts
+++ b/packages/renderer/src/devTools.ts
@@ -64,7 +64,9 @@ export function hotReloadServices(): void {
   import.meta.hot?.on(
     'sophie:reload-services',
     () => {
-      window.sophieRenderer.reloadAllServices();
+      window.sophieRenderer.dispatchAction({
+        action: 'reload-all-services',
+      });
     },
   );
 }
diff --git a/packages/renderer/src/stores/RendererEnv.ts b/packages/renderer/src/stores/RendererEnv.ts
index f2ec519..d687738 100644
--- a/packages/renderer/src/stores/RendererEnv.ts
+++ b/packages/renderer/src/stores/RendererEnv.ts
@@ -19,10 +19,10 @@
  */
 
 import { getEnv as getAnyEnv, IAnyStateTreeNode } from 'mobx-state-tree';
-import type { SophieRenderer } from '@sophie/shared';
+import type { Action } from '@sophie/shared';
 
 export interface RendererEnv {
-  ipc: Omit<SophieRenderer, 'setSharedStoreListener'>;
+  dispatchMainAction(action: Action): void;
 }
 
 /**
diff --git a/packages/renderer/src/stores/RendererStore.ts b/packages/renderer/src/stores/RendererStore.ts
index 001f23a..3de82ac 100644
--- a/packages/renderer/src/stores/RendererStore.ts
+++ b/packages/renderer/src/stores/RendererStore.ts
@@ -31,16 +31,22 @@ import {
   ThemeSource,
 } from '@sophie/shared';
 
-import { getEnv } from './RendererEnv';
+import { getEnv, RendererEnv } from './RendererEnv';
 
 export const rendererStore = types.model('RendererStore', {
   shared: types.optional(sharedStore, {}),
 }).actions((self) => ({
-  setBrowserViewBounds(bounds: BrowserViewBounds) {
-    getEnv(self).ipc.setBrowserViewBounds(bounds);
+  setBrowserViewBounds(browserViewBounds: BrowserViewBounds) {
+    getEnv(self).dispatchMainAction({
+      action: 'set-browser-view-bounds',
+      browserViewBounds,
+    });
   },
-  setThemeSource(mode: ThemeSource) {
-    getEnv(self).ipc.setThemeSource(mode);
+  setThemeSource(themeSource: ThemeSource) {
+    getEnv(self).dispatchMainAction({
+      action: 'set-theme-source',
+      themeSource,
+    });
   },
   toggleDarkMode() {
     if (self.shared.shouldUseDarkColors) {
@@ -62,11 +68,12 @@ export interface RendererStore extends Instance<typeof rendererStore> {}
  * @param ipc The `sophieRenderer` context bridge.
  */
 export function createAndConnectRendererStore(ipc: SophieRenderer): RendererStore {
-  const store = rendererStore.create({}, {
-    ipc,
-  });
+  const env: RendererEnv = {
+    dispatchMainAction: ipc.dispatchAction,
+  }
+  const store = rendererStore.create({}, env);
 
-  ipc.setSharedStoreListener({
+  ipc.onSharedStoreChange({
     onSnapshot(snapshot) {
       applySnapshot(store.shared, snapshot);
     },
diff --git a/packages/shared/src/contextBridge/SophieRenderer.ts b/packages/shared/src/contextBridge/SophieRenderer.ts
index 6a2e432..a471250 100644
--- a/packages/shared/src/contextBridge/SophieRenderer.ts
+++ b/packages/shared/src/contextBridge/SophieRenderer.ts
@@ -20,14 +20,10 @@
 
 import { SharedStoreListener } from '../stores/SharedStore';
 
-import { BrowserViewBounds, ThemeSource } from '../schemas';
+import { Action } from '../schemas';
 
 export interface SophieRenderer {
-  setSharedStoreListener(listener: SharedStoreListener): void;
+  onSharedStoreChange(listener: SharedStoreListener): void;
 
-  setBrowserViewBounds(bounds: BrowserViewBounds): void;
-
-  setThemeSource(mode: ThemeSource): void;
-
-  reloadAllServices(): void;
+  dispatchAction(action: Action): void;
 }
diff --git a/packages/shared/src/index.ts b/packages/shared/src/index.ts
index 713984e..2f7146c 100644
--- a/packages/shared/src/index.ts
+++ b/packages/shared/src/index.ts
@@ -26,10 +26,12 @@ export {
 } from './ipc';
 
 export type {
+  Action,
   BrowserViewBounds,
   ThemeSource,
 } from './schemas';
 export {
+  action,
   browserViewBounds,
   themeSource,
 } from './schemas';
diff --git a/packages/shared/src/ipc.ts b/packages/shared/src/ipc.ts
index d2f65f7..54d761a 100644
--- a/packages/shared/src/ipc.ts
+++ b/packages/shared/src/ipc.ts
@@ -19,13 +19,10 @@
  */
 
 export enum MainToRendererIpcMessage {
-  SharedStoreSnapshot = 'sophie-main-to-renderer:shared-store-snapshot',
   SharedStorePatch = 'sophie-main-to-renderer:shared-store-patch',
 }
 
 export enum RendererToMainIpcMessage {
-  SharedStoreSnapshotRequest = 'sophie-renderer-to-main:shared-store-snapshot-request',
-  SetBrowserViewBounds = 'sophie-renderer-to-main:set-browser-view-bounds',
-  SetThemeSource = 'sophie-renderer-to-main:set-theme-source',
-  ReloadAllServices = 'sophie-renderer-to-main:reload-all-services',
+  GetSharedStoreSnapshot = 'sophie-renderer-to-main:get-shared-store-snapshot',
+  DispatchAction = 'sophie-renderer-to-main:dispatch-action',
 }
diff --git a/packages/shared/src/schemas.ts b/packages/shared/src/schemas.ts
index 0eff581..9090486 100644
--- a/packages/shared/src/schemas.ts
+++ b/packages/shared/src/schemas.ts
@@ -29,6 +29,28 @@ export const browserViewBounds = z.object({
 
 export type BrowserViewBounds = z.infer<typeof browserViewBounds>;
 
+const setBrowserViewBoundsAction = z.object({
+  action: z.literal('set-browser-view-bounds'),
+  browserViewBounds,
+});
+
 export const themeSource = z.enum(['system', 'light', 'dark']);
 
 export type ThemeSource = z.infer<typeof themeSource>;
+
+const setThemeSourceAction = z.object({
+  action: z.literal('set-theme-source'),
+  themeSource,
+});
+
+const reloadAllServicesAction = z.object({
+  action: z.literal('reload-all-services'),
+});
+
+export const action = z.union([
+  setBrowserViewBoundsAction,
+  setThemeSourceAction,
+  reloadAllServicesAction,
+]);
+
+export type Action = z.infer<typeof action>;