mirror of
https://github.com/pacnpal/thrilltrack-explorer.git
synced 2025-12-20 15:51:12 -05:00
feat: Display photo submission details
This commit is contained in:
@@ -379,28 +379,87 @@ export function ModerationQueue() {
|
||||
</div>
|
||||
) : item.submission_type === 'photo' ? (
|
||||
<div>
|
||||
<div className="text-sm text-muted-foreground mb-2">
|
||||
<div className="text-sm text-muted-foreground mb-3">
|
||||
Photo Submission
|
||||
</div>
|
||||
{item.content.content?.url && (
|
||||
|
||||
{/* Submission Title */}
|
||||
{item.content.title && (
|
||||
<div className="mb-3">
|
||||
<img
|
||||
src={item.content.content.url}
|
||||
alt="Submitted photo"
|
||||
className="max-w-full h-auto max-h-64 rounded border"
|
||||
/>
|
||||
<div className="text-sm font-medium mb-1">Title:</div>
|
||||
<p className="text-sm">{item.content.title}</p>
|
||||
</div>
|
||||
)}
|
||||
{item.content.content?.caption && (
|
||||
<div className="mb-2">
|
||||
|
||||
{/* Submission Caption */}
|
||||
{item.content.caption && (
|
||||
<div className="mb-3">
|
||||
<div className="text-sm font-medium mb-1">Caption:</div>
|
||||
<p className="text-sm">{item.content.content.caption}</p>
|
||||
<p className="text-sm">{item.content.caption}</p>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* Photos */}
|
||||
{item.content.photos && item.content.photos.length > 0 ? (
|
||||
<div className="space-y-4">
|
||||
<div className="text-sm font-medium">Photos ({item.content.photos.length}):</div>
|
||||
{item.content.photos.map((photo: any, index: number) => (
|
||||
<div key={index} className="border rounded-lg p-3 space-y-2">
|
||||
<img
|
||||
src={photo.url}
|
||||
alt={`Photo ${index + 1}: ${photo.filename}`}
|
||||
className="w-full max-h-64 object-contain rounded border bg-muted/30"
|
||||
/>
|
||||
<div className="space-y-1 text-xs text-muted-foreground">
|
||||
<div className="flex justify-between">
|
||||
<span className="font-medium">Filename:</span>
|
||||
<span>{photo.filename || 'Unknown'}</span>
|
||||
</div>
|
||||
<div className="flex justify-between">
|
||||
<span className="font-medium">Size:</span>
|
||||
<span>{photo.size ? `${Math.round(photo.size / 1024)} KB` : 'Unknown'}</span>
|
||||
</div>
|
||||
<div className="flex justify-between">
|
||||
<span className="font-medium">Type:</span>
|
||||
<span>{photo.type || 'Unknown'}</span>
|
||||
</div>
|
||||
{photo.caption && (
|
||||
<div className="pt-1">
|
||||
<div className="font-medium">Caption:</div>
|
||||
<div className="text-sm text-foreground mt-1">{photo.caption}</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
) : (
|
||||
<div className="text-sm text-muted-foreground">
|
||||
No photos found in submission
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* Context Information */}
|
||||
{item.content.context && (
|
||||
<div className="mt-3 pt-3 border-t text-xs text-muted-foreground">
|
||||
<div className="flex justify-between">
|
||||
<span className="font-medium">Context:</span>
|
||||
<span className="capitalize">{item.content.context}</span>
|
||||
</div>
|
||||
{item.content.ride_id && (
|
||||
<div className="flex justify-between">
|
||||
<span className="font-medium">Ride ID:</span>
|
||||
<span className="font-mono">{item.content.ride_id}</span>
|
||||
</div>
|
||||
)}
|
||||
{item.content.park_id && (
|
||||
<div className="flex justify-between">
|
||||
<span className="font-medium">Park ID:</span>
|
||||
<span className="font-mono">{item.content.park_id}</span>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
<div className="text-xs text-muted-foreground">
|
||||
<div>Filename: {item.content.content?.filename || 'Unknown'}</div>
|
||||
<div>Size: {item.content.content?.size ? `${Math.round(item.content.content.size / 1024)} KB` : 'Unknown'}</div>
|
||||
</div>
|
||||
</div>
|
||||
) : (
|
||||
<div>
|
||||
|
||||
Reference in New Issue
Block a user