- PbiDialog: create/edit with priority select and optional description - StoryDialog: create/edit with priority, description, acceptance criteria, activity log, and delete - PrioritySelect: reusable controlled select component - Edit icons always visible on PBI rows and story blocks - Dialog backdrop uses 40% opacity blur Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
43 lines
1.3 KiB
TypeScript
43 lines
1.3 KiB
TypeScript
'use client'
|
|
|
|
import { Select, SelectContent, SelectItem, SelectTrigger } from '@/components/ui/select'
|
|
import { cn } from '@/lib/utils'
|
|
|
|
export const PRIORITY_LABELS: Record<number, string> = {
|
|
1: 'Kritiek',
|
|
2: 'Hoog',
|
|
3: 'Gemiddeld',
|
|
4: 'Laag',
|
|
}
|
|
|
|
export const PRIORITY_COLORS: Record<number, string> = {
|
|
1: 'bg-priority-critical/15 text-priority-critical border-priority-critical/30',
|
|
2: 'bg-priority-high/15 text-priority-high border-priority-high/30',
|
|
3: 'bg-priority-medium/15 text-priority-medium border-priority-medium/30',
|
|
4: 'bg-priority-low/15 text-priority-low border-priority-low/30',
|
|
}
|
|
|
|
interface PrioritySelectProps {
|
|
value: number
|
|
onChange: (value: number) => void
|
|
className?: string
|
|
}
|
|
|
|
export function PrioritySelect({ value, onChange, className }: PrioritySelectProps) {
|
|
return (
|
|
<Select
|
|
value={String(value)}
|
|
onValueChange={(v) => { if (v) onChange(parseInt(v)) }}
|
|
>
|
|
<SelectTrigger className={cn('w-full', className)}>
|
|
{PRIORITY_LABELS[value] ?? String(value)}
|
|
</SelectTrigger>
|
|
<SelectContent>
|
|
<SelectItem value="1">Kritiek</SelectItem>
|
|
<SelectItem value="2">Hoog</SelectItem>
|
|
<SelectItem value="3">Gemiddeld</SelectItem>
|
|
<SelectItem value="4">Laag</SelectItem>
|
|
</SelectContent>
|
|
</Select>
|
|
)
|
|
}
|