Refactor code structure and remove redundant changes

src-old/components/moderation/renderers/ReviewDisplay.tsx

@@ -0,0 +1,71 @@
+import { memo } from 'react';
+import { PhotoGrid } from '@/components/common/PhotoGrid';
+import { normalizePhotoData } from '@/lib/photoHelpers';
+import type { PhotoItem } from '@/types/photos';
+import type { PhotoForDisplay, ModerationItem } from '@/types/moderation';
+
+interface ReviewDisplayProps {
+  item: ModerationItem;
+  isMobile: boolean;
+  onOpenPhotos: (photos: PhotoForDisplay[], index: number) => void;
+}
+
+export const ReviewDisplay = memo(({ item, isMobile, onOpenPhotos }: ReviewDisplayProps) => {
+  return (
+    <div>
+      {item.content.title && (
+        <h4 className="font-semibold mb-2">{item.content.title}</h4>
+      )}
+      {item.content.content && (
+        <p className="text-sm mb-2">{item.content.content}</p>
+      )}
+      <div className="flex items-center gap-2 text-sm text-muted-foreground mb-2">
+        <span>Rating: {item.content.rating}/5</span>
+      </div>
+      
+      {/* Entity Names for Reviews */}
+      {(item.entity_name || item.park_name) && (
+        <div className="space-y-1 mb-2">
+          {item.entity_name && (
+            <div className="text-sm text-muted-foreground">
+              <span className="text-xs">{item.park_name ? 'Ride:' : 'Park:'} </span>
+              <span className="text-base font-medium text-foreground">{item.entity_name}</span>
+            </div>
+          )}
+          {item.park_name && (
+            <div className="text-sm text-muted-foreground">
+              <span className="text-xs">Park: </span>
+              <span className="text-base font-medium text-foreground">{item.park_name}</span>
+            </div>
+          )}
+        </div>
+      )}
+      
+      {item.content.photos && item.content.photos.length > 0 && (() => {
+        const reviewPhotos: PhotoItem[] = normalizePhotoData({
+          type: 'review',
+          photos: item.content.photos
+        });
+        
+        return (
+          <div className="mt-3">
+            <div className="text-sm font-medium mb-2">Attached Photos:</div>
+            <PhotoGrid 
+              photos={reviewPhotos}
+              onPhotoClick={(photos, index) => onOpenPhotos(photos as any, index)}
+              maxDisplay={isMobile ? 3 : 4}
+              className="grid-cols-2 md:grid-cols-3"
+            />
+            {item.content.photos[0]?.caption && (
+              <p className="text-sm text-muted-foreground mt-2">
+                {item.content.photos[0].caption}
+              </p>
+            )}
+          </div>
+        );
+      })()}
+    </div>
+  );
+});
+
+ReviewDisplay.displayName = 'ReviewDisplay';