fix(liveview): apply collapse filter in read-only canvas
LiveView.tsx passed raw nodes/edges from the store straight to ReactFlow, bypassing the collapse pipeline that CanvasContainer applies in the editor. Result: a group or zone marked collapsed in edit mode still showed all its contents on /view?key=... and in standalone live view. The flag was being persisted and read correctly — only the read-only canvas ignored it. Reuse the same memoized computeCollapseInfo + rewireEdgesForCollapse pipeline. Add two regression tests that load a /liveview payload with a collapsed group and assert the children never reach ReactFlow.
This commit is contained in:
@@ -0,0 +1,43 @@
|
||||
import { describe, it, expect } from 'vitest'
|
||||
import { renderHook, act } from '@testing-library/react'
|
||||
import { useCanvasStore } from '../../stores/canvasStore'
|
||||
import { computeCollapseInfo } from '../collapseFilter'
|
||||
import type { Node } from '@xyflow/react'
|
||||
import type { NodeData } from '@/types'
|
||||
|
||||
const mk = (id: string, type: NodeData['type'] = 'server'): Node<NodeData> => ({
|
||||
id,
|
||||
type,
|
||||
position: { x: 100, y: 100 },
|
||||
data: { label: id, type, status: 'online', services: [] },
|
||||
})
|
||||
|
||||
describe('integration — createGroup + toggleNodeCollapsed hides children', () => {
|
||||
it('hides parentId children of a collapsed group container', () => {
|
||||
const { result } = renderHook(() => useCanvasStore())
|
||||
act(() => {
|
||||
result.current.addNode(mk('c1'))
|
||||
result.current.addNode(mk('c2'))
|
||||
result.current.createGroup(['c1', 'c2'], 'My Group')
|
||||
})
|
||||
// Find the auto-generated group id.
|
||||
const grp = result.current.nodes.find((n) => n.type === 'group')!
|
||||
expect(grp).toBeDefined()
|
||||
expect(result.current.nodes.find((n) => n.id === 'c1')!.parentId).toBe(grp.id)
|
||||
|
||||
// Pre-collapse: all visible.
|
||||
let info = computeCollapseInfo(result.current.nodes)
|
||||
expect(info.visibleIds.has('c1')).toBe(true)
|
||||
expect(info.visibleIds.has('c2')).toBe(true)
|
||||
|
||||
// Collapse the group via the store action.
|
||||
act(() => result.current.toggleNodeCollapsed(grp.id))
|
||||
expect(result.current.nodes.find((n) => n.id === grp.id)!.data.collapsed).toBe(true)
|
||||
|
||||
info = computeCollapseInfo(result.current.nodes)
|
||||
expect(info.visibleIds.has(grp.id)).toBe(true)
|
||||
expect(info.visibleIds.has('c1')).toBe(false)
|
||||
expect(info.visibleIds.has('c2')).toBe(false)
|
||||
expect(info.hiddenBy.get('c1')).toBe(grp.id)
|
||||
})
|
||||
})
|
||||
Reference in New Issue
Block a user