Refactor: Complete Photo System Refactor

src/components/moderation/ItemReviewCard.tsx

@@ -4,6 +4,7 @@ import { Button } from '@/components/ui/button';
 import { Edit, MapPin, Zap, Building2, Image, Package } from 'lucide-react';
 import { type SubmissionItemWithDeps } from '@/lib/submissionItemsService';
 import { useIsMobile } from '@/hooks/use-mobile';
+import { PhotoSubmissionDisplay } from './PhotoSubmissionDisplay';
 
 interface ItemReviewCardProps {
   item: SubmissionItemWithDeps;
@@ -94,21 +95,8 @@ export function ItemReviewCard({ item, onEdit, onStatusChange }: ItemReviewCardP
       case 'photo':
         return (
           <div className="space-y-2">
-            <div className={`grid gap-2 ${isMobile ? 'grid-cols-2' : 'grid-cols-3'}`}>
-              {data.photos?.slice(0, isMobile ? 2 : 3).map((photo: any, idx: number) => (
-                <img
-                  key={idx}
-                  src={photo.url}
-                  alt={photo.caption || 'Submission photo'}
-                  className={`w-full object-cover rounded ${isMobile ? 'h-24' : 'h-20'}`}
-                />
-              ))}
-            </div>
-            {data.photos?.length > (isMobile ? 2 : 3) && (
-              <p className="text-sm text-muted-foreground">
-                +{data.photos.length - (isMobile ? 2 : 3)} more photo(s)
-              </p>
-            )}
+            {/* Fetch and display from photo_submission_items */}
+            <PhotoSubmissionDisplay submissionId={data.submission_id} />
           </div>
         );