Approve database migration

src/pages/PropertyOwnerDetail.tsx

@@ -30,6 +30,7 @@ export default function PropertyOwnerDetail() {
   const [totalParks, setTotalParks] = useState<number>(0);
   const [operatingRides, setOperatingRides] = useState<number>(0);
   const [statsLoading, setStatsLoading] = useState(true);
+  const [totalPhotos, setTotalPhotos] = useState<number>(0);
   const { user } = useAuth();
   const { isModerator } = useUserRole();
 
@@ -39,6 +40,57 @@ export default function PropertyOwnerDetail() {
     }
   }, [slug]);
 
+  // Real-time subscription for parks and photos changes
+  useEffect(() => {
+    if (!owner?.id) return;
+
+    const channel = supabase
+      .channel('owner-stats-changes')
+      .on(
+        'postgres_changes',
+        {
+          event: '*',
+          schema: 'public',
+          table: 'parks',
+          filter: `property_owner_id=eq.${owner.id}`
+        },
+        (payload) => {
+          console.log('Park change detected for owner:', payload);
+          fetchStatistics(owner.id);
+        }
+      )
+      .on(
+        'postgres_changes',
+        {
+          event: 'UPDATE',
+          schema: 'public',
+          table: 'rides'
+        },
+        (payload) => {
+          console.log('Ride status change detected:', payload);
+          fetchStatistics(owner.id);
+        }
+      )
+      .on(
+        'postgres_changes',
+        {
+          event: '*',
+          schema: 'public',
+          table: 'photos',
+          filter: `entity_type=eq.property_owner,entity_id=eq.${owner.id}`
+        },
+        (payload) => {
+          console.log('Photo change detected for owner:', payload);
+          fetchPhotoCount(owner.id);
+        }
+      )
+      .subscribe();
+
+    return () => {
+      supabase.removeChannel(channel);
+    };
+  }, [owner?.id]);
+
   const fetchOwnerData = async () => {
     try {
       const { data, error } = await supabase
@@ -55,6 +107,7 @@ export default function PropertyOwnerDetail() {
       if (data) {
         fetchParks(data.id);
         fetchStatistics(data.id);
+        fetchPhotoCount(data.id);
       }
     } catch (error) {
       console.error('Error fetching property owner:', error);
@@ -111,6 +164,22 @@ export default function PropertyOwnerDetail() {
     }
   };
 
+  const fetchPhotoCount = async (ownerId: string) => {
+    try {
+      const { count, error } = await supabase
+        .from('photos')
+        .select('id', { count: 'exact', head: true })
+        .eq('entity_type', 'property_owner')
+        .eq('entity_id', ownerId);
+
+      if (error) throw error;
+      setTotalPhotos(count || 0);
+    } catch (error) {
+      console.error('Error fetching photo count:', error);
+      setTotalPhotos(0);
+    }
+  };
+
   const handleEditSubmit = async (data: any) => {
     try {
       await submitCompanyUpdate(
@@ -314,8 +383,12 @@ export default function PropertyOwnerDetail() {
         <Tabs defaultValue="overview" className="w-full">
           <TabsList className="grid w-full grid-cols-2 md:grid-cols-4">
             <TabsTrigger value="overview">Overview</TabsTrigger>
-            <TabsTrigger value="parks">Parks</TabsTrigger>
-            <TabsTrigger value="photos">Photos</TabsTrigger>
+            <TabsTrigger value="parks">
+              Parks {!statsLoading && totalParks > 0 && `(${totalParks})`}
+            </TabsTrigger>
+            <TabsTrigger value="photos">
+              Photos {!statsLoading && totalPhotos > 0 && `(${totalPhotos})`}
+            </TabsTrigger>
             <TabsTrigger value="history">History</TabsTrigger>
           </TabsList>