53 lines
1.5 KiB
TypeScript
53 lines
1.5 KiB
TypeScript
'use client'
|
|
|
|
import type { EvidenceStage } from '@/lib/storage/evidence'
|
|
|
|
type EvidenceFile = {
|
|
id: string
|
|
stage: string
|
|
file_url: string
|
|
file_type: string
|
|
uploaded_at: string
|
|
}
|
|
|
|
interface Props {
|
|
files: EvidenceFile[]
|
|
stage?: EvidenceStage
|
|
}
|
|
|
|
function isImage(type: string) { return type.startsWith('image/') }
|
|
function isVideo(type: string) { return type.startsWith('video/') }
|
|
|
|
|
|
export function EvidenceGallery({ files, stage }: Props) {
|
|
const filtered = stage ? files.filter(f => f.stage === stage) : files
|
|
if (filtered.length === 0) return <p className="text-sm text-gray-400">No files for this stage</p>
|
|
|
|
return (
|
|
<div className="grid grid-cols-2 gap-2 sm:grid-cols-3">
|
|
{filtered.map(file => (
|
|
<a
|
|
key={file.id}
|
|
href={file.file_url}
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
className="block rounded-lg overflow-hidden bg-gray-100 aspect-square hover:opacity-90 transition-opacity"
|
|
>
|
|
{isImage(file.file_type) ? (
|
|
<img
|
|
src={file.file_url}
|
|
alt="Evidence"
|
|
loading="lazy"
|
|
className="w-full h-full object-cover"
|
|
/>
|
|
) : isVideo(file.file_type) ? (
|
|
<div className="w-full h-full flex items-center justify-center text-3xl">🎥</div>
|
|
) : (
|
|
<div className="w-full h-full flex items-center justify-center text-3xl">📄</div>
|
|
)}
|
|
</a>
|
|
))}
|
|
</div>
|
|
)
|
|
}
|