Fix: Memoize settings and add defensive checks

src/components/moderation/ModerationQueue.tsx

@@ -1,4 +1,4 @@
-import { useState, useImperativeHandle, forwardRef } from 'react';
+import { useState, useImperativeHandle, forwardRef, useMemo } from 'react';
 import { Card, CardContent } from '@/components/ui/card';
 import { useToast } from '@/hooks/use-toast';
 import { useUserRole } from '@/hooks/useUserRole';
@@ -28,20 +28,30 @@ export const ModerationQueue = forwardRef<ModerationQueueRef>((props, ref) => {
   const { isAdmin, isSuperuser } = useUserRole();
   const adminSettings = useAdminSettings();
   
-  // Initialize queue manager (replaces all state management, fetchItems, effects)
-  const queueManager = useModerationQueueManager({
-    user,
-    isAdmin: isAdmin(),
-    isSuperuser: isSuperuser(),
-    toast,
-    settings: {
+  // Memoize settings to prevent unnecessary effect re-runs
+  const settings = useMemo(() => ({
     refreshMode: adminSettings.getAdminPanelRefreshMode(),
     pollInterval: adminSettings.getAdminPanelPollInterval(),
     refreshStrategy: adminSettings.getAutoRefreshStrategy(),
     preserveInteraction: adminSettings.getPreserveInteractionState(),
     useRealtimeQueue: adminSettings.getUseRealtimeQueue(),
     refreshOnTabVisible: adminSettings.getRefreshOnTabVisible(),
-    }
+  }), [
+    adminSettings.getAdminPanelRefreshMode(),
+    adminSettings.getAdminPanelPollInterval(),
+    adminSettings.getAutoRefreshStrategy(),
+    adminSettings.getPreserveInteractionState(),
+    adminSettings.getUseRealtimeQueue(),
+    adminSettings.getRefreshOnTabVisible(),
+  ]);
+  
+  // Initialize queue manager (replaces all state management, fetchItems, effects)
+  const queueManager = useModerationQueueManager({
+    user,
+    isAdmin: isAdmin(),
+    isSuperuser: isSuperuser(),
+    toast,
+    settings,
   });
   
   // UI-only state

src/hooks/moderation/useModerationQueueManager.ts

@@ -794,13 +794,23 @@ export function useModerationQueueManager(
   
   // Visibility change handler
   useEffect(() => {
+    console.log('🔍 Visibility effect running - refreshOnTabVisible:', settings.refreshOnTabVisible);
+    
     // Early return if feature is disabled
     if (!settings.refreshOnTabVisible) {
       console.log('⚙️ refreshOnTabVisible is DISABLED - no listener attached');
       return;
     }
     
+    console.log('✅ refreshOnTabVisible is ENABLED - attaching listener');
+    
     const handleVisibilityChange = () => {
+      // Double-check setting before doing anything (defensive check)
+      if (!settings.refreshOnTabVisible) {
+        console.log('⚠️ Visibility handler called but setting is disabled - ignoring');
+        return;
+      }
+      
       if (document.hidden) {
         console.log('📴 Tab hidden - pausing queue updates');
         pauseFetchingRef.current = true;