Refactor: Further state management cleanup (#5727)

## Summary

Going through the GraphNodeManager and VueNodeLifecycle one property at
a time and removing the pieces that are not currently wired up or used
by the rest of the application

Fixes paste location by updating the layoutStore in LGraphCanvas (which
already mutates layoutStore elsewhere)

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5727-WIP-Refactor-Further-state-management-cleanup-2766d73d36508173b379c6009c194a5a)
by [Unito](https://www.unito.io)
This commit is contained in:
Alexander Brown
2025-09-22 18:47:26 -07:00
committed by GitHub
parent d01081dab4
commit 1611c7a224
6 changed files with 17 additions and 277 deletions

View File

@@ -1,20 +1,9 @@
/**
* Vue Node Lifecycle Management Composable
*
* Handles the complete lifecycle of Vue node rendering system including:
* - Node manager initialization and cleanup
* - Layout store synchronization
* - Slot and link sync management
* - Reactive state management for node data, positions, and sizes
* - Memory management and proper cleanup
*/
import { createSharedComposable } from '@vueuse/core'
import { computed, readonly, ref, shallowRef, watch } from 'vue'
import { readonly, ref, shallowRef, watch } from 'vue'
import { useGraphNodeManager } from '@/composables/graph/useGraphNodeManager'
import type {
GraphNodeManager,
NodeState,
VueNodeData
} from '@/composables/graph/useGraphNodeManager'
import { useVueFeatureFlags } from '@/composables/useVueFeatureFlags'
@@ -42,13 +31,10 @@ function useVueNodeLifecycleIndividual() {
// Vue node data state
const vueNodeData = ref<ReadonlyMap<string, VueNodeData>>(new Map())
const nodeState = ref<ReadonlyMap<string, NodeState>>(new Map())
// Trigger for forcing computed re-evaluation
const nodeDataTrigger = ref(0)
const isNodeManagerReady = computed(() => nodeManager.value !== null)
const initializeNodeManager = () => {
// Use canvas graph if available (handles subgraph contexts), fallback to app graph
const activeGraph = comfyApp.canvas?.graph || comfyApp.graph
@@ -61,7 +47,6 @@ function useVueNodeLifecycleIndividual() {
// Use the manager's data maps
vueNodeData.value = manager.vueNodeData
nodeState.value = manager.nodeState
// Initialize layout system with existing nodes from active graph
const nodes = activeGraph._nodes.map((node: LGraphNode) => ({
@@ -124,7 +109,6 @@ function useVueNodeLifecycleIndividual() {
// Reset reactive maps to clean state
vueNodeData.value = new Map()
nodeState.value = new Map()
}
// Watch for Vue nodes enabled state changes
@@ -218,10 +202,7 @@ function useVueNodeLifecycleIndividual() {
return {
vueNodeData,
nodeState,
nodeDataTrigger: readonly(nodeDataTrigger),
nodeManager: readonly(nodeManager),
isNodeManagerReady,
// Lifecycle methods
initializeNodeManager,