From 0a58557e9d62b16ead3b945180988c6456d28fa4 Mon Sep 17 00:00:00 2001 From: Madhura68 Date: Mon, 4 May 2026 07:32:57 +0200 Subject: [PATCH] feat(solo-dialogs): layout-conformance + entity-profielen MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Story 6 van PBI "Alle dialogen conform docs/patterns/dialog.md". - batch-enqueue-blocker-dialog: entityDialog* layout-classes - task-detail-dialog: entityDialog* layout-classes (rest van interne layout blijft custom — hybride detail+blur-save view) - docs/specs/dialogs/task-detail.md — profiel dat het blur-save + PATCH-route patroon documenteert (afwijking van klassieke Server-Action+form flow) - docs/specs/dialogs/batch-enqueue-blocker.md — profiel voor informational confirm-dialog Co-Authored-By: Claude Opus 4.7 (1M context) --- .../solo/batch-enqueue-blocker-dialog.tsx | 73 ++++++++++--------- components/solo/task-detail-dialog.tsx | 3 +- docs/INDEX.md | 2 + docs/specs/dialogs/batch-enqueue-blocker.md | 48 ++++++++++++ docs/specs/dialogs/task-detail.md | 65 +++++++++++++++++ 5 files changed, 157 insertions(+), 34 deletions(-) create mode 100644 docs/specs/dialogs/batch-enqueue-blocker.md create mode 100644 docs/specs/dialogs/task-detail.md diff --git a/components/solo/batch-enqueue-blocker-dialog.tsx b/components/solo/batch-enqueue-blocker-dialog.tsx index 81bf593..e7b2894 100644 --- a/components/solo/batch-enqueue-blocker-dialog.tsx +++ b/components/solo/batch-enqueue-blocker-dialog.tsx @@ -1,8 +1,13 @@ 'use client' -import { Dialog, DialogContent, DialogHeader, DialogTitle } from '@/components/ui/dialog' +import { Dialog, DialogContent, DialogTitle } from '@/components/ui/dialog' import { Button } from '@/components/ui/button' import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '@/components/ui/tooltip' +import { + entityDialogContentClasses, + entityDialogFooterClasses, + entityDialogHeaderClasses, +} from '@/components/shared/entity-dialog-layout' interface BatchEnqueueBlockerDialogProps { open: boolean @@ -32,12 +37,12 @@ export function BatchEnqueueBlockerDialog({ return ( - - - Blokkade gedetecteerd - + +
+ Blokkade gedetecteerd +
-
+

{BLOCKER_REASON_LABELS[blockerReason]}:{' '} {blockerLabel}. @@ -53,33 +58,35 @@ export function BatchEnqueueBlockerDialog({ )}

-
- - - - - - - } - /> - {noTasksBeforeBlocker && ( - - Geen taken vóór blokkade - - )} - - +
+
+ + + + + + + } + /> + {noTasksBeforeBlocker && ( + + Geen taken vóór blokkade + + )} + + +
diff --git a/components/solo/task-detail-dialog.tsx b/components/solo/task-detail-dialog.tsx index a7f3147..8abedc0 100644 --- a/components/solo/task-detail-dialog.tsx +++ b/components/solo/task-detail-dialog.tsx @@ -5,6 +5,7 @@ import Link from 'next/link' import { toast } from 'sonner' import { Markdown } from '@/components/markdown' import { Dialog, DialogContent, DialogHeader, DialogTitle } from '@/components/ui/dialog' +import { entityDialogContentClasses } from '@/components/shared/entity-dialog-layout' import { Badge } from '@/components/ui/badge' import { Button } from '@/components/ui/button' import { Textarea } from '@/components/ui/textarea' @@ -373,7 +374,7 @@ function TaskDetailContent({ task, productId, isDemo, repoUrl, onClose }: TaskDe export function TaskDetailDialog({ task, productId, isDemo, repoUrl, onClose }: TaskDetailDialogProps) { return ( { if (!open) onClose() }}> - + {task && ( Volgt `docs/patterns/dialog.md`. Dit is een **informational / confirm-dialog** zonder eigen entiteit — geen schema, geen demo-policy, geen server actions. + +## Doel + +Wanneer de gebruiker in solo-mode "stuur volgende N taken naar Claude" probeert maar er een blokkade voor de N-de taak ligt (een PBI op `blocked` of een taak op `review`), stopt de UI het in deze dialog en biedt aan om alleen de taken **vóór** de blokkade te queuen. + +## Modus + +Confirm-dialog. Geen create/edit/detail. Geen form. + +## Props + +```ts +{ + open: boolean + onOpenChange: (v: boolean) => void + prefixCount: number // hoeveel taken vóór de blokkade liggen + blockerReason: 'task-review' | 'pbi-blocked' + blockerLabel: string // titel van de blokkerende PBI/taak + onConfirm: () => void // alleen taken vóór de blokkade queuen + onCancel: () => void // helemaal annuleren +} +``` + +## URL- of state-pattern + +- Gekozen: **state-based** — gerendeerd door `solo-board` met een `BatchEnqueueState | null`-prop. + +## Layout + +Gebruikt `entityDialogContentClasses` voor responsive sizing. + +## Bewust NIET in v1 + +- ❌ **Geen demo-policy** — de dialog schrijft niet zelf; demo-blokkering vindt plaats wanneer `onConfirm` de daadwerkelijke `enqueueClaudeJobAction` aanroept (laag 2 demo-check zit daar). +- ❌ **Geen schema** — geen veldwaarden in/uit; alleen confirm/cancel. +- ❌ **Geen dirty-close-guard** — geen state om dirty te raken. +- ❌ **Geen Cmd/Ctrl+Enter** — niet zinvol voor confirm-only. diff --git a/docs/specs/dialogs/task-detail.md b/docs/specs/dialogs/task-detail.md new file mode 100644 index 0000000..a5aba2f --- /dev/null +++ b/docs/specs/dialogs/task-detail.md @@ -0,0 +1,65 @@ +--- +title: "TaskDetailDialog Profiel" +status: active +audience: [ai-agent, contributor] +language: nl +last_updated: 2026-05-04 +--- + +# TaskDetailDialog Profiel + +> Volgt `docs/patterns/dialog.md`. Dit document beschrijft alleen de Solo-specifieke afwijkingen. + +> **Niet te verwarren met `TaskDialog`** (`app/_components/tasks/task-dialog.tsx`) — dat is de classic create/edit-dialog voor backlog-taken. **`TaskDetailDialog`** is een solo-board-specifieke detail+edit-overlay die een lopende taak laat zien terwijl de Claude-agent eraan werkt. + +## Doel + +Vanuit het solo-board kan de gebruiker op een task-card klikken om: +- Het implementation_plan te lezen / bewerken (markdown, blur-save) +- Verify-instellingen te wijzigen (`verify_only`, `verify_required`) +- Claude-job-status en branch-link te zien +- De huidige taak naar Claude te sturen / te annuleren + +## Velden + +| Veld | Type | Validatie | +|---|---|---| +| `implementation_plan` | string \| null | max 10000, markdown, blur-save | +| `verify_only` | boolean | toggle, direct opgeslagen | +| `verify_required` | enum `'ALIGNED' \| 'ALIGNED_OR_PARTIAL' \| 'ANY'` | radio, direct opgeslagen | + +## URL- of state-pattern + +- Gekozen: **state-based** — `task: SoloTask | null` prop uit `solo-board`. `null` = dialog gesloten. +- Reden: solo-board is one-page; de detail-dialog is altijd in context. + +## Persistence + +**Geen klassiek form-submit.** Wijzigingen schrijven via `fetch('/api/tasks/:id', { method: 'PATCH' })` (route handler), getriggerd door: +- Plan-textarea: blur of debounced auto-save +- Verify-toggles: direct bij click + +Dit valt buiten de standaard "Server Action met form" flow van `docs/patterns/dialog.md` § 7. Reden: het zijn fine-grained edits van een lopende taak, geen save-dan-sluit-flow. + +## Drielaagse demo-policy + +- **Laag 1 (proxy.ts):** `/api/tasks/[id]`-route is via `apiAuth`-helper beschermd; demo-write zou geblokkeerd moeten worden in de route handler zelf +- **Laag 2 (route handler):** `session.isDemo`-check in `app/api/tasks/[id]/route.ts` (PATCH) — verifieer dat dit aanwezig is +- **Laag 3 (UI):** `` rond plan-textarea en verify-toggles; `readOnly` resp `disabled`-state op de controls + +## Layout + +Gebruikt `entityDialogContentClasses` voor responsive sizing (§4 spec). Body-layout intern is custom (gegroepeerde secties in plaats van form-fields) want het is een hybride detail+edit-view, niet een klassiek form. + +## Bewust NIET in v1 + +- ❌ **Klassiek save-dan-sluit-form** — blur-save is bewust gekozen omdat de gebruiker tussendoor de plan-tekst herziet terwijl Claude bezig is. +- ❌ **Dirty-close-guard** — niet relevant zonder klassiek submit-form; wijzigingen worden direct gepersisteerd. +- ❌ **Cmd/Ctrl+Enter shortcut** — geen submit, dus n.v.t. +- ❌ **422-fieldErrors** — fine-grained PATCH-route geeft simpele 200/400/403; geen veldgewijze rendering nodig in deze UX. + +## Gerelateerde bestanden + +- `components/solo/task-detail-dialog.tsx` — implementatie +- `app/api/tasks/[id]/route.ts` — PATCH-handler +- `stores/solo-store.ts` — client-state