diff --git a/src/components/loading/CompanyDetailSkeleton.tsx b/src/components/loading/CompanyDetailSkeleton.tsx
new file mode 100644
index 00000000..cc4d7c75
--- /dev/null
+++ b/src/components/loading/CompanyDetailSkeleton.tsx
@@ -0,0 +1,98 @@
+import { Card, CardContent, CardHeader } from '@/components/ui/card';
+
+export function CompanyDetailSkeleton() {
+ return (
+
+ {/* Breadcrumb */}
+
+
+ {/* Edit Button Area */}
+
+
+ {/* Hero Banner */}
+
+
+ {/* Stats Cards */}
+
+ {[1, 2, 3, 4].map((i) => (
+
+
+
+
+
+
+ ))}
+
+
+ {/* Tabs */}
+
+ {['Overview', 'Rides', 'Models', 'Photos'].map((tab) => (
+
+ ))}
+
+
+ {/* Content Grid */}
+
+ {/* Main Content */}
+
+ {/* Description Card */}
+
+
+
+
+
+
+
+
+
+
+
+ {/* Products Grid */}
+
+
+
+
+
+
+ {[1, 2, 3, 4, 5, 6].map((i) => (
+
+ ))}
+
+
+
+
+
+ {/* Sidebar */}
+
+ {/* Company Info Card */}
+
+
+
+
+
+ {/* Logo */}
+
+
+ {/* Info Items */}
+ {[1, 2, 3].map((i) => (
+
+ ))}
+
+
+
+
+
+ );
+}
diff --git a/src/components/loading/ParkDetailSkeleton.tsx b/src/components/loading/ParkDetailSkeleton.tsx
new file mode 100644
index 00000000..f3cb66e0
--- /dev/null
+++ b/src/components/loading/ParkDetailSkeleton.tsx
@@ -0,0 +1,101 @@
+import { Card, CardContent, CardHeader } from '@/components/ui/card';
+
+export function ParkDetailSkeleton() {
+ return (
+
+ {/* Breadcrumb */}
+
+
+ {/* Edit Button Area */}
+
+
+ {/* Hero Banner */}
+
+
+ {/* Stats Cards */}
+
+ {[1, 2, 3, 4].map((i) => (
+
+
+
+
+
+
+ ))}
+
+
+ {/* Tabs */}
+
+ {['Overview', 'Rides', 'Reviews', 'Photos', 'History'].map((tab) => (
+
+ ))}
+
+
+ {/* Content Grid */}
+
+ {/* Main Content */}
+
+ {/* Description Card */}
+
+
+
+
+
+
+
+
+
+
+
+ {/* Featured Rides Card */}
+
+
+
+
+
+
+ {[1, 2, 3, 4].map((i) => (
+
+ ))}
+
+
+
+
+
+ {/* Sidebar */}
+
+ {/* Info Card */}
+
+
+
+
+
+ {[1, 2, 3, 4].map((i) => (
+
+ ))}
+
+
+
+ {/* Map Card */}
+
+
+
+
+
+
+
+
+ );
+}
diff --git a/src/components/loading/RideDetailSkeleton.tsx b/src/components/loading/RideDetailSkeleton.tsx
new file mode 100644
index 00000000..680cba61
--- /dev/null
+++ b/src/components/loading/RideDetailSkeleton.tsx
@@ -0,0 +1,106 @@
+import { Card, CardContent } from '@/components/ui/card';
+
+export function RideDetailSkeleton() {
+ return (
+
+ {/* Breadcrumb */}
+
+
+ {/* Edit Button Area */}
+
+
+ {/* Hero Banner */}
+
+
+ {/* Stats Grid */}
+
+ {[1, 2, 3, 4, 5, 6].map((i) => (
+
+
+
+
+
+
+
+ ))}
+
+
+ {/* Tabs */}
+
+ {['Overview', 'Reviews', 'Photos', 'History'].map((tab) => (
+
+ ))}
+
+
+ {/* Content Grid */}
+
+ {/* Main Content */}
+
+ {/* Description Card */}
+
+
+
+
+
+
+
+
+
+ {/* Technical Specs */}
+
+
+
+
+ {[1, 2, 3, 4, 5, 6].map((i) => (
+
+ ))}
+
+
+
+
+
+ {/* Sidebar */}
+
+ {/* Ride Info Card */}
+
+
+
+ {[1, 2, 3, 4, 5].map((i) => (
+
+ ))}
+
+
+
+ {/* Similar Rides */}
+
+
+
+
+ {[1, 2, 3].map((i) => (
+
+ ))}
+
+
+
+
+
+
+ );
+}
diff --git a/src/pages/DesignerDetail.tsx b/src/pages/DesignerDetail.tsx
index 5b193d45..a81c9bbe 100644
--- a/src/pages/DesignerDetail.tsx
+++ b/src/pages/DesignerDetail.tsx
@@ -1,6 +1,7 @@
import { useState, useEffect, lazy, Suspense } from 'react';
import { useParams, useNavigate } from 'react-router-dom';
import { EntityBreadcrumb } from '@/components/navigation/EntityBreadcrumb';
+import { CompanyDetailSkeleton } from '@/components/loading/CompanyDetailSkeleton';
import { Header } from '@/components/layout/Header';
import { getBannerUrls } from '@/lib/cloudflareImageUtils';
import { Button } from '@/components/ui/button';
@@ -150,12 +151,7 @@ export default function DesignerDetail() {
return (
);
}
@@ -191,13 +187,8 @@ export default function DesignerDetail() {
className="mb-4"
/>
- {/* Back Button and Edit Button */}
-
-
-
+ {/* Edit Button */}
+