123 lines
3.9 KiB
TypeScript
123 lines
3.9 KiB
TypeScript
import Link from 'next/link'
|
|
import type { RunSummary } from '@/lib/types/run'
|
|
|
|
type Props = { runs: RunSummary[] }
|
|
|
|
function DecisionBadge({ decision }: { decision: string }) {
|
|
const lower = decision.toLowerCase()
|
|
if (lower === 'buy') return <span className="badge-buy">{decision}</span>
|
|
if (lower === 'sell') return <span className="badge-sell">{decision}</span>
|
|
if (lower === 'hold') return <span className="badge-hold">{decision}</span>
|
|
return (
|
|
<span
|
|
className="px-2.5 py-1 rounded-full text-xs font-semibold"
|
|
style={{ backgroundColor: 'var(--bg-elevated)', color: 'var(--text-mid)' }}
|
|
>
|
|
{decision}
|
|
</span>
|
|
)
|
|
}
|
|
|
|
export default function RunHistoryTable({ runs }: Props) {
|
|
if (runs.length === 0) {
|
|
return (
|
|
<div
|
|
className="rounded-lg px-6 py-12 text-center"
|
|
style={{ backgroundColor: 'var(--bg-card)' }}
|
|
>
|
|
<p className="text-sm" style={{ color: 'var(--text-low)' }}>
|
|
No runs yet. Start a new analysis.
|
|
</p>
|
|
</div>
|
|
)
|
|
}
|
|
return (
|
|
<div
|
|
className="rounded-lg overflow-hidden"
|
|
style={{ backgroundColor: 'var(--bg-card)', border: '1px solid var(--border)' }}
|
|
>
|
|
<table className="w-full text-sm">
|
|
<thead>
|
|
<tr style={{ backgroundColor: 'var(--bg-elevated)' }}>
|
|
<th
|
|
className="apex-label px-5 py-3 text-left"
|
|
style={{ fontFamily: 'var(--font-manrope)' }}
|
|
>
|
|
Ticker
|
|
</th>
|
|
<th
|
|
className="apex-label px-5 py-3 text-left"
|
|
style={{ fontFamily: 'var(--font-manrope)' }}
|
|
>
|
|
Date
|
|
</th>
|
|
<th
|
|
className="apex-label px-5 py-3 text-left"
|
|
style={{ fontFamily: 'var(--font-manrope)' }}
|
|
>
|
|
Decision
|
|
</th>
|
|
<th
|
|
className="apex-label px-5 py-3 text-left"
|
|
style={{ fontFamily: 'var(--font-manrope)' }}
|
|
>
|
|
Created
|
|
</th>
|
|
<th className="px-5 py-3" />
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{runs.map((run) => (
|
|
<tr
|
|
key={run.id}
|
|
className="transition-colors duration-100"
|
|
style={{ borderTop: '1px solid var(--border)' }}
|
|
onMouseEnter={(e) =>
|
|
(e.currentTarget.style.backgroundColor = 'var(--bg-hover)')
|
|
}
|
|
onMouseLeave={(e) =>
|
|
(e.currentTarget.style.backgroundColor = '')
|
|
}
|
|
>
|
|
<td
|
|
className="px-5 py-4 font-mono font-semibold tracking-wider"
|
|
style={{ color: 'var(--text-high)' }}
|
|
>
|
|
{run.ticker}
|
|
</td>
|
|
<td className="px-5 py-4" style={{ color: 'var(--text-mid)' }}>
|
|
{run.date}
|
|
</td>
|
|
<td className="px-5 py-4">
|
|
{run.decision ? (
|
|
<DecisionBadge decision={run.decision} />
|
|
) : (
|
|
<span style={{ color: 'var(--text-low)' }}>—</span>
|
|
)}
|
|
</td>
|
|
<td className="px-5 py-4 text-xs" style={{ color: 'var(--text-mid)' }}>
|
|
{new Date(run.created_at).toLocaleString()}
|
|
</td>
|
|
<td className="px-5 py-4">
|
|
<Link
|
|
href={`/runs/${run.id}`}
|
|
className="text-xs font-medium transition-colors"
|
|
style={{ color: 'var(--accent)' }}
|
|
onMouseEnter={(e) =>
|
|
(e.currentTarget.style.color = 'var(--accent-light)')
|
|
}
|
|
onMouseLeave={(e) =>
|
|
(e.currentTarget.style.color = 'var(--accent)')
|
|
}
|
|
>
|
|
View Report →
|
|
</Link>
|
|
</td>
|
|
</tr>
|
|
))}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
)
|
|
}
|