Refactor: Optimize recent changes query

src/hooks/homepage/useHomepageRecentChanges.ts

@@ -22,124 +22,27 @@ export function useHomepageRecentChanges(enabled = true) {
   return useQuery({
     queryKey: queryKeys.homepage.recentChanges(),
     queryFn: async () => {
-      // Fetch recent park versions
-      const { data: parkVersions } = await supabase
-        .from('park_versions')
-        .select(`
-          park_id,
-          name,
-          slug,
-          card_image_url,
-          change_type,
-          created_at,
-          created_by,
-          change_reason,
-          profiles:created_by(username, avatar_url)
-        `)
-        .eq('is_current', true)
-        .order('created_at', { ascending: false })
-        .limit(8);
-
-      // Fetch recent ride versions
-      const { data: rideVersions } = await supabase
-        .from('ride_versions')
-        .select(`
-          ride_id,
-          name,
-          slug,
-          card_image_url,
-          change_type,
-          created_at,
-          created_by,
-          change_reason,
-          park_id,
-          profiles:created_by(username, avatar_url)
-        `)
-        .eq('is_current', true)
-        .order('created_at', { ascending: false })
-        .limit(8);
-
-      // Fetch park slugs for rides
-      const parkIds = rideVersions?.map(rv => rv.park_id).filter(Boolean) || [];
-      const { data: parks } = parkIds.length > 0
-        ? await supabase
-            .from('parks')
-            .select('id, slug')
-            .in('id', parkIds)
-        : { data: [] };
-
-      const parkSlugMap = new Map<string, string>(
-        (parks || []).map(p => [p.id, p.slug])
-      );
-
-      // Fetch recent company versions
-      const { data: companyVersions } = await supabase
-        .from('company_versions')
-        .select(`
-          company_id,
-          name,
-          slug,
-          card_image_url,
-          change_type,
-          created_at,
-          created_by,
-          change_reason,
-          profiles:created_by(username, avatar_url)
-        `)
-        .eq('is_current', true)
-        .order('created_at', { ascending: false })
-        .limit(8);
-
-      // Combine and sort all changes
-      const changes: RecentChange[] = [
-        ...(parkVersions || []).map(pv => ({
-          id: pv.park_id,
-          name: pv.name,
-          type: 'park' as const,
-          slug: pv.slug,
-          imageUrl: pv.card_image_url,
-          changeType: pv.change_type,
-          changedAt: pv.created_at,
-          changedBy: pv.profiles ? {
-            username: pv.profiles.username,
-            avatarUrl: pv.profiles.avatar_url
-          } : undefined,
-          changeReason: pv.change_reason
-        })),
-        ...(rideVersions || []).map(rv => ({
-          id: rv.ride_id,
-          name: rv.name,
-          type: 'ride' as const,
-          slug: rv.slug,
-          parkSlug: rv.park_id ? (parkSlugMap.get(rv.park_id) || undefined) : undefined,
-          imageUrl: rv.card_image_url,
-          changeType: rv.change_type,
-          changedAt: rv.created_at,
-          changedBy: rv.profiles ? {
-            username: rv.profiles.username,
-            avatarUrl: rv.profiles.avatar_url
-          } : undefined,
-          changeReason: rv.change_reason
-        })),
-        ...(companyVersions || []).map(cv => ({
-          id: cv.company_id,
-          name: cv.name,
-          type: 'company' as const,
-          slug: cv.slug,
-          imageUrl: cv.card_image_url,
-          changeType: cv.change_type,
-          changedAt: cv.created_at,
-          changedBy: cv.profiles ? {
-            username: cv.profiles.username,
-            avatarUrl: cv.profiles.avatar_url
-          } : undefined,
-          changeReason: cv.change_reason
-        }))
-      ];
-
-      return changes
-        .sort((a, b) => new Date(b.changedAt).getTime() - new Date(a.changedAt).getTime())
-        .slice(0, 24);
+      // Use the new database function to get all changes in a single query
+      const { data, error } = await supabase.rpc('get_recent_changes', { limit_count: 24 });
+      
+      if (error) throw error;
+      
+      // Transform the database response to match our interface
+      return (data || []).map((item: any) => ({
+        id: item.entity_id,
+        name: item.entity_name,
+        type: item.entity_type as 'park' | 'ride' | 'company',
+        slug: item.entity_slug,
+        parkSlug: item.park_slug || undefined,
+        imageUrl: item.image_url || undefined,
+        changeType: item.change_type,
+        changedAt: item.changed_at,
+        changedBy: item.changed_by_username ? {
+          username: item.changed_by_username,
+          avatarUrl: item.changed_by_avatar || undefined
+        } : undefined,
+        changeReason: item.change_reason || undefined
+      })) as RecentChange[];
     },
     enabled,
     staleTime: 5 * 60 * 1000,