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

feat(jobs): JobCard breadcrumb + datum-fallback per kind

Browse source 
Voeg productCode/pbiCode/storyCode/startedAt/finishedAt toe aan
JobCardProps; bouw breadcrumb per job-kind en toon finishedAt → startedAt
→ createdAt als datum. JobsColumn geeft de nieuwe velden door.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Scrum4Me Agent 2026-05-15 01:07:34 +02:00
parent b76ae290e3
commit 1de14d0417
2 changed files with 33 additions and 5 deletions
Download patch file Download diff file Expand all files Collapse all files

33
components/jobs/job-card.tsx
View file

@ -17,10 +17,15 @@ interface JobCardProps {
sprintGoal?: string | null
sprintCode?: string | null
productName: string
productCode?: string | null
pbiCode?: string | null
storyCode?: string | null
branch?: string | null
error?: string | null
summary?: string | null
createdAt: Date | string
startedAt?: Date | string | null
finishedAt?: Date | string | null
isSelected?: boolean
onClick?: () => void
}
@ -36,7 +41,8 @@ const KIND_LABELS: Record<ClaudeJobKind, string> = {
export default function JobCard({
kind, status, taskCode, taskTitle, ideaCode, ideaTitle,
sprintGoal, sprintCode, productName, branch, error, createdAt, isSelected, onClick,
sprintGoal, sprintCode, productName, productCode, pbiCode, storyCode,
branch, error, createdAt, startedAt, finishedAt, isSelected, onClick,
}: JobCardProps) {
let titleText: string
if (kind === 'TASK_IMPLEMENTATION') {
@ -52,7 +58,19 @@ export default function JobCard({
titleText = 'Job'
}
let breadcrumb: string
if (kind === 'TASK_IMPLEMENTATION') {
breadcrumb = [productCode ?? productName, pbiCode, storyCode].filter(Boolean).join(' ')
} else if (kind === 'IDEA_GRILL' || kind === 'IDEA_MAKE_PLAN' || kind === 'IDEA_REVIEW_PLAN' || kind === 'PLAN_CHAT') {
breadcrumb = [productCode ?? productName, ideaCode].filter(Boolean).join(' ')
} else if (kind === 'SPRINT_IMPLEMENTATION') {
breadcrumb = [productCode ?? productName, sprintCode].filter(Boolean).join(' ')
} else {
breadcrumb = productCode ?? productName
}
const detailText = branch || (error ? error.slice(0, 80) : null) || productName
const displayDate = finishedAt ?? startedAt ?? createdAt
const apiStatus = jobStatusToApi(status)
@ -65,11 +83,16 @@ export default function JobCard({
)}
{...debugProps('job-card', 'JobCard', 'components/jobs/job-card.tsx')}
>
<div className="flex justify-between items-center gap-2" data-debug-id="job-card__status">
<span className="text-[10px] px-1.5 py-0.5 rounded border bg-muted text-muted-foreground font-mono">
<div className="flex items-center gap-2" data-debug-id="job-card__status">
<span className="text-[10px] px-1.5 py-0.5 rounded border bg-muted text-muted-foreground font-mono shrink-0">
{KIND_LABELS[kind]}
</span>
<span className={cn('text-xs px-2 py-0.5 rounded-full border font-medium', JOB_STATUS_COLORS[apiStatus])}>
{breadcrumb && (
<span className="truncate font-mono text-[10px] text-muted-foreground flex-1 min-w-0">
{breadcrumb}
</span>
)}
<span className={cn('text-xs px-2 py-0.5 rounded-full border font-medium shrink-0 ml-auto', JOB_STATUS_COLORS[apiStatus])}>
{JOB_STATUS_LABELS[apiStatus]}
</span>
</div>
@ -77,7 +100,7 @@ export default function JobCard({
<div className="flex items-end justify-between gap-2 mt-0.5" data-debug-id="job-card__actions">
<p className="text-xs text-muted-foreground truncate">{detailText}</p>
<span className="text-[10px] text-muted-foreground shrink-0 tabular-nums">
{new Date(createdAt).toLocaleString('nl-NL', { dateStyle: 'short', timeStyle: 'short' })}
{new Date(displayDate).toLocaleString('nl-NL', { dateStyle: 'short', timeStyle: 'short' })}
</span>
</div>
</div>

5
components/jobs/jobs-column.tsx
View file

@ -246,10 +246,15 @@ export default function JobsColumn({
sprintGoal={j.sprintGoal}
sprintCode={j.sprintCode}
productName={j.productName}
productCode={j.productCode}
pbiCode={j.pbiCode}
storyCode={j.storyCode}
branch={j.branch}
error={j.error}
summary={j.summary}
createdAt={j.createdAt}
startedAt={j.startedAt}
finishedAt={j.finishedAt}
isSelected={j.id === selectedJobId}
onClick={() => onSelect(j.id)}
/>