From 391fcb28b3ac9190b058d0249d3c739c37b582ec Mon Sep 17 00:00:00 2001 From: Michael Gartner Date: Wed, 27 Aug 2025 00:07:40 -0600 Subject: [PATCH] Enhance Tldraw component to track last actions in history - Added lastActions state to DiscourseContextType for tracking recent changes. - Implemented a mechanism to push new actions to lastActions on app change events, maintaining a maximum of 10 entries. - Updated error handling to include lastActions context for better debugging. --- apps/roam/src/components/canvas/Tldraw.tsx | 14 ++++++++++++++ 1 file changed, 14 insertions(+) diff --git a/apps/roam/src/components/canvas/Tldraw.tsx b/apps/roam/src/components/canvas/Tldraw.tsx index 5413fb186..90f7784ef 100644 --- a/apps/roam/src/components/canvas/Tldraw.tsx +++ b/apps/roam/src/components/canvas/Tldraw.tsx @@ -88,6 +88,8 @@ import { TLDRAW_DATA_ATTRIBUTE } from "./tldrawStyles"; import { AUTO_CANVAS_RELATIONS_KEY } from "~/data/userSettings"; import { getSetting } from "~/utils/extensionSettings"; import { isPluginTimerReady, waitForPluginTimer } from "~/utils/pluginTimer"; +import { HistoryEntry } from "@tldraw/store"; +import { TLRecord } from "@tldraw/tlschema"; declare global { interface Window { @@ -100,12 +102,14 @@ export type DiscourseContextType = { // { [Relation.Label] => DiscourseRelation[] } relations: Record; lastAppEvent: string; + lastActions: HistoryEntry[]; }; export const discourseContext: DiscourseContextType = { nodes: {}, relations: {}, lastAppEvent: "", + lastActions: [], }; const DEFAULT_WIDTH = 160; @@ -121,6 +125,9 @@ const TldrawCanvas = ({ title }: { title: string }) => { const appRef = useRef(null); const lastInsertRef = useRef(); const containerRef = useRef(null); + const lastActionsRef = useRef[]>( + discourseContext.lastActions, + ); const [maximized, setMaximized] = useState(false); const [isConvertToDialogOpen, setConvertToDialogOpen] = useState(false); @@ -499,6 +506,7 @@ const TldrawCanvas = ({ title }: { title: string }) => { type: "Tldraw Error", context: { title: title, + lastActions: lastActionsRef.current, }, }).catch(() => {}); @@ -600,6 +608,12 @@ const TldrawCanvas = ({ title }: { title: string }) => { appRef.current = app; + app.on("change", (entry) => { + lastActionsRef.current.push(entry); + if (lastActionsRef.current.length > 10) + lastActionsRef.current.shift(); + }); + app.on("event", (event) => { const e = event as TLPointerEventInfo;