Split apart the frontend Editor type into SubscriptionsRouter and EditorHandle (#3923)

* Remove the unused Editor.raw/wasmMemory/wasmImport

* Split out Editor.subscriptions

* Replace editor.handle.* with editor.* (1 of 2)

* Replace editor.handle.* with editor.* (2 of 2)

* Replace Editor typedef with EditorHandle import

* Pluralize subscription-router and rename subscriptionsRef->subscriptionsRouter and editorRef->editorHandle

* Remove editor.ts

* Update the readme

* Fix demo art loading bug
This commit is contained in:
Keavon Chambers
2026-03-20 23:34:13 -07:00
committed by GitHub
parent 64fd12a1a0
commit ed7987c881
40 changed files with 549 additions and 584 deletions
+16 -16
View File
@@ -2,7 +2,7 @@ import { writable } from "svelte/store";
import type { Writable } from "svelte/store";
import type { AppWindowPlatform } from "@graphite/../wasm/pkg/graphite_wasm";
import type { Editor } from "@graphite/editor";
import type { SubscriptionsRouter } from "/src/subscriptions-router";
export type AppWindowStore = ReturnType<typeof createAppWindowStore>;
@@ -21,47 +21,47 @@ const initialState: AppWindowStoreState = {
uiScale: 1,
};
let editorRef: Editor | undefined = undefined;
let subscriptionsRouter: SubscriptionsRouter | undefined = undefined;
// Store state persisted across HMR to maintain reactive subscriptions in the component tree
const store: Writable<AppWindowStoreState> = import.meta.hot?.data?.store || writable<AppWindowStoreState>(initialState);
if (import.meta.hot) import.meta.hot.data.store = store;
const { subscribe, update } = store;
export function createAppWindowStore(editor: Editor) {
export function createAppWindowStore(subscriptions: SubscriptionsRouter) {
destroyAppWindowStore();
editorRef = editor;
subscriptionsRouter = subscriptions;
editor.subscriptions.subscribeFrontendMessage("UpdatePlatform", (data) => {
subscriptions.subscribeFrontendMessage("UpdatePlatform", (data) => {
update((state) => {
state.platform = data.platform;
return state;
});
});
editor.subscriptions.subscribeFrontendMessage("UpdateMaximized", (data) => {
subscriptions.subscribeFrontendMessage("UpdateMaximized", (data) => {
update((state) => {
state.maximized = data.maximized;
return state;
});
});
editor.subscriptions.subscribeFrontendMessage("UpdateFullscreen", (data) => {
subscriptions.subscribeFrontendMessage("UpdateFullscreen", (data) => {
update((state) => {
state.fullscreen = data.fullscreen;
return state;
});
});
editor.subscriptions.subscribeFrontendMessage("UpdateViewportHolePunch", (data) => {
subscriptions.subscribeFrontendMessage("UpdateViewportHolePunch", (data) => {
update((state) => {
state.viewportHolePunch = data.active;
return state;
});
});
editor.subscriptions.subscribeFrontendMessage("UpdateUIScale", (data) => {
subscriptions.subscribeFrontendMessage("UpdateUIScale", (data) => {
update((state) => {
state.uiScale = data.scale;
return state;
@@ -72,12 +72,12 @@ export function createAppWindowStore(editor: Editor) {
}
export function destroyAppWindowStore() {
const editor = editorRef;
if (!editor) return;
const subscriptions = subscriptionsRouter;
if (!subscriptions) return;
editor.subscriptions.unsubscribeFrontendMessage("UpdatePlatform");
editor.subscriptions.unsubscribeFrontendMessage("UpdateMaximized");
editor.subscriptions.unsubscribeFrontendMessage("UpdateFullscreen");
editor.subscriptions.unsubscribeFrontendMessage("UpdateViewportHolePunch");
editor.subscriptions.unsubscribeFrontendMessage("UpdateUIScale");
subscriptions.unsubscribeFrontendMessage("UpdatePlatform");
subscriptions.unsubscribeFrontendMessage("UpdateMaximized");
subscriptions.unsubscribeFrontendMessage("UpdateFullscreen");
subscriptions.unsubscribeFrontendMessage("UpdateViewportHolePunch");
subscriptions.unsubscribeFrontendMessage("UpdateUIScale");
}