refactor: integrate useMinimumLoading hook for enhanced loading state management across multiple pages

app/sites/[id]/funnels/[funnelId]/page.tsx

@@ -5,7 +5,7 @@ import { useParams, useRouter } from 'next/navigation'
 import { ApiError } from '@/lib/api/client'
 import { getFunnel, getFunnelStats, deleteFunnel, type Funnel, type FunnelStats } from '@/lib/api/funnels'
 import { toast, Select, DatePicker, ChevronLeftIcon, ArrowRightIcon, TrashIcon, useTheme, Button } from '@ciphera-net/ui'
-import { FunnelDetailSkeleton } from '@/components/skeletons'
+import { FunnelDetailSkeleton, useMinimumLoading } from '@/components/skeletons'
 import Link from 'next/link'
 import {
   BarChart,
@@ -92,7 +92,9 @@ export default function FunnelReportPage() {
     }
   }
 
-  if (loading && !funnel) {
+  const showSkeleton = useMinimumLoading(loading && !funnel)
+
+  if (showSkeleton) {
     return <FunnelDetailSkeleton />
   }
 

app/sites/[id]/funnels/page.tsx

@@ -4,7 +4,7 @@ import { useCallback, useEffect, useState } from 'react'
 import { useParams, useRouter } from 'next/navigation'
 import { listFunnels, deleteFunnel, type Funnel } from '@/lib/api/funnels'
 import { toast, PlusIcon, ArrowRightIcon, ChevronLeftIcon, TrashIcon, Button } from '@ciphera-net/ui'
-import { FunnelsListSkeleton } from '@/components/skeletons'
+import { FunnelsListSkeleton, useMinimumLoading } from '@/components/skeletons'
 import Link from 'next/link'
 
 export default function FunnelsPage() {
@@ -44,7 +44,9 @@ export default function FunnelsPage() {
     }
   }
 
-  if (loading) {
+  const showSkeleton = useMinimumLoading(loading)
+
+  if (showSkeleton) {
     return <FunnelsListSkeleton />
   }