janpeter visser
b71a1a7328
- api-auth.ts was al aanwezig; demo-check toegevoegd per endpoint (ST-401) - Token aanmaken (SHA-256 hash, eenmalig tonen), intrekken, max 10 (ST-402) - GET /api/products actieve productenlijst (ST-403) - GET /api/products/:id/next-story hoogst geprioriteerde open story (ST-404) - GET /api/sprints/:id/tasks met limit parameter (ST-405) - PATCH /api/stories/:id/tasks/reorder met ID-validatie (ST-406) - POST /api/stories/:id/log met discriminatedUnion per type (ST-407) - PATCH /api/tasks/:id status bijwerken met cross-user bescherming (ST-408) - POST /api/todos via API aanmaken (ST-409) - StoryLog component met kleurcodering per type in story slide-over (ST-410) Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
103 lines
3.2 KiB
TypeScript
103 lines
3.2 KiB
TypeScript
interface StoryLogEntry {
|
|
id: string
|
|
type: string
|
|
content: string
|
|
status: string | null
|
|
commit_hash: string | null
|
|
commit_message: string | null
|
|
created_at: string
|
|
}
|
|
|
|
interface StoryLogProps {
|
|
logs: StoryLogEntry[]
|
|
repoUrl?: string | null
|
|
}
|
|
|
|
const TYPE_STYLES: Record<string, { bg: string; label: string; labelColor: string }> = {
|
|
IMPLEMENTATION_PLAN: {
|
|
bg: 'bg-info-container/50 border-info/20',
|
|
label: 'Implementatieplan',
|
|
labelColor: 'text-info',
|
|
},
|
|
TEST_RESULT: {
|
|
bg: 'bg-surface-container border-border',
|
|
label: 'Testresultaat',
|
|
labelColor: 'text-foreground',
|
|
},
|
|
COMMIT: {
|
|
bg: 'bg-secondary-container/30 border-secondary/20',
|
|
label: 'Commit',
|
|
labelColor: 'text-secondary',
|
|
},
|
|
}
|
|
|
|
export function StoryLog({ logs, repoUrl }: StoryLogProps) {
|
|
if (logs.length === 0) {
|
|
return (
|
|
<p className="text-sm text-muted-foreground text-center py-4">
|
|
Nog geen activiteit. Gebruik de REST API om logs toe te voegen.
|
|
</p>
|
|
)
|
|
}
|
|
|
|
return (
|
|
<div className="space-y-3">
|
|
{logs.map(log => {
|
|
const style = TYPE_STYLES[log.type] ?? TYPE_STYLES.IMPLEMENTATION_PLAN
|
|
const isTestResult = log.type === 'TEST_RESULT'
|
|
const testPassed = log.status === 'PASSED'
|
|
|
|
return (
|
|
<div
|
|
key={log.id}
|
|
className={`rounded-lg border p-3 space-y-1.5 ${
|
|
isTestResult
|
|
? testPassed
|
|
? 'bg-success-container/40 border-success/20'
|
|
: 'bg-error-container/40 border-error/20'
|
|
: style.bg
|
|
}`}
|
|
>
|
|
<div className="flex items-center justify-between">
|
|
<span className={`text-xs font-semibold ${
|
|
isTestResult ? (testPassed ? 'text-success' : 'text-error') : style.labelColor
|
|
}`}>
|
|
{style.label}
|
|
{isTestResult && ` — ${testPassed ? 'Geslaagd' : 'Mislukt'}`}
|
|
</span>
|
|
<span className="text-xs text-muted-foreground">
|
|
{new Date(log.created_at).toLocaleDateString('nl-NL', {
|
|
day: 'numeric', month: 'short', hour: '2-digit', minute: '2-digit',
|
|
})}
|
|
</span>
|
|
</div>
|
|
|
|
<p className="text-sm text-foreground whitespace-pre-line">{log.content}</p>
|
|
|
|
{log.commit_hash && (
|
|
<div className="flex items-center gap-2 mt-1">
|
|
{repoUrl ? (
|
|
<a
|
|
href={`${repoUrl}/commit/${log.commit_hash}`}
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
className="text-xs font-mono text-secondary hover:underline"
|
|
>
|
|
{log.commit_hash.slice(0, 7)}
|
|
</a>
|
|
) : (
|
|
<code className="text-xs font-mono text-secondary">
|
|
{log.commit_hash.slice(0, 7)}
|
|
</code>
|
|
)}
|
|
{log.commit_message && (
|
|
<span className="text-xs text-muted-foreground truncate">{log.commit_message}</span>
|
|
)}
|
|
</div>
|
|
)}
|
|
</div>
|
|
)
|
|
})}
|
|
</div>
|
|
)
|
|
}
|