Fix: Implement comprehensive sort debugging and fixes

src/components/moderation/QueueSortControls.tsx

@@ -48,6 +48,11 @@ export const QueueSortControls = ({
           Sort By
         </Label>
       )}
+      <div className="flex items-center gap-2 text-xs text-muted-foreground mb-1">
+        <span>
+          Sorting by {getSortFieldLabel(sortConfig.field)} ({sortConfig.direction === 'asc' ? '↑ Ascending' : '↓ Descending'})
+        </span>
+      </div>
       <div className="flex gap-2">
         <Select 
           value={sortConfig.field} 

src/hooks/moderation/useModerationQueueManager.ts

@@ -222,12 +222,24 @@ export function useModerationQueueManager(config: ModerationQueueManagerConfig):
           )
         `,
           )
-          .order("escalated", { ascending: false })
-          .order(
+          .order("escalated", { ascending: false });
+        
+        // Map sort fields to correct database columns
+        const sortField = 
           sort.config.field === 'username' ? 'user_id' :
-            sort.config.field,
-            { ascending: sort.config.direction === 'asc' }
-          );
+          sort.config.field === 'created_at' ? 'submitted_at' :
+          sort.config.field;
+        
+        console.log('[Query] Sorting by:', {
+          originalField: sort.config.field,
+          mappedField: sortField,
+          direction: sort.config.direction,
+          ascending: sort.config.direction === 'asc'
+        });
+        
+        submissionsQuery = submissionsQuery.order(sortField, { 
+          ascending: sort.config.direction === 'asc' 
+        });
 
         // Apply tab-based status filtering
         const tab = filters.activeTab;
@@ -794,8 +806,19 @@ export function useModerationQueueManager(config: ModerationQueueManagerConfig):
 
   // Sort changes trigger refetch
   useEffect(() => {
-    if (!user || isMountingRef.current) return;
+    console.log('[Sort Effect] Triggered:', {
+      field: sort.config.field,
+      direction: sort.config.direction,
+      user: !!user,
+      isMounting: isMountingRef.current
+    });
     
+    if (!user || isMountingRef.current) {
+      console.log('[Sort Effect] Skipped due to guards');
+      return;
+    }
+
+    console.log('[Sort Effect] Executing refetch');
     pagination.reset();
     fetchItemsRef.current?.(true);
   // eslint-disable-next-line react-hooks/exhaustive-deps