# Phase 8: Optimistic Updates & Batch Save

**Status:** ⬜ Not Started
**Parent plan:** [PLAN.md](./PLAN.md)
**Domain:** fullstack

## Objective
Implement the changeset accumulation system and a batch API endpoint that persists all edit mode changes in a single transaction.

## Tasks

- [ ] Design changeset data structure in editMode store:
  - `widgetUpdates: Map<id, configChanges>`
  - `widgetAdds: Array<{tempId, sectionId, type, config, order}>`
  - `widgetDeletes: Set<id>`
  - `widgetMoves: Map<id, {fromSectionId, toSectionId, newOrder}>`
  - `sectionUpdates: Map<id, changes>`
  - `sectionAdds: Array<{tempId, title, icon, order}>`
  - `sectionDeletes: Set<id>`
  - `sectionReorders: Array<{id, newOrder}>`
  - `boardUpdates: Partial<BoardProps>`
- [ ] Create `POST /api/boards/[id]/batch-update` endpoint
- [ ] Endpoint accepts the full changeset as JSON body
- [ ] Server-side: validate all changes, execute in a single Prisma transaction
- [ ] Server-side: handle temp IDs → real IDs mapping for new items
- [ ] Server-side: authorization check (user must have edit permission)
- [ ] Wire "Save All" toolbar button to serialize changeset and call batch endpoint
- [ ] On success: clear changeset, reset dirty state, broadcast to other tabs, invalidateAll()
- [ ] On failure: show error, keep changeset intact (no data loss)
- [ ] Wire "Discard" toolbar button to reset changeset, revert optimistic UI, exit edit mode
- [ ] Wire widget delete (from Phase 3 overlay) to add to changeset
- [ ] Wire widget config save (from Phase 4) to add to changeset
- [ ] Wire section changes (from Phase 5) to add to changeset
- [ ] Wire new items (from Phase 6) to add to changeset
- [ ] Wire DnD moves (from Phase 7) to add to changeset

## Files to Modify/Create
- `src/lib/stores/editMode.svelte.ts` — add changeset state and mutation functions
- `src/routes/api/boards/[id]/batch-update/+server.ts` — new batch API endpoint
- `src/lib/components/board/EditToolbar.svelte` — wire Save/Discard to real logic
- `src/lib/components/widget/WidgetEditOverlay.svelte` — wire delete to changeset
- `src/lib/components/widget/WidgetConfigPanel.svelte` — wire save to changeset
- Various components — connect to changeset mutations

## Acceptance Criteria
- All changes from Phases 3-7 accumulate in the changeset
- "Save All" sends one HTTP request with all changes
- Server processes all changes in a single transaction
- On success: board reloads with persisted state
- On failure: changes are preserved, error is shown
- "Discard" reverts everything to pre-edit state
- Change count in toolbar updates reactively

## Notes
- Batch endpoint must be idempotent-safe (temp IDs prevent double-creates)
- Widget order values must be recalculated during batch save
- Prisma `$transaction` for atomicity
- Consider payload size limits for very large boards

## Review Checklist
- [ ] All tasks completed
- [ ] Code follows project conventions
- [ ] No unintended side effects
- [ ] Build passes
- [ ] Tests pass (new + existing)

## Handoff to Next Phase
<!-- Filled in after completing this phase -->