fork/Graphite
1
0
Fork 0
mirror of https://github.com/GraphiteEditor/Graphite.git synced 2026-09-27 12:18:11 +08:00
Code Issues Packages Projects Releases Wiki Activity

Restructure frontend TS files so managers/stores export destructors instead of returning them from their constructors (#3919)

Browse Source 
* Replace parameter passing with getContext and extract destroy functions to module-level exports

* Resend layouts from Rust when editor is re-mounted on HMR

* Code review
This commit is contained in:
Keavon Chambers
2026-03-19 18:25:34 -07:00
committed by GitHub
parent 124b17f609
commit 2e2c4fe180
21 changed files with 983 additions and 897 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/stores/dialog.ts
+19 -24
View File
@@ -7,6 +7,8 @@ import type { Editor } from "@graphite/editor";
import type { IconName } from "@graphite/icons";
import { patchLayout } from "@graphite/utility-functions/widgets";
export type DialogStore = ReturnType<typeof createDialogStore>;
type DialogStoreState = {
visible: boolean;
title: string;
@@ -27,13 +29,16 @@ const initialState: DialogStoreState = {
panicDetails: "",
};
let editorRef: Editor | undefined = undefined;
// Store state persisted across HMR to maintain reactive subscriptions in the component tree
const store: Writable<DialogStoreState> = import.meta.hot?.data?.store || writable<DialogStoreState>(initialState);
if (import.meta.hot) import.meta.hot.data.store = store;
const { subscribe, update } = store;
export function createDialogStore(editor: Editor) {
// Subscribe to process backend events
editorRef = editor;
editor.subscriptions.subscribeFrontendMessage("DisplayDialog", (data) => {
update((state) => {
state.visible = true;
@@ -71,6 +76,7 @@ export function createDialogStore(editor: Editor) {
return state;
});
});
editor.subscriptions.subscribeFrontendMessage("DialogClose", () => {
update((state) => {
// Disallow dismissing the crash dialog since it should remain as the final notification
@@ -94,23 +100,20 @@ export function createDialogStore(editor: Editor) {
editor.handle.requestLicensesThirdPartyDialogWithLicenseText(licenseText);
});
function destroy() {
editor.subscriptions.unsubscribeFrontendMessage("DisplayDialog");
editor.subscriptions.unsubscribeFrontendMessage("DialogClose");
editor.subscriptions.unsubscribeFrontendMessage("TriggerDisplayThirdPartyLicensesDialog");
editor.subscriptions.unsubscribeLayoutUpdate("DialogButtons");
editor.subscriptions.unsubscribeLayoutUpdate("DialogColumn1");
editor.subscriptions.unsubscribeLayoutUpdate("DialogColumn2");
}
return { subscribe };
}
currentCleanup = destroy;
currentArgs = [editor];
return {
subscribe,
destroy,
};
export function destroyDialogStore() {
const editor = editorRef;
if (!editor) return;
editor.subscriptions.unsubscribeFrontendMessage("DisplayDialog");
editor.subscriptions.unsubscribeFrontendMessage("DialogClose");
editor.subscriptions.unsubscribeFrontendMessage("TriggerDisplayThirdPartyLicensesDialog");
editor.subscriptions.unsubscribeLayoutUpdate("DialogButtons");
editor.subscriptions.unsubscribeLayoutUpdate("DialogColumn1");
editor.subscriptions.unsubscribeLayoutUpdate("DialogColumn2");
}
export type DialogStore = ReturnType<typeof createDialogStore>;
// Creates a crash dialog from JS once the editor has panicked.
// Normal dialogs are created in the Rust backend, but for the crash dialog, the editor has panicked so it cannot respond to widget callbacks.
@@ -129,11 +132,3 @@ export function createCrashDialog(panicDetails: string) {
return state;
});
}
// Self-accepting HMR: tear down the old instance and re-create with the new module's code
let currentCleanup: (() => void) | undefined;
let currentArgs: [Editor] | undefined;
import.meta.hot?.accept((newModule) => {
currentCleanup?.();
if (currentArgs) newModule?.createDialogStore(...currentArgs);
});