feat: add ApkCard component

This commit is contained in:
2026-03-04 02:08:50 +08:00
parent df5c0b4237
commit 99694cbc4c

51
app/download/ApkCard.tsx Normal file
View File

@@ -0,0 +1,51 @@
// app/download/ApkCard.tsx
import { formatFileSize, formatDateTime } from '@/lib/fs-utils';
interface ApkCardProps {
name: string;
commit: string | null;
size: number;
modifiedAt: string;
downloadUrl: string;
highlightCommit?: string;
}
export default function ApkCard({ name, commit, size, modifiedAt, downloadUrl, highlightCommit }: ApkCardProps) {
// 高亮显示 commit id
const displayName = commit && highlightCommit
? name.replace(new RegExp(commit, 'gi'), (match) => `<mark class="bg-yellow-200">${match}</mark>`)
: name;
return (
<div className="bg-white border border-gray-200 rounded-lg p-4 hover:shadow-md transition-shadow">
<h3
className="text-lg font-semibold text-gray-800 mb-2 break-all"
dangerouslySetInnerHTML={{ __html: displayName }}
/>
<div className="space-y-1 text-sm text-gray-600 mb-4">
<div className="flex justify-between">
<span>:</span>
<span className="font-medium">{formatFileSize(size)}</span>
</div>
<div className="flex justify-between">
<span>:</span>
<span className="font-medium">{formatDateTime(new Date(modifiedAt))}</span>
</div>
{commit && (
<div className="flex justify-between">
<span>Commit:</span>
<span className="font-medium font-mono">{commit}</span>
</div>
)}
</div>
<a
href={downloadUrl}
className="block w-full text-center bg-green-600 text-white py-2 px-4 rounded-md hover:bg-green-700 transition-colors"
>
APK
</a>
</div>
);
}