From 8eff364dcd269c01bd5e559d8d94bbcdb9c5182b Mon Sep 17 00:00:00 2001
From: Danila Poyarkov <dev@dannote.net>
Date: Sun, 1 Mar 2026 00:33:14 +0300
Subject: [PATCH] Use sceneVersion instead of renderVersion for UI panels
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

renderVersion bumps on every pan/zoom/hover — it's the canvas redraw signal.
sceneVersion only bumps when the scene graph actually changes.

Panels (properties, layers, context menu, pages, export preview) now
depend on sceneVersion, so they don't re-render during navigation.
---
 src/components/CanvasContextMenu.vue | 14 +++++++-------
 src/components/LayersPanel.vue       |  2 +-
 src/components/PagesPanel.vue        |  2 +-
 src/stores/editor.ts                 |  4 ++--
 4 files changed, 11 insertions(+), 11 deletions(-)

diff --git a/src/components/CanvasContextMenu.vue b/src/components/CanvasContextMenu.vue
index f3d13d056..dc012cedc 100644
--- a/src/components/CanvasContextMenu.vue
+++ b/src/components/CanvasContextMenu.vue
@@ -17,19 +17,19 @@ import { useEditorStore } from '@/stores/editor'
 const store = useEditorStore()
 
 const hasSelection = computed(() => {
-  void store.state.renderVersion
+  void store.state.sceneVersion
   return store.state.selectedIds.size > 0
 })
 
 const singleNode = computed(() => {
-  void store.state.renderVersion
+  void store.state.sceneVersion
   if (store.state.selectedIds.size !== 1) return null
   const id = [...store.state.selectedIds][0]
   return store.graph.getNode(id) ?? null
 })
 
 const multiCount = computed(() => {
-  void store.state.renderVersion
+  void store.state.sceneVersion
   return store.state.selectedIds.size
 })
 
@@ -38,7 +38,7 @@ const isComponent = computed(() => singleNode.value?.type === 'COMPONENT')
 const isGroup = computed(() => singleNode.value?.type === 'GROUP')
 
 const canCreateComponentSet = computed(() => {
-  void store.state.renderVersion
+  void store.state.sceneVersion
   if (store.state.selectedIds.size < 2) return false
   return [...store.state.selectedIds].every((id) => {
     const n = store.graph.getNode(id)
@@ -47,18 +47,18 @@ const canCreateComponentSet = computed(() => {
 })
 
 const otherPages = computed(() => {
-  void store.state.renderVersion
+  void store.state.sceneVersion
   return store.graph.getPages().filter((p) => p.id !== store.state.currentPageId)
 })
 
 const isVisible = computed(() => {
-  void store.state.renderVersion
+  void store.state.sceneVersion
   if (!singleNode.value) return true
   return singleNode.value.visible
 })
 
 const isLocked = computed(() => {
-  void store.state.renderVersion
+  void store.state.sceneVersion
   if (!singleNode.value) return false
   return singleNode.value.locked
 })
diff --git a/src/components/LayersPanel.vue b/src/components/LayersPanel.vue
index b30997ef3..0086779a8 100644
--- a/src/components/LayersPanel.vue
+++ b/src/components/LayersPanel.vue
@@ -62,7 +62,7 @@ function buildTree(parentId: string): LayerNode[] {
 const items = ref(buildTree(store.state.currentPageId))
 const treeKey = ref(0)
 
-watch([() => store.state.renderVersion, () => store.state.currentPageId], () => {
+watch([() => store.state.sceneVersion, () => store.state.currentPageId], () => {
   items.value = buildTree(store.state.currentPageId)
   treeKey.value++
 })
diff --git a/src/components/PagesPanel.vue b/src/components/PagesPanel.vue
index a82ea2bbe..be7d7e985 100644
--- a/src/components/PagesPanel.vue
+++ b/src/components/PagesPanel.vue
@@ -6,7 +6,7 @@ import { useEditorStore } from '@/stores/editor'
 const store = useEditorStore()
 
 const pages = computed(() => {
-  void store.state.renderVersion
+  void store.state.sceneVersion
   return store.graph.getPages()
 })
 
diff --git a/src/stores/editor.ts b/src/stores/editor.ts
index 9d1d061f8..abf9aa297 100644
--- a/src/stores/editor.ts
+++ b/src/stores/editor.ts
@@ -156,7 +156,7 @@ export function createEditorStore() {
   })
 
   const selectedNodes = computed(() => {
-    void state.renderVersion
+    void state.sceneVersion
     const nodes: SceneNode[] = []
     for (const id of state.selectedIds) {
       const n = graph.getNode(id)
@@ -170,7 +170,7 @@ export function createEditorStore() {
   )
 
   const layerTree = computed(() => {
-    void state.renderVersion
+    void state.sceneVersion
     return graph.flattenTree(state.currentPageId)
   })