feat(M9): active product backlog — persistent active PB, NavBar splits, sprint card styling (#10)
* feat(tooling): extend backlog parser to support PBI-x milestone headers Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com> * chore(backlog): mark ST-801–806 as done Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com> * feat(backlog): sorteer PBI's en stories op prio/code/datum, onthoud keuze in localStorage; vergroot sprint-afronden dialoog Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com> * feat(ST-901): add user.active_product_id with FK to Product - Nullable relation User → Product with onDelete: SetNull - Index on active_product_id for join performance - Migration: 20260427165329_add_user_active_product_id - Install @tanstack/react-table (was missing from node_modules) - Fix PRIORITY_COLORS ref removed in earlier refactor - Note: User schema change affects vendor/scrum4me-mcp submodule — run prisma generate + tsc --noEmit there after merge Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com> * fix: restore priority color on PBI filter pill Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com> * feat(ST-902): add setActiveProduct + clearActiveProduct server actions - actions/active-product.ts: setActiveProductAction validates access via productAccessFilter, rejects archived products and demo users - archiveProductAction: clears active_product_id for all affected users in transaction - removeProductMemberAction: clears active_product_id for removed member - leaveProductAction: clears active_product_id for leaving user Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com> * feat(ST-903): load active product in layout, replace cookie with DB lookup in solo - layout.tsx: fetch active_product_id, resolve product, clear stale ref server-side - NavBar: add activeProduct prop (rendering changes in ST-904) - solo/page.tsx: redirect via user.active_product_id instead of lastProductId cookie - proxy.ts: remove lastProductId cookie logic - lib/cookies.ts: deleted (no longer used) Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com> * feat(ST-904): split NavBar into 5 tabs with disabled-states and product-switcher dropdown Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com> * feat(ST-905): add Activeer button per product row in dashboard and product header * feat(ST-906): redirect to dashboard with toast when active product becomes inaccessible * feat(ST-907): tests for active-product actions and functional spec update for M9 * docs(M9): add implementation plan document and link from backlog * feat: active PB indicator, Maak actief button and new product link in settings * feat: apply priority-color card style to sprint story rows * fix: move add-to-sprint click from entire card to + Toevoegen button * feat: apply priority-color card style to sprint task rows * fix(sprint-backlog): prevent text selection on PBI collapse button * chore: bump version to 0.4.0 (M9 active product backlog) * fix(landing): align logged-in nav left to match app NavBar --------- Co-authored-by: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
GitHub
parent
c1c219639a
commit
88dca4102c
28 changed files with 1184 additions and 481 deletions
|
|
@ -5,6 +5,7 @@ import { prisma } from '@/lib/prisma'
|
|||
import { RoleManager } from '@/components/settings/role-manager'
|
||||
import { LeaveProductButton } from '@/components/settings/leave-product-button'
|
||||
import { ProfileEditor } from '@/components/settings/profile-editor'
|
||||
import { ActivateProductButton } from '@/components/shared/activate-product-button'
|
||||
import Link from 'next/link'
|
||||
|
||||
export default async function SettingsPage() {
|
||||
|
|
@ -13,7 +14,7 @@ export default async function SettingsPage() {
|
|||
const [user, userRoles, ownedProducts, memberships] = await Promise.all([
|
||||
prisma.user.findUnique({
|
||||
where: { id: session.userId },
|
||||
select: { username: true, email: true, bio: true, bio_detail: true, avatar_data: true, updated_at: true },
|
||||
select: { username: true, email: true, bio: true, bio_detail: true, avatar_data: true, updated_at: true, active_product_id: true },
|
||||
}),
|
||||
prisma.userRole.findMany({ where: { user_id: session.userId } }),
|
||||
prisma.product.findMany({
|
||||
|
|
@ -33,7 +34,9 @@ export default async function SettingsPage() {
|
|||
| { kind: 'owner'; id: string; name: string }
|
||||
| { kind: 'member'; id: string; name: string; ownerUsername: string }
|
||||
|
||||
const productBacklogs: PbEntry[] = [
|
||||
const activeProductId = user?.active_product_id ?? null
|
||||
|
||||
const allBacklogs: PbEntry[] = [
|
||||
...ownedProducts.map(p => ({ kind: 'owner' as const, id: p.id, name: p.name })),
|
||||
...memberships.map(m => ({
|
||||
kind: 'member' as const,
|
||||
|
|
@ -43,6 +46,12 @@ export default async function SettingsPage() {
|
|||
})),
|
||||
]
|
||||
|
||||
// Active product floats to the top
|
||||
const productBacklogs = [
|
||||
...allBacklogs.filter(pb => pb.id === activeProductId),
|
||||
...allBacklogs.filter(pb => pb.id !== activeProductId),
|
||||
]
|
||||
|
||||
return (
|
||||
<div className="p-6 max-w-2xl mx-auto w-full space-y-6">
|
||||
<h1 className="text-xl font-medium text-foreground">Instellingen</h1>
|
||||
|
|
@ -78,11 +87,21 @@ export default async function SettingsPage() {
|
|||
<RoleManager currentRoles={currentRoles} isDemo={session.isDemo ?? false} />
|
||||
|
||||
<div className="bg-surface-container-low border border-border rounded-xl p-5 space-y-3">
|
||||
<div>
|
||||
<h2 className="text-sm font-medium text-foreground">Product Backlogs</h2>
|
||||
<p className="text-xs text-muted-foreground mt-0.5">
|
||||
Alle product backlogs waarbij je betrokken bent.
|
||||
</p>
|
||||
<div className="flex items-start justify-between gap-3">
|
||||
<div>
|
||||
<h2 className="text-sm font-medium text-foreground">Product Backlogs</h2>
|
||||
<p className="text-xs text-muted-foreground mt-0.5">
|
||||
Alle product backlogs waarbij je betrokken bent.
|
||||
</p>
|
||||
</div>
|
||||
{!session.isDemo && (
|
||||
<Link
|
||||
href="/products/new"
|
||||
className="shrink-0 text-xs text-primary hover:underline font-medium"
|
||||
>
|
||||
+ Nieuw product
|
||||
</Link>
|
||||
)}
|
||||
</div>
|
||||
{productBacklogs.length === 0 ? (
|
||||
<p className="text-sm text-muted-foreground">
|
||||
|
|
@ -91,33 +110,52 @@ export default async function SettingsPage() {
|
|||
</p>
|
||||
) : (
|
||||
<ul className="space-y-2">
|
||||
{productBacklogs.map(pb => (
|
||||
<li key={`${pb.kind}-${pb.id}`} className="flex items-center justify-between gap-3 rounded-lg bg-surface-container px-3 py-2.5">
|
||||
<div className="min-w-0">
|
||||
<div className="flex items-center gap-2">
|
||||
<Link
|
||||
href={`/products/${pb.id}`}
|
||||
className="text-sm font-medium text-foreground hover:text-primary hover:underline truncate"
|
||||
>
|
||||
{pb.name}
|
||||
</Link>
|
||||
<span className={`shrink-0 text-xs px-1.5 py-0.5 rounded font-medium ${
|
||||
pb.kind === 'owner'
|
||||
? 'bg-primary-container text-primary-container-foreground'
|
||||
: 'bg-secondary-container text-secondary-container-foreground'
|
||||
}`}>
|
||||
{pb.kind === 'owner' ? 'Eigenaar' : 'Developer'}
|
||||
</span>
|
||||
{productBacklogs.map(pb => {
|
||||
const isActive = pb.id === activeProductId
|
||||
return (
|
||||
<li key={`${pb.kind}-${pb.id}`} className={`flex items-center justify-between gap-3 rounded-lg px-3 py-2.5 ${
|
||||
isActive ? 'bg-primary-container/30 border border-primary/20' : 'bg-surface-container'
|
||||
}`}>
|
||||
<div className="min-w-0">
|
||||
<div className="flex items-center gap-2 flex-wrap">
|
||||
<Link
|
||||
href={`/products/${pb.id}`}
|
||||
className="text-sm font-medium text-foreground hover:text-primary hover:underline truncate"
|
||||
>
|
||||
{pb.name}
|
||||
</Link>
|
||||
<span className={`shrink-0 text-xs px-1.5 py-0.5 rounded font-medium ${
|
||||
pb.kind === 'owner'
|
||||
? 'bg-primary-container text-primary-container-foreground'
|
||||
: 'bg-secondary-container text-secondary-container-foreground'
|
||||
}`}>
|
||||
{pb.kind === 'owner' ? 'Eigenaar' : 'Developer'}
|
||||
</span>
|
||||
{isActive && (
|
||||
<span className="shrink-0 text-xs px-1.5 py-0.5 rounded font-medium bg-primary text-primary-foreground">
|
||||
Actief
|
||||
</span>
|
||||
)}
|
||||
</div>
|
||||
{pb.kind === 'member' && (
|
||||
<p className="text-xs text-muted-foreground mt-0.5">Eigenaar: {pb.ownerUsername}</p>
|
||||
)}
|
||||
</div>
|
||||
{pb.kind === 'member' && (
|
||||
<p className="text-xs text-muted-foreground mt-0.5">Eigenaar: {pb.ownerUsername}</p>
|
||||
)}
|
||||
</div>
|
||||
{pb.kind === 'member' && !session.isDemo && (
|
||||
<LeaveProductButton productId={pb.id} />
|
||||
)}
|
||||
</li>
|
||||
))}
|
||||
<div className="flex items-center gap-3 shrink-0">
|
||||
{!isActive && (
|
||||
<ActivateProductButton
|
||||
productId={pb.id}
|
||||
isDemo={session.isDemo ?? false}
|
||||
label="Maak actief"
|
||||
/>
|
||||
)}
|
||||
{pb.kind === 'member' && !session.isDemo && (
|
||||
<LeaveProductButton productId={pb.id} />
|
||||
)}
|
||||
</div>
|
||||
</li>
|
||||
)
|
||||
})}
|
||||
</ul>
|
||||
)}
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue