Story 3 verplaatst alle UI-consumers van de oude vier stores
(useBacklogStore/usePlannerStore/useSelectionStore/useProductStore) naar de
nieuwe product-workspace-store. De oude stores blijven nog bestaan voor
hydration-wrapper en realtime-hook (dual-dispatch); Story 8 ruimt ze op.
- T-848 backlog-split-pane.tsx: leest activePbiId/activeStoryId uit
context-slice (primitives, geen useShallow nodig).
- T-849 pbi-list.tsx: selectVisiblePbis(useShallow); DnD via
applyOptimisticMutation('pbi-order' + optionele 'entity-patch' bij
cross-priority drag), met settle/rollback per server-result.
- T-850 story-panel.tsx: selectStoriesForActivePbi(useShallow); DnD via
applyOptimisticMutation('story-order' + entity-patch bij priority change).
- T-851 task-panel.tsx: selectTasksForActiveStory(useShallow); DnD via
applyOptimisticMutation('task-order'); detail-view (ensureTaskLoaded +
isDetail) zit in de task-dialog (apart component, niet in deze lijst).
- T-852 start-sprint-button.tsx: selectActivePbi + selectStoriesForActivePbi
voor free-story count.
- T-853 set-current-product.tsx: alleen workspace-store.setActiveProduct
(oude useProductStore-import verwijderd).
- T-854 G1/G2-audit: alle nieuwe selectors gebruiken module-level EMPTY
refs (G1) en useShallow voor lijsten (G2). Geen 'Maximum update depth'-
warnings tijdens npm test.
- T-855 tests bijgewerkt: backlog-split-pane.test, task-panel.test,
integration.test gebruiken nu setState op workspace-store (helpers
resetWorkspace/setActiveStoryAndTasks/selectPbi/selectStory).
Verify: lint+typecheck clean, 636/636 tests groen. UI-consumers van
oude stores zijn nu nul (uitgezonderd dual-dispatch in hydration-wrapper en
realtime-hook + dev-fingerprint-helper, die in Story 8/T-873/T-878 verdwijnen).
Refs: PBI-74, ST-1320, T-848..T-855
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
92 lines
2.6 KiB
TypeScript
92 lines
2.6 KiB
TypeScript
// @vitest-environment jsdom
|
|
import { describe, it, expect, beforeEach } from 'vitest'
|
|
import { render, screen } from '@testing-library/react'
|
|
import { useProductWorkspaceStore } from '@/stores/product-workspace/store'
|
|
import { BacklogSplitPane } from '@/components/backlog/backlog-split-pane'
|
|
|
|
function setSelection(pbiId: string | null, storyId: string | null) {
|
|
useProductWorkspaceStore.setState((s) => {
|
|
s.context.activePbiId = pbiId
|
|
s.context.activeStoryId = storyId
|
|
})
|
|
}
|
|
|
|
const PANES = [
|
|
<div key="a">PBI pane</div>,
|
|
<div key="b">Stories pane</div>,
|
|
<div key="c">Tasks pane</div>,
|
|
]
|
|
|
|
function renderPane() {
|
|
return render(
|
|
<BacklogSplitPane
|
|
panes={PANES}
|
|
defaultSplit={[33, 33, 34]}
|
|
cookieKey="test-backlog"
|
|
tabLabels={["PBI's", 'Stories', 'Taken']}
|
|
/>
|
|
)
|
|
}
|
|
|
|
beforeEach(() => {
|
|
setSelection(null, null)
|
|
// Force mobile viewport
|
|
Object.defineProperty(window, 'innerWidth', { writable: true, configurable: true, value: 600 })
|
|
window.dispatchEvent(new Event('resize'))
|
|
})
|
|
|
|
describe('BacklogSplitPane auto-switch', () => {
|
|
it('starts on tab 0 with no selection', () => {
|
|
renderPane()
|
|
expect(screen.getByText('PBI pane')).toBeTruthy()
|
|
expect(screen.queryByText('Stories pane')).toBeNull()
|
|
})
|
|
|
|
it('auto-switches to tab 1 when PBI is selected', () => {
|
|
const { rerender } = renderPane()
|
|
setSelection('pbi-1', null)
|
|
rerender(
|
|
<BacklogSplitPane
|
|
panes={PANES}
|
|
defaultSplit={[33, 33, 34]}
|
|
cookieKey="test-backlog"
|
|
tabLabels={["PBI's", 'Stories', 'Taken']}
|
|
/>
|
|
)
|
|
expect(screen.getByText('Stories pane')).toBeTruthy()
|
|
expect(screen.queryByText('PBI pane')).toBeNull()
|
|
})
|
|
|
|
it('auto-switches to tab 2 when story is selected', () => {
|
|
const { rerender } = renderPane()
|
|
setSelection('pbi-1', 'story-1')
|
|
rerender(
|
|
<BacklogSplitPane
|
|
panes={PANES}
|
|
defaultSplit={[33, 33, 34]}
|
|
cookieKey="test-backlog"
|
|
tabLabels={["PBI's", 'Stories', 'Taken']}
|
|
/>
|
|
)
|
|
expect(screen.getByText('Tasks pane')).toBeTruthy()
|
|
expect(screen.queryByText('PBI pane')).toBeNull()
|
|
})
|
|
|
|
it('switches to tab 1 on cascade-reset (story cleared when new PBI selected)', () => {
|
|
// Start with story selected (tab 2)
|
|
setSelection('pbi-1', 'story-1')
|
|
const { rerender } = renderPane()
|
|
|
|
// Cascade-reset: new PBI → story clears
|
|
setSelection('pbi-2', null)
|
|
rerender(
|
|
<BacklogSplitPane
|
|
panes={PANES}
|
|
defaultSplit={[33, 33, 34]}
|
|
cookieKey="test-backlog"
|
|
tabLabels={["PBI's", 'Stories', 'Taken']}
|
|
/>
|
|
)
|
|
expect(screen.getByText('Stories pane')).toBeTruthy()
|
|
})
|
|
})
|