feat: filter 'toon afgeronde sprints' in sprint-switcher dropdown
Default verbergt de switcher gesloten/gearchiveerde/mislukte sprints (toont alleen open + de huidige actieve sprint). Toggle bovenaan de lijst om alle sprints te tonen. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
parent
b4aa5d9949
commit
d90d8a8aa2
1 changed files with 50 additions and 17 deletions
|
|
@ -1,14 +1,15 @@
|
|||
'use client'
|
||||
|
||||
import { usePathname, useRouter } from 'next/navigation'
|
||||
import { useTransition } from 'react'
|
||||
import { ChevronDown } from 'lucide-react'
|
||||
import { useState, useTransition } from 'react'
|
||||
import { Check, ChevronDown } from 'lucide-react'
|
||||
import { toast } from 'sonner'
|
||||
import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '@/components/ui/tooltip'
|
||||
import {
|
||||
DropdownMenu,
|
||||
DropdownMenuContent,
|
||||
DropdownMenuItem,
|
||||
DropdownMenuSeparator,
|
||||
DropdownMenuTrigger,
|
||||
} from '@/components/ui/dropdown-menu'
|
||||
import { cn } from '@/lib/utils'
|
||||
|
|
@ -40,8 +41,15 @@ export function SprintSwitcher({
|
|||
const pathname = usePathname()
|
||||
const router = useRouter()
|
||||
const [isPending, startTransition] = useTransition()
|
||||
const [showClosed, setShowClosed] = useState(false)
|
||||
const buildingSet = new Set(buildingSprintIds)
|
||||
|
||||
const visibleSprints = sprints.filter(s => {
|
||||
if (showClosed) return true
|
||||
if (s.id === activeSprint?.id) return true
|
||||
return s.status === 'open'
|
||||
})
|
||||
|
||||
function handleSwitchSprint(sprintId: string) {
|
||||
if (sprintId === activeSprint?.id) return
|
||||
startTransition(async () => {
|
||||
|
|
@ -96,27 +104,52 @@ export function SprintSwitcher({
|
|||
<ChevronDown className="w-3 h-3 shrink-0 text-muted-foreground" />
|
||||
</DropdownMenuTrigger>
|
||||
<DropdownMenuContent align="center" className="w-80">
|
||||
{sprints.map(s => (
|
||||
<DropdownMenuItem
|
||||
key={s.id}
|
||||
onClick={() => handleSwitchSprint(s.id)}
|
||||
<button
|
||||
type="button"
|
||||
onClick={(e) => {
|
||||
e.preventDefault()
|
||||
setShowClosed(v => !v)
|
||||
}}
|
||||
className="flex items-center gap-2 w-full px-2 py-1.5 text-xs text-muted-foreground hover:bg-surface-container rounded-md"
|
||||
>
|
||||
<span
|
||||
className={cn(
|
||||
'flex items-center gap-2',
|
||||
s.id === activeSprint?.id && 'bg-primary-container text-primary-container-foreground font-medium',
|
||||
'inline-flex items-center justify-center w-3.5 h-3.5 rounded border',
|
||||
showClosed ? 'bg-primary border-primary text-primary-foreground' : 'border-border',
|
||||
)}
|
||||
>
|
||||
<span className="text-xs font-medium shrink-0">{s.code}</span>
|
||||
<span className="text-xs truncate flex-1">{s.sprint_goal}</span>
|
||||
<span
|
||||
{showClosed && <Check className="w-3 h-3" />}
|
||||
</span>
|
||||
Toon afgeronde sprints
|
||||
</button>
|
||||
<DropdownMenuSeparator />
|
||||
{visibleSprints.length === 0 ? (
|
||||
<div className="px-2 py-2 text-xs text-muted-foreground/70 italic">
|
||||
Geen open sprints
|
||||
</div>
|
||||
) : (
|
||||
visibleSprints.map(s => (
|
||||
<DropdownMenuItem
|
||||
key={s.id}
|
||||
onClick={() => handleSwitchSprint(s.id)}
|
||||
className={cn(
|
||||
'text-[10px] shrink-0',
|
||||
buildingSet.has(s.id) ? 'text-warning' : 'text-muted-foreground',
|
||||
'flex items-center gap-2',
|
||||
s.id === activeSprint?.id && 'bg-primary-container text-primary-container-foreground font-medium',
|
||||
)}
|
||||
>
|
||||
{buildingSet.has(s.id) ? 'BUILDING' : SPRINT_STATUS_LABEL[s.status]}
|
||||
</span>
|
||||
</DropdownMenuItem>
|
||||
))}
|
||||
<span className="text-xs font-medium shrink-0">{s.code}</span>
|
||||
<span className="text-xs truncate flex-1">{s.sprint_goal}</span>
|
||||
<span
|
||||
className={cn(
|
||||
'text-[10px] shrink-0',
|
||||
buildingSet.has(s.id) ? 'text-warning' : 'text-muted-foreground',
|
||||
)}
|
||||
>
|
||||
{buildingSet.has(s.id) ? 'BUILDING' : SPRINT_STATUS_LABEL[s.status]}
|
||||
</span>
|
||||
</DropdownMenuItem>
|
||||
))
|
||||
)}
|
||||
</DropdownMenuContent>
|
||||
</DropdownMenu>
|
||||
)
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue