- Home sidebar icon: always cyan, bg-accent-dim only when route is "/" - Mobile TopBar: add left padding so hamburger isn't hidden behind logo - Landing page: bump card border color (#1e2130 → #2a2f3d) for better contrast - Replace all font-label references (40 occurrences, 19 files) with font-mono or font-sans - Remove deprecated --font-label CSS variable from index.css - Convert hardcoded hex in layout inline styles to CSS variables (light-mode ready) - Add @types/react-syntax-highlighter for script builder types Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
51 lines
1.7 KiB
TypeScript
51 lines
1.7 KiB
TypeScript
import { Check, X, Clock } from 'lucide-react'
|
|
import type { AISuggestion } from '@/types'
|
|
|
|
interface SuggestionsTabProps {
|
|
suggestions: AISuggestion[]
|
|
}
|
|
|
|
const STATUS_CONFIG = {
|
|
accepted: { icon: Check, color: 'text-emerald-400', label: 'Accepted' },
|
|
dismissed: { icon: X, color: 'text-rose-400', label: 'Dismissed' },
|
|
pending: { icon: Clock, color: 'text-amber-400', label: 'Pending' },
|
|
} as const
|
|
|
|
export function SuggestionsTab({ suggestions }: SuggestionsTabProps) {
|
|
if (suggestions.length === 0) {
|
|
return (
|
|
<div className="flex flex-1 items-center justify-center text-sm text-muted-foreground p-6">
|
|
No AI suggestions yet
|
|
</div>
|
|
)
|
|
}
|
|
|
|
return (
|
|
<div className="flex-1 overflow-y-auto px-3 py-3 space-y-2">
|
|
{suggestions.map((s) => {
|
|
const config = STATUS_CONFIG[s.status]
|
|
const StatusIcon = config.icon
|
|
return (
|
|
<div key={s.id} className="rounded-lg border border-border bg-card px-3 py-2">
|
|
<div className="flex items-center justify-between">
|
|
<span className="font-sans text-[0.625rem] uppercase tracking-widest text-muted-foreground">
|
|
{s.action_type.replace(/_/g, ' ')}
|
|
</span>
|
|
<span className={`flex items-center gap-1 text-xs ${config.color}`}>
|
|
<StatusIcon className="h-3 w-3" />
|
|
{config.label}
|
|
</span>
|
|
</div>
|
|
{s.target_node_id && (
|
|
<p className="mt-1 text-xs text-muted-foreground truncate">Node: {s.target_node_id}</p>
|
|
)}
|
|
<p className="mt-0.5 font-sans text-[0.625rem] text-text-muted">
|
|
{new Date(s.created_at).toLocaleDateString()}
|
|
</p>
|
|
</div>
|
|
)
|
|
})}
|
|
</div>
|
|
)
|
|
}
|