feat(canvas): read-only mode

This commit is contained in:
Elian Doran
2025-09-25 19:28:03 +03:00
parent 4381399978
commit 5547c3fc2b
2 changed files with 4 additions and 4 deletions

View File

@@ -91,7 +91,7 @@ function SwitchSplitOrientationButton({ note, isReadOnly, isDefaultViewMode }: F
function ToggleReadOnlyButton({ note, viewType, isDefaultViewMode }: FloatingButtonContext) { function ToggleReadOnlyButton({ note, viewType, isDefaultViewMode }: FloatingButtonContext) {
const [ isReadOnly, setReadOnly ] = useNoteLabelBoolean(note, "readOnly"); 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; && note.isContentAvailable() && isDefaultViewMode;
return isEnabled && <FloatingButton return isEnabled && <FloatingButton

View File

@@ -1,7 +1,7 @@
import { Excalidraw, exportToSvg, getSceneVersion } from "@excalidraw/excalidraw"; import { Excalidraw, exportToSvg, getSceneVersion } from "@excalidraw/excalidraw";
import { TypeWidgetProps } from "./type_widget"; import { TypeWidgetProps } from "./type_widget";
import "@excalidraw/excalidraw/index.css"; import "@excalidraw/excalidraw/index.css";
import { useEditorSpacedUpdate } from "../react/hooks"; import { useEditorSpacedUpdate, useNoteLabelBoolean } from "../react/hooks";
import { useCallback, useMemo, useRef } from "preact/hooks"; import { useCallback, useMemo, useRef } from "preact/hooks";
import { type ExcalidrawImperativeAPI, type AppState, type BinaryFileData, LibraryItem, ExcalidrawProps } from "@excalidraw/excalidraw/types"; import { type ExcalidrawImperativeAPI, type AppState, type BinaryFileData, LibraryItem, ExcalidrawProps } from "@excalidraw/excalidraw/types";
import options from "../../services/options"; import options from "../../services/options";
@@ -29,7 +29,7 @@ interface CanvasContent {
export default function Canvas({ note }: TypeWidgetProps) { export default function Canvas({ note }: TypeWidgetProps) {
const apiRef = useRef<ExcalidrawImperativeAPI>(null); const apiRef = useRef<ExcalidrawImperativeAPI>(null);
const isReadOnly = options.is("databaseReadonly"); const [ isReadOnly ] = useNoteLabelBoolean(note, "readOnly");
const themeStyle = useMemo(() => { const themeStyle = useMemo(() => {
const documentStyle = window.getComputedStyle(document.documentElement); const documentStyle = window.getComputedStyle(document.documentElement);
return documentStyle.getPropertyValue("--theme-style")?.trim() as AppState["theme"]; return documentStyle.getPropertyValue("--theme-style")?.trim() as AppState["theme"];
@@ -66,7 +66,7 @@ export default function Canvas({ note }: TypeWidgetProps) {
<Excalidraw <Excalidraw
excalidrawAPI={api => apiRef.current = api} excalidrawAPI={api => apiRef.current = api}
theme={themeStyle} theme={themeStyle}
viewModeEnabled={isReadOnly} viewModeEnabled={isReadOnly || options.is("databaseReadonly")}
zenModeEnabled={false} zenModeEnabled={false}
isCollaborating={false} isCollaborating={false}
detectScroll={false} detectScroll={false}