janpeter/Scrum4Me
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

refactor: sprint-switcher van NavBar naar product-header (#162)

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

---------

Co-authored-by: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
Janpeter Visser 2026-05-08 01:05:39 +02:00 • committed by GitHub
parent 4a9db57e94
commit a4a7ef9b8b
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
5 changed files with 195 additions and 149 deletions
Download patch file Download diff file Expand all files Collapse all files

115
components/shared/nav-bar.tsx
View file

@ -20,10 +20,6 @@ import { NotificationsBell } from '@/components/shared/notifications-bell'
import { SoloNavStatusIndicators } from '@/components/solo/nav-status-indicators'
import { cn } from '@/lib/utils'
import { setActiveProductAction } from '@/actions/active-product'
import { setActiveSprintAction } from '@/actions/active-sprint'
import type { SprintStatusApi } from '@/lib/task-status'
type SprintItem = { id: string; code: string; status: SprintStatusApi }
interface NavBarProps {
isDemo: boolean
@ -33,26 +29,10 @@ interface NavBarProps {
email: string | null
activeProduct: { id: string; name: string } | null
products: { id: string; name: string }[]
sprints: SprintItem[]
activeSprint: SprintItem | null
buildingSprintIds: string[]
hasActiveSprint: boolean
minQuotaPct: number
}
const SPRINT_STATUS_LABEL: Record<SprintStatusApi, string> = {
open: 'Open',
closed: 'Gesloten',
archived: 'Gearchiveerd',
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 NavBar({
isDemo,
roles,
@ -61,16 +41,12 @@ export function NavBar({
email,
activeProduct,
products,
sprints,
activeSprint,
buildingSprintIds,
hasActiveSprint,
minQuotaPct,
}: NavBarProps) {
const pathname = usePathname()
const router = useRouter()
const [isPending, startTransition] = useTransition()
const buildingSet = new Set(buildingSprintIds)
const hasActiveSprint = !!activeSprint
function handleSwitchProduct(productId: string) {
startTransition(async () => {
@ -85,23 +61,6 @@ export function NavBar({
})
}
function handleSwitchSprint(sprintId: string) {
if (!activeProduct) return
if (sprintId === activeSprint?.id) return
startTransition(async () => {
const result = await setActiveSprintAction(activeProduct.id, sprintId)
if (result?.error) {
toast.error(typeof result.error === 'string' ? result.error : 'Wisselen mislukt')
return
}
if (pathname.includes('/sprint')) {
router.push(`/products/${activeProduct.id}/sprint/${sprintId}`)
} else {
router.refresh()
}
})
}
const activeId = activeProduct?.id ?? null
// Nav link helpers
@ -147,7 +106,7 @@ export function NavBar({
</TooltipProvider>
)
}
const href = `/products/${activeId}/sprint/${activeSprint!.id}`
const href = `/products/${activeId}/sprint`
return navLink(href, 'Sprint', isActive)
}
@ -190,8 +149,8 @@ export function NavBar({
</nav>
</div>
{/* Midden: actief product + sprint, gestapeld */}
<div className="flex flex-col items-center justify-center gap-0.5">
{/* Midden: actief product */}
<div className="flex items-center justify-center">
{activeProduct ? (
<DropdownMenu>
<DropdownMenuTrigger
@ -228,70 +187,6 @@ export function NavBar({
) : (
<span className="text-sm text-muted-foreground/50 select-none">Geen actief product</span>
)}
{activeProduct && (
sprints.length === 0 ? (
<TooltipProvider>
<Tooltip>
<TooltipTrigger
className="text-xs text-muted-foreground/50 px-2 cursor-not-allowed select-none"
aria-disabled="true"
>
Geen sprints
</TooltipTrigger>
<TooltipContent>Maak een sprint aan vanuit de Product Backlog</TooltipContent>
</Tooltip>
</TooltipProvider>
) : (
<DropdownMenu>
<DropdownMenuTrigger
disabled={isPending}
className="flex items-center gap-1.5 text-xs text-muted-foreground hover:text-foreground transition-colors px-2 rounded-md hover:bg-surface-container focus:outline-none"
>
<span className="truncate max-w-[160px]">
{activeSprint ? activeSprint.code : 'Selecteer sprint'}
</span>
{activeSprint && (
<Badge
className={cn(
'text-[10px] px-1.5 py-0',
buildingSet.has(activeSprint.id)
? 'bg-warning text-warning-foreground'
: SPRINT_STATUS_BADGE[activeSprint.status],
)}
>
{buildingSet.has(activeSprint.id) ? 'BUILDING' : SPRINT_STATUS_LABEL[activeSprint.status]}
</Badge>
)}
<ChevronDown className="w-3 h-3 shrink-0 text-muted-foreground" />
</DropdownMenuTrigger>
<DropdownMenuContent align="center" className="w-64">
{sprints.map(s => (
<DropdownMenuItem
key={s.id}
onClick={() => handleSwitchSprint(s.id)}
className={cn(
'flex items-center justify-between gap-2',
s.id === activeSprint?.id && 'bg-primary-container text-primary-container-foreground font-medium',
)}
>
<span className="truncate">{s.code}</span>
<Badge
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],
)}
>
{buildingSet.has(s.id) ? 'BUILDING' : SPRINT_STATUS_LABEL[s.status]}
</Badge>
</DropdownMenuItem>
))}
</DropdownMenuContent>
</DropdownMenu>
)
)}
</div>
{/* Rechts: solo-status + notifications + account-menu */}