Show session status as a badge on the detail page

Reuses SessionsTable's STATUS_VARIANT mapping (now exported) so the
detail page's status matches the table's badge instead of plain text.
Also drops the now-stale px-1.5 alignment padding on the meta lines
now that the title input carries no horizontal padding of its own.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01WzyfRyA7h5rs5SCAahLAWd
This commit is contained in:
2026-08-30 21:03:00 +02:00
co-authored by Claude Sonnet 5
parent 354c30d641
commit e9d5bb37d2
3 changed files with 9 additions and 6 deletions
+2 -2
View File
@@ -46,13 +46,13 @@ export function SessionTitleEditor({ sessionId, initialName }: { sessionId: numb
}, [status]);
return (
<div className="-ml-1.5 flex items-center gap-2">
<div className="flex items-center gap-2">
<input
value={value}
onChange={(e) => setValue(e.target.value)}
placeholder={`Session #${sessionId}`}
aria-label="Session name"
className="min-w-0 max-w-full border-b-2 border-transparent bg-transparent px-1.5 py-0.5 font-heading text-2xl font-semibold text-foreground outline-none transition-colors placeholder:text-muted-foreground/70 hover:border-b-border focus:border-b-primary [field-sizing:content]"
className="min-w-0 max-w-full border-b-2 border-transparent bg-transparent font-heading text-2xl font-semibold text-foreground outline-none transition-colors placeholder:text-muted-foreground/70 hover:border-b-border focus:border-b-primary [field-sizing:content]"
/>
<div className="relative flex size-4 shrink-0 items-center justify-center">
<Loader2
+1 -1
View File
@@ -25,7 +25,7 @@ export interface SessionRow {
durationMs: number | null;
}
const STATUS_VARIANT = {
export const STATUS_VARIANT = {
active: "default",
completed: "secondary",
aborted: "destructive",