From 6195c16580e1ac92f5187ced52afd5bf3b28a0da Mon Sep 17 00:00:00 2001 From: Kristóf Marussy Date: Sun, 26 Dec 2021 20:13:17 +0100 Subject: refactor: Rename RootStore to RendererStore --- packages/renderer/src/components/StoreProvider.tsx | 8 +- packages/renderer/src/index.tsx | 4 +- packages/renderer/src/stores/RendererEnv.ts | 37 +++++++++ packages/renderer/src/stores/RendererStore.ts | 79 ++++++++++++++++++ packages/renderer/src/stores/RootStore.ts | 94 ---------------------- 5 files changed, 122 insertions(+), 100 deletions(-) create mode 100644 packages/renderer/src/stores/RendererEnv.ts create mode 100644 packages/renderer/src/stores/RendererStore.ts delete mode 100644 packages/renderer/src/stores/RootStore.ts (limited to 'packages/renderer') diff --git a/packages/renderer/src/components/StoreProvider.tsx b/packages/renderer/src/components/StoreProvider.tsx index 0d9a36c..da1e699 100644 --- a/packages/renderer/src/components/StoreProvider.tsx +++ b/packages/renderer/src/components/StoreProvider.tsx @@ -20,11 +20,11 @@ import React, { createContext, useContext } from 'react'; -import type { RootStore } from '../stores/RootStore'; +import type { RendererStore } from '../stores/RendererStore'; -const StoreContext = createContext(null); +const StoreContext = createContext(null); -export function useStore(): RootStore { +export function useStore(): RendererStore { const store = useContext(StoreContext); if (store === null) { throw new Error('useStore can only be called inside of StoreProvider'); @@ -34,7 +34,7 @@ export function useStore(): RootStore { export function StoreProvider({ children, store }: { children: JSX.Element | JSX.Element[], - store: RootStore, + store: RendererStore, }): JSX.Element { return ( diff --git a/packages/renderer/src/index.tsx b/packages/renderer/src/index.tsx index 0919b93..befb823 100644 --- a/packages/renderer/src/index.tsx +++ b/packages/renderer/src/index.tsx @@ -30,7 +30,7 @@ import { App } from './components/App'; import { StoreProvider } from './components/StoreProvider'; import { ThemeProvider } from './components/ThemeProvider'; import { exposeToReduxDevtools, hotReloadServices } from './devTools'; -import { createAndConnectRootStore } from './stores/RootStore'; +import { createAndConnectRendererStore } from './stores/RendererStore'; const isDevelopment = import.meta.env.MODE === 'development'; @@ -38,7 +38,7 @@ if (isDevelopment) { hotReloadServices(); } -const store = createAndConnectRootStore(window.sophieRenderer); +const store = createAndConnectRendererStore(window.sophieRenderer); if (isDevelopment) { exposeToReduxDevtools(store); diff --git a/packages/renderer/src/stores/RendererEnv.ts b/packages/renderer/src/stores/RendererEnv.ts new file mode 100644 index 0000000..f2ec519 --- /dev/null +++ b/packages/renderer/src/stores/RendererEnv.ts @@ -0,0 +1,37 @@ +/* + * Copyright (C) 2021-2022 Kristóf Marussy + * + * 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 . + * + * SPDX-License-Identifier: AGPL-3.0-only + */ + +import { getEnv as getAnyEnv, IAnyStateTreeNode } from 'mobx-state-tree'; +import type { SophieRenderer } from '@sophie/shared'; + +export interface RendererEnv { + ipc: Omit; +} + +/** + * Gets a well-typed environment from `model`. + * + * Only useable inside state trees created by `createAndConnectRootStore`. + * + * @param model The state tree node. + */ +export function getEnv(model: IAnyStateTreeNode): RendererEnv { + return getAnyEnv(model); +} diff --git a/packages/renderer/src/stores/RendererStore.ts b/packages/renderer/src/stores/RendererStore.ts new file mode 100644 index 0000000..001f23a --- /dev/null +++ b/packages/renderer/src/stores/RendererStore.ts @@ -0,0 +1,79 @@ +/* + * Copyright (C) 2021-2022 Kristóf Marussy + * + * 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 . + * + * SPDX-License-Identifier: AGPL-3.0-only + */ + +import { + applySnapshot, + applyPatch, + Instance, + types +} from 'mobx-state-tree'; +import { + BrowserViewBounds, + sharedStore, + SophieRenderer, + ThemeSource, +} from '@sophie/shared'; + +import { getEnv } from './RendererEnv'; + +export const rendererStore = types.model('RendererStore', { + shared: types.optional(sharedStore, {}), +}).actions((self) => ({ + setBrowserViewBounds(bounds: BrowserViewBounds) { + getEnv(self).ipc.setBrowserViewBounds(bounds); + }, + setThemeSource(mode: ThemeSource) { + getEnv(self).ipc.setThemeSource(mode); + }, + toggleDarkMode() { + if (self.shared.shouldUseDarkColors) { + this.setThemeSource('light'); + } else { + this.setThemeSource('dark'); + } + }, +})); + +export interface RendererStore extends Instance {} + +/** + * Creates a new `RootStore` with a new environment and connects it to `ipc`. + * + * Changes to the `shared` store in the main process will be propagated to + * the newly created store via `ipc`. + * + * @param ipc The `sophieRenderer` context bridge. + */ +export function createAndConnectRendererStore(ipc: SophieRenderer): RendererStore { + const store = rendererStore.create({}, { + ipc, + }); + + ipc.setSharedStoreListener({ + onSnapshot(snapshot) { + applySnapshot(store.shared, snapshot); + }, + onPatch(patch) { + applyPatch(store.shared, patch); + }, + }); + + return store; +} diff --git a/packages/renderer/src/stores/RootStore.ts b/packages/renderer/src/stores/RootStore.ts deleted file mode 100644 index f7f37f0..0000000 --- a/packages/renderer/src/stores/RootStore.ts +++ /dev/null @@ -1,94 +0,0 @@ -/* - * Copyright (C) 2021-2022 Kristóf Marussy - * - * 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 . - * - * SPDX-License-Identifier: AGPL-3.0-only - */ - -import { - applySnapshot, - applyPatch, - getEnv as getAnyEnv, - IAnyStateTreeNode, - Instance, - types -} from 'mobx-state-tree'; -import { - BrowserViewBounds, - sharedStore, - SophieRenderer, - ThemeSource, -} from '@sophie/shared'; - -export interface RootEnv { - ipc: Omit; -} - -/** - * Gets a well-typed environment from `model`. - * - * Only useable inside state trees created by `createAndConnectRootStore`. - * - * @param model The state tree node. - */ -export function getEnv(model: IAnyStateTreeNode): RootEnv { - return getAnyEnv(model); -} - -export const rootStore = types.model('RootStore', { - shared: types.optional(sharedStore, {}), -}).actions((self) => ({ - setBrowserViewBounds(bounds: BrowserViewBounds) { - getEnv(self).ipc.setBrowserViewBounds(bounds); - }, - setThemeSource(mode: ThemeSource) { - getEnv(self).ipc.setThemeSource(mode); - }, - toggleDarkMode() { - if (self.shared.shouldUseDarkColors) { - this.setThemeSource('light'); - } else { - this.setThemeSource('dark'); - } - }, -})); - -export interface RootStore extends Instance {} - -/** - * Creates a new `RootStore` with a new environment and connects it to `ipc`. - * - * Changes to the `shared` store in the main process will be propagated to - * the newly created store via `ipc`. - * - * @param ipc The `sophieRenderer` context bridge. - */ -export function createAndConnectRootStore(ipc: SophieRenderer): RootStore { - const store = rootStore.create({}, { - ipc, - }); - - ipc.setSharedStoreListener({ - onSnapshot(snapshot) { - applySnapshot(store.shared, snapshot); - }, - onPatch(patch) { - applyPatch(store.shared, patch); - }, - }); - - return store; -} -- cgit v1.2.3-54-g00ecf