diff --git a/src/tools/MarkdownTool.ts b/src/tools/MarkdownTool.ts index 30c28fb..f1dde07 100644 --- a/src/tools/MarkdownTool.ts +++ b/src/tools/MarkdownTool.ts @@ -1,7 +1,7 @@ import { BaseBoxShapeTool } from "tldraw" export class MarkdownTool extends BaseBoxShapeTool { - static override id = "MarkdownTool" - shapeType = "MarkdownTool" + static override id = "Markdown" + shapeType = "Markdown" override initial = "idle" } diff --git a/src/ui/CustomContextMenu.tsx b/src/ui/CustomContextMenu.tsx index fc94d41..5294b84 100644 --- a/src/ui/CustomContextMenu.tsx +++ b/src/ui/CustomContextMenu.tsx @@ -10,24 +10,32 @@ import { revertCamera, zoomToSelection, } from "./cameraUtils" +import { useState, useEffect } from "react" export function CustomContextMenu(props: TLUiContextMenuProps) { const editor = useEditor() - const selectedShapes = editor.getSelectedShapes() - const selectedIds = editor.getSelectedShapeIds() + const [selectedShapes, setSelectedShapes] = useState([]) + const [selectedIds, setSelectedIds] = useState([]) - // Add debug logs - console.log( - "Selected Shapes:", - selectedShapes.map((shape) => ({ - id: shape.id, - type: shape.type, - })), - ) - console.log( - "Selected Frame:", - selectedShapes.length === 1 && selectedShapes[0].type === "frame", - ) + // Update selection state more frequently + useEffect(() => { + const updateSelection = () => { + setSelectedShapes(editor.getSelectedShapes()) + setSelectedIds(editor.getSelectedShapeIds()) + } + + // Initial update + updateSelection() + + // Subscribe to selection changes + const unsubscribe = editor.addListener("change", updateSelection) + + return () => { + if (typeof unsubscribe === "function") { + ;(unsubscribe as () => void)() + } + } + }, [editor]) const hasSelection = selectedIds.length > 0 const hasCameraHistory = cameraHistory.length > 0 diff --git a/worker/TldrawDurableObject.ts b/worker/TldrawDurableObject.ts index c225029..172a0b3 100644 --- a/worker/TldrawDurableObject.ts +++ b/worker/TldrawDurableObject.ts @@ -243,11 +243,20 @@ export class TldrawDurableObject { server.accept() - // Add error handling + // Add error handling and reconnection logic server.addEventListener("error", (err) => { console.error("WebSocket error:", err) }) + server.addEventListener("close", () => { + if (this.roomPromise) { + this.getRoom().then((room) => { + // Update store to ensure all changes are persisted + room.updateStore(() => {}) + }) + } + }) + return new Response(null, { status: 101, webSocket: client,