Fix real-time stats and submission refresh

src/components/moderation/ModerationQueue.tsx

@@ -348,12 +348,89 @@ export const ModerationQueue = forwardRef<ModerationQueueRef>((props, ref) => {
 
   // Set up realtime subscriptions
   const { connectionState: submissionsConnectionState, reconnect: reconnectSubmissions } = useRealtimeSubmissions({
-    onInsert: (payload) => {
-      toast({
-        title: 'New Submission',
-        description: 'A new content submission has been added',
-      });
-      fetchItems(activeEntityFilter, activeStatusFilter);
+    onInsert: async (payload) => {
+      const newSubmission = payload.new;
+      
+      // Only add if it matches current filters
+      const matchesStatusFilter = 
+        activeStatusFilter === 'all' ||
+        (activeStatusFilter === 'pending' && (newSubmission.status === 'pending' || newSubmission.status === 'partially_approved')) ||
+        activeStatusFilter === newSubmission.status;
+      
+      const matchesEntityFilter = 
+        activeEntityFilter === 'all' ||
+        (activeEntityFilter === 'submissions' && newSubmission.submission_type !== 'photo') ||
+        (activeEntityFilter === 'photos' && newSubmission.submission_type === 'photo');
+      
+      if (!matchesStatusFilter || !matchesEntityFilter) return;
+      
+      // Fetch minimal data for the new submission
+      try {
+        const { data: profile } = await supabase
+          .from('profiles')
+          .select('user_id, username, display_name, avatar_url')
+          .eq('user_id', newSubmission.user_id)
+          .single();
+        
+        // Fetch entity name if photo submission
+        let entity_name, park_name;
+        if (newSubmission.submission_type === 'photo' && newSubmission.content) {
+          const contentObj = newSubmission.content as any;
+          const contextType = typeof contentObj.context === 'string' ? contentObj.context : null;
+          const entityId = contentObj.entity_id || contentObj.ride_id || contentObj.park_id || contentObj.company_id;
+          
+          if (contextType === 'ride' && entityId) {
+            const { data: rideData } = await supabase
+              .from('rides')
+              .select('name, parks:park_id(name)')
+              .eq('id', entityId)
+              .single();
+            if (rideData) {
+              entity_name = rideData.name;
+              park_name = rideData.parks?.name;
+            }
+          } else if (contextType === 'park' && entityId) {
+            const { data: parkData } = await supabase
+              .from('parks')
+              .select('name')
+              .eq('id', entityId)
+              .single();
+            if (parkData) entity_name = parkData.name;
+          } else if (['manufacturer', 'operator', 'designer', 'property_owner'].includes(contextType) && entityId) {
+            const { data: companyData } = await supabase
+              .from('companies')
+              .select('name')
+              .eq('id', entityId)
+              .single();
+            if (companyData) entity_name = companyData.name;
+          }
+        }
+        
+        // Create new item and prepend to list
+        const newItem: ModerationItem = {
+          id: newSubmission.id,
+          type: 'content_submission',
+          content: newSubmission.submission_type === 'photo' ? newSubmission.content : newSubmission,
+          created_at: newSubmission.created_at,
+          user_id: newSubmission.user_id,
+          status: newSubmission.status,
+          submission_type: newSubmission.submission_type,
+          user_profile: profile || undefined,
+          entity_name,
+          park_name,
+        };
+        
+        setItems(prevItems => [newItem, ...prevItems]);
+        
+        toast({
+          title: 'New Submission',
+          description: 'A new content submission has been added',
+        });
+      } catch (error) {
+        console.error('Error adding new submission to queue:', error);
+        // Fallback to full refresh on error
+        fetchItems(activeEntityFilter, activeStatusFilter);
+      }
     },
     onUpdate: (payload) => {
       // Update items state directly for better UX