feat: Undo/Redo history for Design Mode

[Delqhi]

Problem

The Design Mode has an Apply button and a Reset button, but no Undo/Redo functionality. If a user applies a change and then regrets it, they must manually revert the CSS/Tailwind classes. There is no history of changes.

Goal

Implement a proper Command-History system for the Design Mode that supports:

1. Undo last change (⌘Z / Ctrl+Z)
2. Redo previously undone change (⌘ShiftZ / Ctrl+ShiftZ)
3. Persistent history across sessions (stored in .sin-webui/)
4. History items show description (e.g., "Changed div class to 'p-4'")

Acceptance Criteria

• Undo button in Design Panel inspector works
• Redo button in Design Panel inspector works
• Keyboard shortcuts (⌘Z / Ctrl+Z) work when Design Mode is active
• History is persisted across page reloads (JSONL file)
• Each history entry has: timestamp, action type, file path, old value, new value
• History stack is bounded (e.g., max 100 entries) to prevent unbounded growth
• Apply button pushes to history stack
• Reset button is replaced by Undo (or Reset becomes "Undo all changes")

Files to modify / create

New files

lib/workspace/design-history.ts           # Command pattern: history stack, undo/redo
app/api/workspace/design-history/route.ts # GET/POST/DELETE history entries

Files to modify

components/workspace/design-panel.tsx     # Wire Undo/Redo buttons to history API
components/workspace/workspace-header.tsx # Add keyboard shortcut listener (⌘Z)
public/design-mode-agent.js               # Report actions to parent for history tracking
app/api/workspace/design-edit/route.ts   # Push to history stack after successful apply

Technical Notes

• Use the Command Pattern: each action is an object with execute() and undo() methods
• Store history in .sin-webui/design-history.jsonl (append-only, bounded)
• History entry format:

  {
    "id": "uuid",
    "timestamp": "ISO-8601",
    "type": "class-change",
    "file": "app/page.tsx",
    "line": 12,
    "oldValue": "p-2 m-4",
    "newValue": "p-4 m-6",
    "description": "Changed padding and margin on div"
  }

• Undo: read last entry, apply oldValue to the file, pop from stack
• Redo: push undone entry back to stack, apply newValue
• The design-mode-agent.js should report all user actions (clicks, drags, class changes) to the parent so they can be recorded

Related

• components/workspace/design-panel.tsx: Current Undo/Redo buttons (currently no-op)
• app/api/workspace/design-edit/route.ts: Where changes are applied to files

[Delqhi]

Implemented and merged to main via #58 (commit ) and prior PRs (#56).

Includes:

• lib/workspace/design-history.ts — JSONL undo/redo stacks (max 100 entries, bounded)
• app/api/workspace/design-history/route.ts — POST {action: 'undo'|'redo'} endpoint
• Wired into Design Mode apply flow (app/api/workspace/design-edit/route.ts)
• History persisted to .sin-webui/design-history.jsonl and design-redo.jsonl

Status: Undo/Redo logic and persistence are working. UI buttons (in Design Mode inspector) are wired; keyboard shortcuts (⌘Z / ⌘⇧Z) need a follow-up issue for the in-iframe listener.