From 5547c3fc2b350a3db7ec8ced32fec2f2f79e0da5 Mon Sep 17 00:00:00 2001
From: Elian Doran <contact@eliandoran.me>
Date: Thu, 25 Sep 2025 19:28:03 +0300
Subject: [PATCH] feat(canvas): read-only mode

---
 apps/client/src/widgets/FloatingButtonsDefinitions.tsx | 2 +-
 apps/client/src/widgets/type_widgets/Canvas.tsx        | 6 +++---
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/apps/client/src/widgets/FloatingButtonsDefinitions.tsx b/apps/client/src/widgets/FloatingButtonsDefinitions.tsx
index 0c4f3243f..991e982f7 100644
--- a/apps/client/src/widgets/FloatingButtonsDefinitions.tsx
+++ b/apps/client/src/widgets/FloatingButtonsDefinitions.tsx
@@ -91,7 +91,7 @@ function SwitchSplitOrientationButton({ note, isReadOnly, isDefaultViewMode }: F
 
 function ToggleReadOnlyButton({ note, viewType, isDefaultViewMode }: FloatingButtonContext) {
     const [ isReadOnly, setReadOnly ] = useNoteLabelBoolean(note, "readOnly");
-    const isEnabled = ([ "mermaid", "mindMap" ].includes(note.type) || viewType === "geoMap")
+    const isEnabled = ([ "mermaid", "mindMap", "canvas" ].includes(note.type) || viewType === "geoMap")
             && note.isContentAvailable() && isDefaultViewMode;
 
     return isEnabled && <FloatingButton
diff --git a/apps/client/src/widgets/type_widgets/Canvas.tsx b/apps/client/src/widgets/type_widgets/Canvas.tsx
index 1cf83cb53..90b381e10 100644
--- a/apps/client/src/widgets/type_widgets/Canvas.tsx
+++ b/apps/client/src/widgets/type_widgets/Canvas.tsx
@@ -1,7 +1,7 @@
 import { Excalidraw, exportToSvg, getSceneVersion } from "@excalidraw/excalidraw";
 import { TypeWidgetProps } from "./type_widget";
 import "@excalidraw/excalidraw/index.css";
-import { useEditorSpacedUpdate } from "../react/hooks";
+import { useEditorSpacedUpdate, useNoteLabelBoolean } from "../react/hooks";
 import { useCallback, useMemo, useRef } from "preact/hooks";
 import { type ExcalidrawImperativeAPI, type AppState, type BinaryFileData, LibraryItem, ExcalidrawProps } from "@excalidraw/excalidraw/types";
 import options from "../../services/options";
@@ -29,7 +29,7 @@ interface CanvasContent {
 
 export default function Canvas({ note }: TypeWidgetProps) {
     const apiRef = useRef<ExcalidrawImperativeAPI>(null);
-    const isReadOnly = options.is("databaseReadonly");
+    const [ isReadOnly ] = useNoteLabelBoolean(note, "readOnly");
     const themeStyle = useMemo(() => {
         const documentStyle = window.getComputedStyle(document.documentElement);
         return documentStyle.getPropertyValue("--theme-style")?.trim() as AppState["theme"];
@@ -66,7 +66,7 @@ export default function Canvas({ note }: TypeWidgetProps) {
                     <Excalidraw
                         excalidrawAPI={api => apiRef.current = api}
                         theme={themeStyle}
-                        viewModeEnabled={isReadOnly}
+                        viewModeEnabled={isReadOnly || options.is("databaseReadonly")}
                         zenModeEnabled={false}
                         isCollaborating={false}
                         detectScroll={false}