feat: Main to renderer store synchronization

Patches are send in one direction only, from the main to the renderer,
so all actions have to go through the context bridge and the renderer
IPC to modify the store in the renderer. This makes the store in the
main process a single source of truth, which simplifies debugging and
state persistence.

The store in the renderer is connected to redux devtools for inspection,
but playing back the state in the devtools won't change the sotre in
main process.

8 files changed, 55 insertions, 9 deletions

diff --git a/packages/shared/package.json b/packages/shared/package.json
index ccde705..f49be47 100644
--- a/packages/shared/package.json
+++ b/packages/shared/package.json
@@ -3,6 +3,7 @@
   "version": "0.1.0",
   "private": true,
   "main": "dist/index.cjs",
+  "module": "dist/index.es.js",
   "types": "dist/index.d.ts",
   "scripts": {
     "build": "vite build",
@@ -11,5 +12,9 @@
   "devDependencies": {
     "typescript": "^4.5.4",
     "vite": "^2.7.6"
+  },
+  "dependencies": {
+    "mobx": "^6.3.10",
+    "mobx-state-tree": "^5.1.0"
   }
 }
diff --git a/packages/shared/src/contextBridge/SophieRenderer.ts b/packages/shared/src/contextBridge/SophieRenderer.ts
index 91a0a3c..c878595 100644
--- a/packages/shared/src/contextBridge/SophieRenderer.ts
+++ b/packages/shared/src/contextBridge/SophieRenderer.ts
@@ -1,3 +1,7 @@
+import { SharedStoreListener } from '../stores/SharedStore';
+
 export interface SophieRenderer {
-  buttonClicked(): void;
+  setSharedStoreListener(listener: SharedStoreListener): void;
+
+  buttonClick(): void;
 }
diff --git a/packages/shared/src/index.ts b/packages/shared/src/index.ts
index f95675d..7f192bd 100644
--- a/packages/shared/src/index.ts
+++ b/packages/shared/src/index.ts
@@ -1,3 +1,12 @@
 export type { SophieRenderer } from './contextBridge/SophieRenderer';
 
-export { RendererIpcMessage } from './ipc/RendererIpcMessage';
+export { MainToRendererIpcMessage } from './ipc/MainToRendererIpcMessage';
+export { RendererToMainIpcMessage } from './ipc/RendererToMainIpcMessage';
+
+export type {
+  SharedStore,
+  SharedStoreListener,
+  SharedStoreSnapshotIn,
+  SharedStoreSnapshotOut,
+} from './stores/SharedStore';
+export { sharedStore } from './stores/SharedStore';
diff --git a/packages/shared/src/ipc/MainToRendererIpcMessage.ts b/packages/shared/src/ipc/MainToRendererIpcMessage.ts
new file mode 100644
index 0000000..2ddca80
--- /dev/null
+++ b/packages/shared/src/ipc/MainToRendererIpcMessage.ts
@@ -0,0 +1,4 @@
+export enum MainToRendererIpcMessage {
+  SharedStoreSnapshot = "sophie-shared-store-snapshot",
+  SharedStorePatch = "sophie-shared-store-patch",
+}
diff --git a/packages/shared/src/ipc/RendererIpcMessage.ts b/packages/shared/src/ipc/RendererIpcMessage.ts
deleted file mode 100644
index cfb87ae..0000000
--- a/packages/shared/src/ipc/RendererIpcMessage.ts
+++ /dev/null
@@ -1,3 +0,0 @@
-export enum RendererIpcMessage {
-  ButtonClicked = "button-clicked"
-}
diff --git a/packages/shared/src/ipc/RendererToMainIpcMessage.ts b/packages/shared/src/ipc/RendererToMainIpcMessage.ts
new file mode 100644
index 0000000..c4c682d
--- /dev/null
+++ b/packages/shared/src/ipc/RendererToMainIpcMessage.ts
@@ -0,0 +1,4 @@
+export enum RendererToMainIpcMessage {
+  SharedStoreSnapshotRequest = "sophie-shared-store-snapshot-request",
+  ButtonClick = "sophie-button-click"
+}
diff --git a/packages/shared/src/stores/SharedStore.ts b/packages/shared/src/stores/SharedStore.ts
new file mode 100644
index 0000000..8933bca
--- /dev/null
+++ b/packages/shared/src/stores/SharedStore.ts
@@ -0,0 +1,23 @@
+import {
+  IJsonPatch,
+  Instance,
+  types,
+  SnapshotIn,
+  SnapshotOut,
+} from 'mobx-state-tree';
+
+export const sharedStore = types.model("SharedStore", {
+  clickCount: 0
+});
+
+export interface SharedStore extends Instance<typeof sharedStore> {}
+
+export interface SharedStoreSnapshotIn extends SnapshotIn<typeof sharedStore> {}
+
+export interface SharedStoreSnapshotOut extends SnapshotOut<typeof sharedStore> {}
+
+export interface SharedStoreListener {
+  onSnapshot(snapshot: SharedStoreSnapshotIn): void;
+
+  onPatch(patch: IJsonPatch): void;
+}
diff --git a/packages/shared/vite.config.js b/packages/shared/vite.config.js
index cbebb8a..05ec118 100644
--- a/packages/shared/vite.config.js
+++ b/packages/shared/vite.config.js
@@ -26,15 +26,15 @@ const config = {
     outDir: 'dist',
     lib: {
       entry: 'src/index.ts',
-      formats: ['cjs'],
+      formats: ['cjs', 'es'],
+      fileName: (format) => format === 'cjs' ? 'index.cjs' : `index.${format}.js`,
     },
     rollupOptions: {
       external: [
+        'mobx',
+        'mobx-state-tree',
         ...builtinModules,
       ],
-      output: {
-        entryFileNames: '[name].cjs',
-      },
     },
     emptyOutDir: false, // Do not remove `.d.ts` files.
     brotliSize: false,