66 lines
3.2 KiB
TypeScript
66 lines
3.2 KiB
TypeScript
'use client';
|
|
|
|
import { FirmwareUpdate } from '@/lib/api';
|
|
import { Archive, Download, Clock } from 'lucide-react';
|
|
|
|
interface FirmwareListProps {
|
|
updates: FirmwareUpdate[];
|
|
}
|
|
|
|
export function FirmwareList({ updates }: FirmwareListProps) {
|
|
return (
|
|
<div className="bg-zinc-900/50 backdrop-blur-md border border-zinc-800 rounded-xl p-6 shadow-xl h-full">
|
|
<h2 className="text-xl font-semibold text-white mb-4 flex items-center gap-2">
|
|
<Archive className="w-5 h-5 text-indigo-400" />
|
|
Firmware Versions
|
|
</h2>
|
|
<div className="overflow-x-auto">
|
|
<table className="w-full text-left">
|
|
<thead>
|
|
<tr className="border-b border-zinc-800 text-zinc-400 text-sm">
|
|
<th className="pb-3 pl-2">Version</th>
|
|
<th className="pb-3">Description</th>
|
|
<th className="pb-3">Uploaded</th>
|
|
<th className="pb-3 text-right">Action</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody className="divide-y divide-zinc-800/50">
|
|
{updates.map((fw) => (
|
|
<tr key={fw.id} className="text-zinc-300 hover:bg-zinc-800/30 transition-colors">
|
|
<td className="py-3 pl-2">
|
|
<span className="font-mono text-indigo-300 bg-indigo-500/10 px-2 py-1 rounded border border-indigo-500/20 text-xs">
|
|
v{fw.version}
|
|
</span>
|
|
</td>
|
|
<td className="py-3 text-sm text-zinc-400">{fw.description || '-'}</td>
|
|
<td className="py-3 text-sm text-zinc-500">
|
|
<div className="flex items-center gap-1.5">
|
|
<Clock className="w-3 h-3" />
|
|
{new Date(fw.uploadedAt).toLocaleDateString()}
|
|
</div>
|
|
</td>
|
|
<td className="py-3 text-right">
|
|
<a
|
|
href={`http://localhost:5000/api/vehicles/updates/${fw.id}/download`}
|
|
target="_blank"
|
|
className="inline-flex items-center gap-1.5 text-xs bg-zinc-800 hover:bg-zinc-700 text-white px-2 py-1.5 rounded transition-colors"
|
|
>
|
|
<Download className="w-3 h-3" /> Bin
|
|
</a>
|
|
</td>
|
|
</tr>
|
|
))}
|
|
{updates.length === 0 && (
|
|
<tr>
|
|
<td colSpan={4} className="text-center py-8 text-zinc-500">
|
|
No firmware available.
|
|
</td>
|
|
</tr>
|
|
)}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|