refactor: migrate FlowPilot components to Design System v4

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Michael Chihlas
2026-03-22 01:56:27 -04:00
parent 97a20a4225
commit 56ff792f8e
17 changed files with 219 additions and 221 deletions

View File

@@ -35,8 +35,8 @@ export function SimilarSessions({ sessionId }: SimilarSessionsProps) {
if (loading) {
return (
<div className="flex items-center gap-1.5 py-1">
<Loader2 size={10} className="animate-spin text-muted-foreground" />
<span className="text-[0.625rem] text-muted-foreground font-label">Loading similar sessions</span>
<Loader2 size={10} className="animate-spin text-[#848b9b]" />
<span className="text-[0.625rem] text-[#848b9b] font-sans text-xs">Loading similar sessions</span>
</div>
)
}
@@ -47,42 +47,42 @@ export function SimilarSessions({ sessionId }: SimilarSessionsProps) {
return (
<div className="space-y-2">
<h4 className="font-label text-[0.625rem] uppercase tracking-[0.1em] text-muted-foreground">
<h4 className="font-sans text-xs text-[0.625rem] uppercase tracking-[0.1em] text-[#848b9b]">
Similar Past Sessions
</h4>
{sessions.map((session) => (
<Link
key={session.id}
to={`/pilot/${session.id}`}
className="glass-card p-3 block hover:border-[rgba(255,255,255,0.12)] transition-all"
className="card-interactive p-3 block hover:border-[rgba(255,255,255,0.12)] transition-all"
>
<div className="flex items-start justify-between gap-2">
<p className="text-xs text-foreground line-clamp-2">
<p className="text-xs text-[#e2e5eb] line-clamp-2">
{session.problem_summary || 'Untitled session'}
</p>
<span className="text-[0.625rem] font-label text-primary shrink-0">
<span className="text-[0.625rem] font-sans text-xs text-[#22d3ee] shrink-0">
{Math.round(session.similarity * 100)}%
</span>
</div>
{session.resolution_summary && (
<p className="text-[0.625rem] text-muted-foreground mt-1 line-clamp-1">
<p className="text-[0.625rem] text-[#848b9b] mt-1 line-clamp-1">
{session.resolution_summary}
</p>
)}
<div className="flex items-center gap-2 mt-1.5">
{session.problem_domain && (
<span className="text-[0.5rem] font-label uppercase tracking-wider text-muted-foreground/70">
<span className="text-[0.5rem] font-sans text-xs uppercase tracking-wider text-[#848b9b]/70">
{session.problem_domain}
</span>
)}
<span
className={cn(
'text-[0.5rem] font-label uppercase',
'text-[0.5rem] font-sans text-xs uppercase',
session.status === 'resolved'
? 'text-emerald-400'
: session.status === 'escalated'
? 'text-amber-400'
: 'text-muted-foreground'
: 'text-[#848b9b]'
)}
>
{session.status}