Files
ftdl/app/download/ApkTable.tsx
2026-03-04 22:17:31 +08:00

76 lines
2.5 KiB
TypeScript

'use client';
import { formatFileSize, formatDateTime } from '@/lib/utils';
interface Apk {
name: string;
commit: string | null;
size: number;
modifiedAt: string;
downloadUrl: string;
}
interface ApkTableProps {
apks: Apk[];
}
export default function ApkTable({ apks }: ApkTableProps) {
if (!apks || apks.length === 0) {
return (
<div className="bg-white rounded-lg shadow-md p-12 text-center">
<p className="text-gray-500"> APK </p>
</div>
);
}
return (
<div className="bg-white rounded-lg shadow-md overflow-hidden">
<table className="w-full">
<thead className="bg-gray-50 border-b border-gray-200">
<tr>
<th className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
Commit ID
</th>
<th className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
</th>
<th className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
</th>
<th className="px-6 py-3 text-right text-xs font-medium text-gray-500 uppercase tracking-wider">
</th>
</tr>
</thead>
<tbody className="bg-white divide-y divide-gray-200">
{apks.map((apk) => (
<tr key={apk.name} className="hover:bg-gray-50">
<td className="px-6 py-4 whitespace-nowrap">
<span className="font-mono text-sm text-gray-900">
{apk.commit || '-'}
</span>
</td>
<td className="px-6 py-4 whitespace-nowrap text-sm text-gray-900">
{formatFileSize(apk.size)}
</td>
<td className="px-6 py-4 whitespace-nowrap text-sm text-gray-900">
{formatDateTime(new Date(apk.modifiedAt))}
</td>
<td className="px-6 py-4 whitespace-nowrap text-right text-sm font-medium">
<a
href={apk.downloadUrl}
download
rel="noopener noreferrer"
className="inline-flex items-center px-4 py-2 bg-green-600 text-white rounded-md hover:bg-green-700 transition-colors"
>
</a>
</td>
</tr>
))}
</tbody>
</table>
</div>
);
}