Refactor: Implement all refresh settings

src/components/moderation/ModerationQueue.tsx

@@ -936,14 +936,40 @@ export const ModerationQueue = forwardRef<ModerationQueueRef>((props, ref) => {
                 locked_until: submission.locked_until || undefined,
               };
               
-              // Add to pending items
+              // Check auto-refresh strategy
-              setPendingNewItems(prev => {
+              const strategy = refreshStrategyRef.current;
-                if (prev.some(p => p.id === fullItem.id)) return prev;
-                return [...prev, fullItem];
-              });
-              setNewItemsCount(prev => prev + 1);
               
-              // Toast notification
+              if (strategy === 'notify') {
+                console.log('📢 NEW submission detected - showing notification only (strategy: notify)');
+                toast({
+                  title: '🆕 New Submission',
+                  description: `${fullItem.submission_type} - ${fullItem.entity_name}`,
+                  action: (
+                    <Button size="sm" onClick={() => {
+                      setItems(prev => [fullItem, ...prev]);
+                      setNewItemsCount(prev => Math.max(0, prev - 1));
+                    }}>
+                      Show
+                    </Button>
+                  ),
+                });
+                setNewItemsCount(prev => prev + 1);
+                return; // Don't add to queue
+              }
+              
+              if (strategy === 'replace') {
+                console.log('🔄 NEW submission detected - full replacement (strategy: replace)');
+                toast({
+                  title: '🆕 New Submission',
+                  description: 'Refreshing queue...',
+                });
+                fetchItems(filtersRef.current.entityFilter, filtersRef.current.statusFilter, true, activeTabRef.current);
+                return;
+              }
+              
+              // strategy === 'merge' (default behavior - seamlessly add to existing list)
+              console.log('➕ NEW submission detected - merging into queue (strategy: merge)');
+              setItems(prev => [fullItem, ...prev]);
               toast({
                 title: '🆕 New Submission',
                 description: `${fullItem.submission_type} - ${fullItem.entity_name}`,
@@ -1138,6 +1164,50 @@ export const ModerationQueue = forwardRef<ModerationQueueRef>((props, ref) => {
                     }
                     
                     console.log('🔄 Realtime UPDATE: Changes detected for', fullItem.id);
+                    
+                    // Check auto-refresh strategy
+                    const strategy = refreshStrategyRef.current;
+                    
+                    if (strategy === 'notify') {
+                      console.log('📢 UPDATE detected - showing notification only (strategy: notify)');
+                      toastRef.current({
+                        title: '🔄 Submission Updated',
+                        description: `Submission has been updated`,
+                        action: (
+                          <Button size="sm" onClick={() => {
+                            setItems(prevItems => prevItems.map(item => {
+                              if (item.id !== fullItem.id) return item;
+                              const updates: Partial<ModerationItem> = {};
+                              if (item.status !== fullItem.status) updates.status = fullItem.status;
+                              if (item.reviewed_at !== fullItem.reviewed_at) updates.reviewed_at = fullItem.reviewed_at;
+                              if (item.reviewer_notes !== fullItem.reviewer_notes) updates.reviewer_notes = fullItem.reviewer_notes;
+                              if (item.assigned_to !== fullItem.assigned_to) updates.assigned_to = fullItem.assigned_to;
+                              if (item.locked_until !== fullItem.locked_until) updates.locked_until = fullItem.locked_until;
+                              if (item.escalated !== fullItem.escalated) updates.escalated = fullItem.escalated;
+                              if (contentChanged) updates.content = fullItem.content;
+                              if (fullItem.submission_items) updates.submission_items = fullItem.submission_items;
+                              return Object.keys(updates).length > 0 ? { ...item, ...updates } : item;
+                            }));
+                          }}>
+                            Refresh
+                          </Button>
+                        ),
+                      });
+                      return prev; // Don't update queue
+                    }
+                    
+                    if (strategy === 'replace') {
+                      console.log('🔄 UPDATE detected - full replacement (strategy: replace)');
+                      toastRef.current({
+                        title: '🔄 Submission Updated',
+                        description: 'Refreshing queue...',
+                      });
+                      fetchItems(filtersRef.current.entityFilter, filtersRef.current.statusFilter, true, activeTabRef.current);
+                      return prev;
+                    }
+                    
+                    // strategy === 'merge' (default - seamlessly update in place)
+                    console.log('🔄 Realtime UPDATE: Merging changes (strategy: merge)');
                     // Update ONLY changed fields to preserve object stability
                     return prev.map(i => {
                       if (i.id !== fullItem.id) return i;
@@ -1182,16 +1252,18 @@ export const ModerationQueue = forwardRef<ModerationQueueRef>((props, ref) => {
         console.log('📴 Tab hidden - pausing queue updates');
         pauseFetchingRef.current = true;
       } else {
-        console.log('📱 Tab visible - resuming queue updates');
+        console.log('📱 Tab visible - checking admin settings');
-        pauseFetchingRef.current = false;
         
         // Check admin setting for auto-refresh behavior
         const shouldRefresh = refreshOnTabVisibleRef.current;
         
         if (shouldRefresh && initialFetchCompleteRef.current && !isMountingRef.current) {
-          console.log('🔄 Tab became visible - triggering refresh (admin setting enabled)');
+          console.log('🔄 Tab became visible - triggering refresh (setting enabled)');
+          pauseFetchingRef.current = false; // Only unpause when refreshing
           fetchItems(filtersRef.current.entityFilter, filtersRef.current.statusFilter, true, activeTabRef.current);
         } else {
+          console.log('⛔ Tab became visible - refresh BLOCKED by admin settings (keeping fetch paused)');
+          // Keep pauseFetchingRef.current = true to prevent ANY mechanism from triggering fetches
           console.log('✅ Tab became visible - resuming without refresh');
           // Realtime subscriptions will handle updates naturally
         }