xtablo-source/.planning/phases/04-tasks-kanban/04-04-PLAN.md

phase	plan	type	wave	depends_on	files_modified	autonomous	requirements	must_haves
04-tasks-kanban	04	execute	4	04-03-PLAN.md		false	TASK-01 TASK-02 TASK-03 TASK-04 TASK-05 TASK-06 TASK-07	truths artifacts key_links Tablo detail page shows a kanban board with 4 labeled columns Creating a task inserts it into the correct column without full page reload Editing a task updates title and description inline Dragging a task to a different column moves it and persists after reload Reordering tasks within a column persists after reload Deleting a task removes it from the board with a confirmation step go test ./... is fully green before this checkpoint runs path provides backend/internal/web/handlers_tasks.go All task handlers fully implemented path provides backend/templates/tasks.templ Full kanban board templ components from to via pattern browser drag DB position column Sortable.js → htmx.trigger → POST /tasks/reorder → UpdateTask sortable-column

Human verification checkpoint: confirm the full kanban board works end-to-end in a real browser session before closing Phase 4. All 7 TASK requirements must be visually verifiable.

Purpose: Automated tests prove correctness of individual handlers; this checkpoint proves the integrated experience works — drag-and-drop, inline edits, correct HTMX swap targets, Sortable.js re-initialization after swaps. Output: Human approval that Phase 4 is shippable. No code changes expected.

<execution_context> @/Users/arthur.belleville/Documents/perso/projects/xtablo-source/.claude/get-shit-done/workflows/execute-plan.md @/Users/arthur.belleville/Documents/perso/projects/xtablo-source/.claude/get-shit-done/templates/summary.md </execution_context>

@/Users/arthur.belleville/Documents/perso/projects/xtablo-source/.planning/ROADMAP.md @/Users/arthur.belleville/Documents/perso/projects/xtablo-source/.planning/phases/04-tasks-kanban/04-03-SUMMARY.md Task 1: Final automated suite gate - backend/internal/web/handlers_tasks_test.go (verify all 9 TestTask* are non-stub before running) Run the full test suite and confirm it is green. Then start the dev server for browser verification.

Run: cd backend && go test ./... -count=1 -v 2>&1 | grep -E "^(--- PASS|--- FAIL|FAIL|ok)"

If any FAIL lines appear, fix them before proceeding to the checkpoint. Do not open the browser until the full suite is green.

Then start the dev server: cd backend && just dev (leaves it running for the checkpoint).

cd /Users/arthur.belleville/Documents/perso/projects/xtablo-source/backend && go test ./... -count=1 2>&1 | grep -v "^?" | grep -E "(FAIL|ok)" All output lines show "ok" — no "FAIL" lines. Dev server started on localhost. A fully functional kanban board inside every tablo. The board has 4 fixed columns (To do / In progress / In review / Done) with task count badges, inline task creation at the bottom of each column, inline task editing by clicking a card, drag-and-drop reordering and column moves via Sortable.js, and inline delete with confirmation. All mutations are HTMX-driven. All 9 TestTask* integration tests pass. With `just dev` running (cd backend && just dev), open http://localhost:8080 in a browser.

**Setup:** Sign in (or sign up). Create a tablo if you don't have one. Click the tablo to open its detail page.

**TASK-01 — Kanban board renders:**
- Confirm 4 column headers: "To do", "In progress", "In review", "Done"
- Each column shows a count badge (e.g. "0")
- Empty columns show "No tasks yet" in italic

**TASK-02 — Create a task:**
- Click "+ Add task" at the bottom of the "To do" column
- Confirm an inline form appears (no page reload)
- Type a title "First task" and click "Add task"
- Confirm the task card appears in the "To do" column and the count badge updates to 1
- Verify the "+ Add task" button reappears after submit
- Create 2 more tasks in different columns

**TASK-06 — Delete a task:**
- Click the "Delete" button on a task card
- Confirm an inline "Delete task? / This cannot be undone." confirmation appears
- Click "Keep task" and confirm the card is restored
- Click "Delete" again, then "Yes, delete" and confirm the card disappears

**TASK-03 — Edit a task:**
- Click on a task card body (not the delete button or drag handle)
- Confirm an edit form appears with the current title pre-filled
- Change the title and click "Save changes"
- Confirm the card shows the updated title without a full page reload
- Click edit again, then "Discard changes" — confirm original state is restored

**TASK-04 and TASK-05 — Drag and drop:**
- Create at least 3 tasks in "To do"
- Drag a task (using the ⠿ grip handle) to the "In Progress" column — confirm it lands there
- Reload the page — confirm the task is still in "In Progress"
- Drag tasks within a column to reorder — reload and confirm order persists

**Degraded mode (optional):**
- Disable JavaScript in browser settings
- Confirm task creation form still submits via standard POST (page reload, 303 redirect flow)

Report any visual issues (wrong column order, badge not updating, drag not working after first swap, etc.)

Type "approved" if the board works end-to-end. Or describe any issues found.

<threat_model>

Trust Boundaries

Boundary	Description
Human tester → local dev server	No production data; local Postgres

STRIDE Threat Register

Threat ID	Category	Component	Disposition	Mitigation Plan
T-04-13	Information Disclosure	Human verify with real credentials	accept	Local dev only; no production data involved in this checkpoint
</threat_model>

Human approval received via "approved" signal. All 7 TASK requirements visually verified: - TASK-01: 4 columns render - TASK-02: task creation works inline - TASK-03: task editing works inline - TASK-04: cross-column drag persists - TASK-05: within-column reorder persists - TASK-06: delete with confirmation works - TASK-07: order survives page reload

<success_criteria> Plan 04 complete when:

1. go test ./... exits 0 (pre-condition for checkpoint)
2. Human confirms all 7 TASK behaviors work in the browser
3. "approved" signal received </success_criteria>

After completion, create `.planning/phases/04-tasks-kanban/04-04-SUMMARY.md`