mirror of
https://github.com/luxfi/mpc.git
synced 2026-09-24 00:26:24 +00:00
zeekay
a648eaec80
The dashboard had its own header, its own user menu (components/layout/user-menu.tsx) and its own branding table (lib/branding.ts) that mapped a hostname to a brand a second time — a copy of what @luxfi/ui/white-label already answers, and one that drifted (it had no bootno.de row and pointed zoo at the wrong issuer). Both are deleted. The nav is now `AppNav` from @luxfi/ui: brand, org switcher, links, settings and the user menu, with the links collapsing into the same gui Sheet the switchers use instead of the old `hidden md:flex` that simply vanished on a phone with nothing to replace it. Identity comes from IdentityProvider (IAM: get-account / get-organizations / get-organization-projects). Credentials stay with @hanzo/iam — one PKCE flow and one token store per surface; the chrome borrows only signIn and signOut. `next build` passes: 60 routes.
62 lines
2.1 KiB
TypeScript
62 lines
2.1 KiB
TypeScript
export interface PaymentRecord {
|
|
id: string
|
|
txHash: string
|
|
amount: string
|
|
token: string
|
|
status: 'confirmed' | 'pending' | 'failed'
|
|
paidAt: string
|
|
}
|
|
|
|
export interface PaymentHistoryProps {
|
|
payments: PaymentRecord[]
|
|
}
|
|
|
|
const statusColors: Record<string, string> = {
|
|
confirmed: 'bg-green-600/20 text-green-500',
|
|
pending: 'bg-[var(--muted)] text-[var(--color-status-warn)]',
|
|
failed: 'bg-red-600/20 text-red-400',
|
|
}
|
|
|
|
export function PaymentHistory({ payments }: PaymentHistoryProps) {
|
|
if (payments.length === 0) {
|
|
return (
|
|
<div className="rounded-lg border border-border p-8 text-center text-sm text-muted-foreground">
|
|
No payments recorded yet.
|
|
</div>
|
|
)
|
|
}
|
|
|
|
return (
|
|
<div className="overflow-x-auto rounded-lg border border-border">
|
|
<table className="w-full text-sm">
|
|
<thead>
|
|
<tr className="border-b border-border bg-muted/50">
|
|
<th className="px-4 py-3 text-left font-medium text-muted-foreground">Date</th>
|
|
<th className="px-4 py-3 text-right font-medium text-muted-foreground">Amount</th>
|
|
<th className="px-4 py-3 text-left font-medium text-muted-foreground">Status</th>
|
|
<th className="px-4 py-3 text-left font-medium text-muted-foreground">Tx Hash</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{payments.map((p) => (
|
|
<tr key={p.id} className="border-b border-border last:border-0 hover:bg-muted/20">
|
|
<td className="px-4 py-3 text-muted-foreground">
|
|
{new Date(p.paidAt).toLocaleDateString()}
|
|
</td>
|
|
<td className="px-4 py-3 text-right font-mono">{p.amount}</td>
|
|
<td className="px-4 py-3">
|
|
<span className={`rounded-full px-2 py-0.5 text-xs font-medium ${statusColors[p.status] ?? ''}`}>
|
|
{p.status}
|
|
</span>
|
|
</td>
|
|
<td className="px-4 py-3 font-mono text-xs">
|
|
<span className="truncate block max-w-[200px]">{p.txHash}</span>
|
|
</td>
|
|
</tr>
|
|
))}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
)
|
|
}
|