summaryrefslogtreecommitdiff
path: root/apps/web/src/editor/use-editor.ts
diff options
context:
space:
mode:
authorMaze Winther <mazewinther@gmail.com>2026-04-20 11:31:17 +0200
committerMaze Winther <mazewinther@gmail.com>2026-04-20 11:31:17 +0200
commit3e89d2998588f8e35c524e523ba2ee853f0f6475 (patch)
tree57221f96c1259b3b07e3ddf8c1adefc502b9d8eb /apps/web/src/editor/use-editor.ts
parent729d10592f4e802f91c555c309ff3ba4b119f843 (diff)
downloadopencut-3e89d2998588f8e35c524e523ba2ee853f0f6475.tar.gz
refactor: restructure files to their domains, new preview overlay system, and dep graph
Diffstat (limited to 'apps/web/src/editor/use-editor.ts')
-rw-r--r--apps/web/src/editor/use-editor.ts60
1 files changed, 60 insertions, 0 deletions
diff --git a/apps/web/src/editor/use-editor.ts b/apps/web/src/editor/use-editor.ts
new file mode 100644
index 00000000..ce48e036
--- /dev/null
+++ b/apps/web/src/editor/use-editor.ts
@@ -0,0 +1,60 @@
+import { useCallback, useMemo, useRef, useSyncExternalStore } from "react";
+import { EditorCore } from "@/core";
+
+function isShallowEqual(a: unknown, b: unknown): boolean {
+ if (Object.is(a, b)) return true;
+ if (!Array.isArray(a) || !Array.isArray(b)) return false;
+ if (a.length !== b.length) return false;
+ return a.every((item, i) => Object.is(item, b[i]));
+}
+
+const subscribeNone = () => () => {};
+
+export function useEditor(): EditorCore;
+export function useEditor<T>(selector: (editor: EditorCore) => T): T;
+export function useEditor<T>(
+ selector?: (editor: EditorCore) => T,
+): EditorCore | T {
+ const editor = useMemo(() => EditorCore.getInstance(), []);
+ const selectorRef = useRef(selector);
+ selectorRef.current = selector;
+
+ const snapshotCacheRef = useRef<unknown>(undefined);
+
+ const subscribeAll = useCallback(
+ (onChange: () => void) => {
+ const unsubscribers = [
+ editor.playback.subscribe(onChange),
+ editor.timeline.subscribe(onChange),
+ editor.scenes.subscribe(onChange),
+ editor.project.subscribe(onChange),
+ editor.media.subscribe(onChange),
+ editor.renderer.subscribe(onChange),
+ editor.selection.subscribe(onChange),
+ editor.clipboard.subscribe(onChange),
+ editor.diagnostics.subscribe(onChange),
+ ];
+ return () => {
+ unsubscribers.forEach((unsubscribe) => {
+ unsubscribe();
+ });
+ };
+ },
+ [editor],
+ );
+
+ const getSnapshot = useCallback(() => {
+ const next = selectorRef.current ? selectorRef.current(editor) : editor;
+ if (isShallowEqual(snapshotCacheRef.current, next)) {
+ return snapshotCacheRef.current;
+ }
+ snapshotCacheRef.current = next;
+ return next;
+ }, [editor]);
+
+ return useSyncExternalStore(
+ selector ? subscribeAll : subscribeNone,
+ getSnapshot,
+ getSnapshot,
+ ) as EditorCore | T;
+}