Analysis/_bmad-output/implementation-artifacts/2-2-undo-redo-des-modifications.md

Story 2.2: Undo/Redo des Modifications

Status: review

Story

As a Julien (Analyst), I want to undo my last data edits, so that I can explore changes without fear of losing the original data.

Acceptance Criteria

1. Undo History: The system tracks changes to cell values.
2. Undo Action: Users can press Ctrl+Z or click an "Undo" button to revert the last edit.
3. Redo Action: Users can press Ctrl+Y (or Ctrl+Shift+Z) to re-apply an undone edit.
4. Visual Indicator: The Undo/Redo buttons in the toolbar are disabled if no history is available.
5. Session Scope: History is maintained during the current session (stateless).

Tasks / Subtasks

• State Management (Zustand) (AC: 1, 2, 3)
  • Implement zundo or a custom middleware for state history in useGridStore.
  • Add undo and redo actions.
• Keyboard Shortcuts (AC: 2, 3)
  • Add global event listeners for Ctrl+Z and Ctrl+Y.
• UI Controls (AC: 4)
  • Add Undo/Redo buttons to the FileUploader or a new Toolbar component.

Dev Notes

• Optimization: Using zundo middleware to partialize state history (tracking only data, columns, and modifiedCells).
• Shortcuts: Implemented global keyboard event listeners in the main layout.
• UX: Added responsive toolbar buttons with disabled states when no history is present.

Project Structure Notes

• Modified frontend/src/store/use-grid-store.ts to include temporal middleware.
• Updated frontend/src/app/page.tsx with UI buttons and shortcut logic.

References

• [Source: functional-requirements.md#FR8]
• [Source: project-context.md#Data & State Architecture]

Dev Agent Record

Agent Model Used

{{agent_model_name_version}}

Completion Notes List

• Integrated zundo for comprehensive history tracking.
• Added Undo/Redo logic to the global Zustand store.
• Implemented Ctrl+Z, Ctrl+Shift+Z, and Ctrl+Y keyboard shortcuts.
• Added visual buttons in the application header with state-dependent enabling/disabling.

File List

• /frontend/src/store/use-grid-store.ts
• /frontend/src/app/page.tsx