feat(solo-dialogs): layout-conformance + entity-profielen
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) <noreply@anthropic.com>
This commit is contained in:
parent
784791d8f9
commit
0a58557e9d
5 changed files with 157 additions and 34 deletions
|
|
@ -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 (
|
||||
<Dialog open={open} onOpenChange={onOpenChange}>
|
||||
<DialogContent className="sm:max-w-md">
|
||||
<DialogHeader>
|
||||
<DialogTitle>Blokkade gedetecteerd</DialogTitle>
|
||||
</DialogHeader>
|
||||
<DialogContent showCloseButton={false} className={entityDialogContentClasses}>
|
||||
<div className={entityDialogHeaderClasses}>
|
||||
<DialogTitle className="text-xl font-semibold">Blokkade gedetecteerd</DialogTitle>
|
||||
</div>
|
||||
|
||||
<div className="space-y-3 py-2 text-sm text-foreground">
|
||||
<div className="flex-1 overflow-y-auto px-6 py-6 space-y-6 text-sm text-foreground">
|
||||
<p>
|
||||
{BLOCKER_REASON_LABELS[blockerReason]}:{' '}
|
||||
<span className="font-medium">{blockerLabel}</span>.
|
||||
|
|
@ -53,33 +58,35 @@ export function BatchEnqueueBlockerDialog({
|
|||
)}
|
||||
</div>
|
||||
|
||||
<div className="flex justify-end gap-2 pt-2 border-t border-outline-variant">
|
||||
<Button variant="ghost" onClick={onCancel}>
|
||||
Annuleer
|
||||
</Button>
|
||||
<TooltipProvider>
|
||||
<Tooltip>
|
||||
<TooltipTrigger
|
||||
render={
|
||||
<span>
|
||||
<Button
|
||||
onClick={onConfirm}
|
||||
disabled={noTasksBeforeBlocker}
|
||||
>
|
||||
{prefixCount === 1
|
||||
? `Stuur ${prefixCount} taak tot aan blokkade`
|
||||
: `Stuur ${prefixCount} taken tot aan blokkade`}
|
||||
</Button>
|
||||
</span>
|
||||
}
|
||||
/>
|
||||
{noTasksBeforeBlocker && (
|
||||
<TooltipContent side="top" className="text-xs">
|
||||
Geen taken vóór blokkade
|
||||
</TooltipContent>
|
||||
)}
|
||||
</Tooltip>
|
||||
</TooltipProvider>
|
||||
<div className={entityDialogFooterClasses}>
|
||||
<div className="flex justify-end gap-2">
|
||||
<Button variant="ghost" onClick={onCancel}>
|
||||
Annuleer
|
||||
</Button>
|
||||
<TooltipProvider>
|
||||
<Tooltip>
|
||||
<TooltipTrigger
|
||||
render={
|
||||
<span>
|
||||
<Button
|
||||
onClick={onConfirm}
|
||||
disabled={noTasksBeforeBlocker}
|
||||
>
|
||||
{prefixCount === 1
|
||||
? `Stuur ${prefixCount} taak tot aan blokkade`
|
||||
: `Stuur ${prefixCount} taken tot aan blokkade`}
|
||||
</Button>
|
||||
</span>
|
||||
}
|
||||
/>
|
||||
{noTasksBeforeBlocker && (
|
||||
<TooltipContent side="top" className="text-xs">
|
||||
Geen taken vóór blokkade
|
||||
</TooltipContent>
|
||||
)}
|
||||
</Tooltip>
|
||||
</TooltipProvider>
|
||||
</div>
|
||||
</div>
|
||||
</DialogContent>
|
||||
</Dialog>
|
||||
|
|
|
|||
|
|
@ -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 (
|
||||
<Dialog open={!!task} onOpenChange={(open) => { if (!open) onClose() }}>
|
||||
<DialogContent className="sm:max-w-lg">
|
||||
<DialogContent showCloseButton={false} className={entityDialogContentClasses}>
|
||||
{task && (
|
||||
<TaskDetailContent
|
||||
key={task.id}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue