34b0f2ade9
- Replace all rgba(6,182,212,...) cyan focus borders and accents with rgba(249,115,22,...) ember orange across 21+ component files - Remove all var(--glass-border) references (undefined variable) with var(--color-border-default) across 24 files - Remove deprecated blur orbs and glass-morphism effects from SurveyPage, SurveyThankYouPage, and LoginPage - Migrate landing.css from hardcoded hex to CSS custom properties (~97 replacements for single-source theming) - Fix off-palette grays in FlowPilotAnalyticsPage chart styling (#8891a0 → #848b9b, #18191f → var(--color-bg-card)) - Update stale comments: "cyan brand" → "accent brand" in GlowEdge, "gradient cyan square" → "gradient orange square" in BrandLogo - Rename glow-cyan SVG filter ID to glow-accent - Fix category color comment: "cyan" → "deep orange" Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
66 lines
2.5 KiB
TypeScript
66 lines
2.5 KiB
TypeScript
import { Link } from 'react-router-dom'
|
|
import { getTreeNavigatePath } from '@/lib/routing'
|
|
|
|
interface OpenSession {
|
|
id: string
|
|
treeName: string
|
|
treeId: string
|
|
treeType?: string
|
|
stepNumber?: number
|
|
totalSteps?: number
|
|
timeAgo: string
|
|
}
|
|
|
|
interface OpenSessionsProps {
|
|
sessions: OpenSession[]
|
|
}
|
|
|
|
export function OpenSessions({ sessions }: OpenSessionsProps) {
|
|
return (
|
|
<div className="card-flat flex flex-col h-full">
|
|
<div className="flex items-center justify-between px-5 py-3" style={{ borderBottom: '1px solid var(--color-border-default)' }}>
|
|
<h3 className="font-heading text-sm font-bold text-foreground">My Open Sessions</h3>
|
|
<Link to="/sessions" className="text-[0.6875rem] text-muted-foreground hover:text-foreground transition-colors">
|
|
View All
|
|
</Link>
|
|
</div>
|
|
<div className="flex-1 flex flex-col">
|
|
{sessions.length === 0 ? (
|
|
<div className="flex-1 flex items-center justify-center">
|
|
<p className="text-sm text-muted-foreground">No open sessions</p>
|
|
</div>
|
|
) : (
|
|
sessions.map((session, i) => (
|
|
<div
|
|
key={session.id}
|
|
className="flex items-center gap-3 px-5 py-3"
|
|
style={{
|
|
borderBottom: i < sessions.length - 1 ? '1px solid var(--color-border-default)' : undefined,
|
|
}}
|
|
>
|
|
<span className="h-2 w-2 shrink-0 rounded-full bg-amber-400" />
|
|
<div className="flex-1 min-w-0">
|
|
<div className="text-sm text-foreground truncate">{session.treeName}</div>
|
|
<div className="text-[0.6875rem] text-muted-foreground">
|
|
{session.stepNumber && session.totalSteps
|
|
? `Step ${session.stepNumber} of ${session.totalSteps}`
|
|
: 'In progress'}
|
|
<span className="mx-1.5 text-[var(--text-dimmed)]">·</span>
|
|
<span className="font-sans text-xs text-[0.625rem]">{session.timeAgo}</span>
|
|
</div>
|
|
</div>
|
|
<Link
|
|
to={getTreeNavigatePath(session.treeId, session.treeType)}
|
|
state={{ sessionId: session.id }}
|
|
className="shrink-0 rounded-lg border border-primary/40 px-3 py-1 text-[0.6875rem] font-medium text-primary hover:bg-primary/10 hover:border-primary/60 transition-colors"
|
|
>
|
|
Resume
|
|
</Link>
|
|
</div>
|
|
))
|
|
)}
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|