Refactor code structure and remove redundant changes

src-old/components/moderation/QueueItemSkeleton.tsx

@@ -0,0 +1,49 @@
+import { Card, CardHeader, CardContent } from '@/components/ui/card';
+import { Skeleton } from '@/components/ui/skeleton';
+
+export function QueueItemSkeleton({ index = 0 }: { index?: number }) {
+  return (
+    <Card 
+      className="border-l-4 border-l-muted animate-in fade-in-0 slide-in-from-bottom-4"
+      style={{ 
+        animationDelay: `${index * 50}ms`,
+        animationDuration: '300ms',
+        animationFillMode: 'backwards'
+      }}
+    >
+      <CardHeader className="pb-4">
+        <div className="flex items-start justify-between gap-4">
+          {/* Left side: Entity type badge + title */}
+          <div className="flex-1 space-y-3">
+            <Skeleton className="h-5 w-24" /> {/* Badge */}
+            <Skeleton className="h-6 w-3/4" /> {/* Title */}
+            <div className="flex items-center gap-2">
+              <Skeleton className="h-4 w-4 rounded-full" /> {/* Avatar */}
+              <Skeleton className="h-4 w-32" /> {/* Username */}
+              <Skeleton className="h-4 w-24" /> {/* Date */}
+            </div>
+          </div>
+          
+          {/* Right side: Status badge */}
+          <Skeleton className="h-6 w-20" />
+        </div>
+      </CardHeader>
+      
+      <CardContent className="space-y-4">
+        {/* Content area */}
+        <div className="space-y-2">
+          <Skeleton className="h-4 w-full" />
+          <Skeleton className="h-4 w-5/6" />
+          <Skeleton className="h-4 w-4/6" />
+        </div>
+        
+        {/* Action buttons */}
+        <div className="flex gap-2 pt-4">
+          <Skeleton className="h-9 w-24" />
+          <Skeleton className="h-9 w-24" />
+          <Skeleton className="h-9 w-24" />
+        </div>
+      </CardContent>
+    </Card>
+  );
+}