fix: improve graph view interactions

Author: tiensonqin

docs/agent-guide/graph-view/001-graph-view.md

@@ -22,8 +22,7 @@
    (:width opts)
    (:height opts)
    (:aria-label opts)
-   (:grid-layout? opts)
-   (:visible-recent-task-count opts)])
+   (:grid-layout? opts)])
 
 (defn- schedule-render-container!
   [container opts]
@@ -55,6 +54,7 @@
         on-node-activate-ref (hooks/use-ref nil)
         on-node-preview-ref (hooks/use-ref nil)
         on-selection-change-ref (hooks/use-ref nil)
+        on-focus-change-ref (hooks/use-ref nil)
         on-rendered-ref (hooks/use-ref nil)
         incremental-update-ready? (fn [container]
                                     (and container
@@ -68,13 +68,17 @@
         change-selection! (fn [nodes]
                             (when-let [handler (hooks/deref on-selection-change-ref)]
                               (handler nodes)))
+        change-focus! (fn [node]
+                        (when-let [handler (hooks/deref on-focus-change-ref)]
+                          (handler node)))
         rendered! (fn [render-info]
                     (hooks/set-ref! render-pending-ref false)
                     (when-let [handler (hooks/deref on-rendered-ref)]
                       (handler render-info)))]
     (hooks/set-ref! on-node-activate-ref (:on-node-activate opts))
     (hooks/set-ref! on-node-preview-ref (:on-node-preview opts))
     (hooks/set-ref! on-selection-change-ref (:on-selection-change opts))
+    (hooks/set-ref! on-focus-change-ref (:on-focus-change opts))
     (hooks/set-ref! on-rendered-ref (:on-rendered opts))
     (hooks/use-effect!
      (fn []
@@ -87,6 +91,7 @@
                    :on-node-activate activate-node!
                    :on-node-preview preview-node!
                    :on-selection-change change-selection!
+                   :on-focus-change change-focus!
                    :on-rendered rendered!)))))
      (render-container-deps opts))
     (hooks/use-effect!
@@ -123,6 +128,12 @@
                                       (:show-arrows? opts)
                                       (:show-edge-labels? opts)))))
      [(:show-arrows? opts) (:show-edge-labels? opts)])
+    (hooks/use-effect!
+     (fn []
+       (when-let [container (hooks/deref container-ref)]
+         (when (incremental-update-ready? container)
+           (pixi/reset-interaction! container))))
+     [(:reset-token opts)])
     [:div.graph-canvas
      {:ref container-ref
       :style (canvas-style opts)

src/main/frontend/common/graph_view.cljs

@@ -66,11 +66,13 @@
     background: color-mix(in srgb, var(--ls-link-text-color) 16%, transparent);
 }
 
-.graph-settings-toggle {
+.graph-settings-toggle,
+.graph-interaction-reset {
     width: 46px;
     height: 46px;
     min-width: 46px;
     min-height: 46px;
+    max-height: 46px;
     border: 1px solid color-mix(in srgb, var(--ls-link-text-color) 18%, var(--ls-border-color));
     background: color-mix(in srgb, var(--ls-primary-background-color) 82%, transparent);
     box-shadow: 0 12px 34px rgba(15, 23, 42, 0.16);