From 592a2ea9e9e2b526c690c70e2409e31af1acc870 Mon Sep 17 00:00:00 2001
From: "gpt-engineer-app[bot]"
 <159125892+gpt-engineer-app[bot]@users.noreply.github.com>
Date: Fri, 10 Oct 2025 17:07:59 +0000
Subject: [PATCH] Fix ReportsQueue build errors

---
 src/components/moderation/ReportsQueue.tsx | 11 +++++++----
 1 file changed, 7 insertions(+), 4 deletions(-)

diff --git a/src/components/moderation/ReportsQueue.tsx b/src/components/moderation/ReportsQueue.tsx
index f4aeab02..169a4c34 100644
--- a/src/components/moderation/ReportsQueue.tsx
+++ b/src/components/moderation/ReportsQueue.tsx
@@ -348,6 +348,11 @@ export const ReportsQueue = forwardRef<ReportsQueueRef>((props, ref) => {
     );
   }
 
+  // Apply client-side sorting
+  const sortedReports = useMemo(() => {
+    return sortReports(reports, sortConfig);
+  }, [reports, sortConfig]);
+
   return (
     <div className="space-y-6">
       {/* New Reports Notification */}
@@ -419,10 +424,8 @@ export const ReportsQueue = forwardRef<ReportsQueueRef>((props, ref) => {
         )}
       </div>
 
-      {/* Apply sorting before rendering */}
-      {useMemo(() => {
-        const sortedReports = sortReports(reports, sortConfig);
-        return sortedReports.map((report) => (
+      {/* Report Cards */}
+      {sortedReports.map((report) => (
         <Card key={report.id} className="border-l-4 border-l-red-500">
           <CardHeader className="pb-4">
             <div className="flex items-center justify-between">