feat: sprint-switcher overal + PBI auto-toevoeging + cleanups (#163)

* refactor: verplaats sprint-switcher van NavBar naar product-header

Sprint-pulldown zit nu in de bestaande balk op de product backlog
(naast Sprint starten / Instellingen) i.p.v. in het midden van de
NavBar. Alleen zichtbaar wanneer het product ook het actieve product
van de gebruiker is.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

* chore: sync package-lock.json version naar 1.2.0

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

* refactor: centreer sprint-switcher en verwijder badges uit dropdown items

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

* refactor: vervang sprint-status badge door subtle tekst

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

* feat: toon code + titel + status in sprint-switcher dropdown items

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

* fix: cookie-write uit Server Component (Next.js 16 verbiedt dit)

setActiveSprintCookie werd direct aangeroepen in app/(app)/products/[id]/sprint/[sprintId]/page.tsx,
wat in Next.js 16 een runtime-error oplevert ('Cookies can only be modified in a Server Action
or Route Handler'). Vervangen door een client-side bridge die syncActiveSprintCookieAction
aanroept na mount, zodat de active-sprint cookie nog steeds gesynced blijft met de URL.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

* 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>

* feat: nieuwe sprint wordt direct geselecteerd zonder redirect

createSprintAction zet nu de active-sprint cookie naar de zojuist
aangemaakte sprint, en de StartSprintButton refresht de huidige
pagina i.p.v. te redirecten naar /sprint. Resultaat: gebruiker blijft
op de product backlog en ziet de nieuwe sprint direct geselecteerd
in de sprint-pulldown.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

* refactor: verplaats Manual en Admin naar user-menu dropdown

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

* feat: voeg geselecteerde PBI automatisch toe aan nieuwe sprint

Bij sprint-aanmaak wordt de pbi_id uit de selection-store als hidden
form-field meegestuurd. Server-side worden alle stories van die PBI
(zonder sprint) en hun taken aan de nieuwe sprint gekoppeld; stories
krijgen status IN_SPRINT met incrementele sort_order.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

* feat: sprint-switcher op solo- en sprint-board pagina's

Sprint-switcher is nu beschikbaar op de drie hoofdpagina's: product
backlog, solo board en sprint board. Allen renderen 'm in een
gecentreerde balk net onder de NavBar. Sprint-data via gedeelde helper
getSprintSwitcherData.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

---------

Co-authored-by: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
Janpeter Visser 2026-05-08 02:32:50 +02:00 committed by GitHub
parent a4a7ef9b8b
commit 3842c05ae9
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
13 changed files with 265 additions and 89 deletions

View file

@ -1,22 +1,22 @@
'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 { Badge } from '@/components/ui/badge'
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'
import { setActiveSprintAction } from '@/actions/active-sprint'
import type { SprintStatusApi } from '@/lib/task-status'
type SprintItem = { id: string; code: string; status: SprintStatusApi }
type SprintItem = { id: string; code: string; sprint_goal: string; status: SprintStatusApi }
interface SprintSwitcherProps {
productId: string
@ -32,13 +32,6 @@ const SPRINT_STATUS_LABEL: Record<SprintStatusApi, string> = {
failed: 'Mislukt',
}
const SPRINT_STATUS_BADGE: Record<SprintStatusApi, string> = {
open: 'bg-status-in-progress text-foreground',
closed: 'bg-status-done text-foreground',
archived: 'bg-surface-container text-muted-foreground',
failed: 'bg-status-failed text-foreground',
}
export function SprintSwitcher({
productId,
sprints,
@ -48,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 () => {
@ -92,42 +92,64 @@ export function SprintSwitcher({
{activeSprint ? activeSprint.code : 'Selecteer sprint'}
</span>
{activeSprint && (
<Badge
<span
className={cn(
'text-[10px] px-1.5 py-0',
buildingSet.has(activeSprint.id)
? 'bg-warning text-warning-foreground'
: SPRINT_STATUS_BADGE[activeSprint.status],
'text-[10px]',
buildingSet.has(activeSprint.id) ? 'text-warning' : 'text-muted-foreground',
)}
>
{buildingSet.has(activeSprint.id) ? 'BUILDING' : SPRINT_STATUS_LABEL[activeSprint.status]}
</Badge>
</span>
)}
<ChevronDown className="w-3 h-3 shrink-0 text-muted-foreground" />
</DropdownMenuTrigger>
<DropdownMenuContent align="start" className="w-64">
{sprints.map(s => (
<DropdownMenuItem
key={s.id}
onClick={() => handleSwitchSprint(s.id)}
<DropdownMenuContent align="center" className="w-80">
<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 justify-between 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="truncate">{s.code}</span>
<Badge
{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] px-1.5 py-0 shrink-0',
buildingSet.has(s.id)
? 'bg-warning text-warning-foreground'
: SPRINT_STATUS_BADGE[s.status],
'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]}
</Badge>
</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>
)