mirror of
https://github.com/Comfy-Org/ComfyUI_frontend.git
synced 2026-02-24 08:44:06 +00:00
refactor node help watch source (#7660)
Extract the node help watch source into a computed value. ## What changed - Move the watch predicate in `NodeHelpPage.vue` into a named `activeHelpDef` computed and pass it to `whenever` - Keep behavior identical while making the watch source easier to read and reference ## Why - Motivation: a review comment requested separating the predicate from the watcher for readability and idiomatic usage - Why this approach: a local computed is the smallest change that preserves behavior and matches the requested structure - Tradeoffs / limitations: adds a couple of lines and a computed without changing runtime behavior ## Evidence - Tests: Not run (existing unit tests for help sync live in `tests-ui/tests/components/sidebar/nodeLibrary/NodeHelpPage.test.ts`) ## References - Review comment: https://github.com/Comfy-Org/ComfyUI_frontend/pull/7105#discussion_r2636631268 (request to extract the watcher predicate into a computed) - Related PR: https://github.com/Comfy-Org/ComfyUI_frontend/pull/7105 (original help sync change) --------- Co-authored-by: Christian Byrne <cbyrne@comfy.org>
This commit is contained in:
@@ -21,6 +21,7 @@
|
||||
<script setup lang="ts">
|
||||
import { whenever } from '@vueuse/core'
|
||||
import Button from 'primevue/button'
|
||||
import { computed } from 'vue'
|
||||
|
||||
import NodeHelpContent from '@/components/node/NodeHelpContent.vue'
|
||||
import { useSelectionState } from '@/composables/graph/useSelectionState'
|
||||
@@ -36,14 +37,14 @@ defineEmits<{
|
||||
const nodeHelpStore = useNodeHelpStore()
|
||||
const { nodeDef } = useSelectionState()
|
||||
|
||||
// Keep the open help page synced with the current selection while help is open.
|
||||
whenever(
|
||||
() => (nodeHelpStore.isHelpOpen ? nodeDef.value : null),
|
||||
(def) => {
|
||||
if (!def) return
|
||||
const currentHelpNode = nodeHelpStore.currentHelpNode
|
||||
if (currentHelpNode?.nodePath === def.nodePath) return
|
||||
nodeHelpStore.openHelp(def)
|
||||
}
|
||||
const activeHelpDef = computed(() =>
|
||||
nodeHelpStore.isHelpOpen ? nodeDef.value : null
|
||||
)
|
||||
|
||||
// Keep the open help page synced with the current selection while help is open.
|
||||
whenever(activeHelpDef, (def) => {
|
||||
const currentHelpNode = nodeHelpStore.currentHelpNode
|
||||
if (currentHelpNode?.nodePath === def.nodePath) return
|
||||
nodeHelpStore.openHelp(def)
|
||||
})
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user