From f0d30c4e34e3842107e101f44e95bf52a74bd0d0 Mon Sep 17 00:00:00 2001
From: Elian Doran <contact@eliandoran.me>
Date: Tue, 12 Aug 2025 21:31:04 +0300
Subject: [PATCH] fix(canvas): links not working on desktop (fixes #6606)

---
 .../src/widgets/type_widgets/canvas_el.tsx    | 44 ++++++++++++++-----
 1 file changed, 33 insertions(+), 11 deletions(-)

diff --git a/apps/client/src/widgets/type_widgets/canvas_el.tsx b/apps/client/src/widgets/type_widgets/canvas_el.tsx
index 4daac42b3..a6f1ee16f 100644
--- a/apps/client/src/widgets/type_widgets/canvas_el.tsx
+++ b/apps/client/src/widgets/type_widgets/canvas_el.tsx
@@ -2,6 +2,8 @@ import "@excalidraw/excalidraw/index.css";
 import { Excalidraw, getSceneVersion, exportToSvg } from "@excalidraw/excalidraw";
 import { AppState, BinaryFileData, ExcalidrawImperativeAPI, ExcalidrawProps, LibraryItem } from "@excalidraw/excalidraw/types";
 import { ExcalidrawElement, NonDeletedExcalidrawElement, Theme } from "@excalidraw/excalidraw/element/types";
+import { useCallback } from "preact/hooks";
+import linkService from "../../services/link.js";
 
 export interface CanvasContent {
     elements: ExcalidrawElement[];
@@ -32,17 +34,13 @@ export default class Canvas {
     }
 
     createCanvasElement() {
-        return (
-            <div className="excalidraw-wrapper">
-                <Excalidraw
-                    {...this.opts}
-                    excalidrawAPI={api => {
-                        this.excalidrawApi = api;
-                        this.initializedPromise.resolve();
-                    }}
-                />
-            </div>
-        );
+        return <CanvasElement
+            {...this.opts}
+            excalidrawAPI={api => {
+                this.excalidrawApi = api;
+                this.initializedPromise.resolve();
+            }}
+        />
     }
 
     /**
@@ -173,3 +171,27 @@ export default class Canvas {
     }
 
 }
+
+function CanvasElement(opts: ExcalidrawProps) {
+    return (
+        <div className="excalidraw-wrapper">
+            <Excalidraw
+                {...opts}
+                onLinkOpen={useCallback((element: NonDeletedExcalidrawElement, event: CustomEvent) => {
+                    let link = element.link;
+                    if (!link) {
+                        return false;
+                    }
+
+                    if (link.startsWith("root/")) {
+                        link = "#" + link;
+                    }
+
+                    const { nativeEvent } = event.detail;
+                    event.preventDefault();
+                    return linkService.goToLinkExt(nativeEvent, link, null);
+                }, [])}
+            />
+        </div>
+    );
+}
\ No newline at end of file