diff --git a/app/admin/page.tsx b/app/admin/page.tsx index f6ff2c8..95ce9a6 100644 --- a/app/admin/page.tsx +++ b/app/admin/page.tsx @@ -5,7 +5,9 @@ import { Organization } from "./mockData"; import StatCard from "@/components/stat-card"; import { useEffect, useState } from "react"; import { fetchApi } from "@/lib/client/fetch"; -import { UnauthorizedPage } from "@/mint/unauthorized"; + +import { notFound } from "next/navigation"; +import { PageSkeleton } from "@/components/ui/page-skeleton"; interface AdminData { platformStats: { @@ -33,8 +35,8 @@ const columns: ColumnDef[] = [ export default function AdminPage() { const [data, setData] = useState(null); - const [isLoading, setIsLoading] = useState(true); const [error, setError] = useState(null); + const [isLoading, setIsLoading] = useState(true); useEffect(() => { const fetchData = async () => { @@ -56,23 +58,11 @@ export default function AdminPage() { }, []); if (isLoading) { - return ( -
- Loading... -
- ); - } - - if (error === "unauthorized") { - return ; + return ; } if (error || !data) { - return ( -
- Error: {error} -
- ); + return notFound(); } return ( diff --git a/app/skeleton/page.tsx b/app/skeleton/page.tsx new file mode 100644 index 0000000..f4da00c --- /dev/null +++ b/app/skeleton/page.tsx @@ -0,0 +1,40 @@ +"use client"; + +import { PageSkeleton } from "@/components/ui/page-skeleton"; +import { Button } from "@/components/ui/button"; +import { useTheme } from "@/contexts/theme-context"; + +export default function SkeletonDebugPage() { + const { theme, setTheme } = useTheme(); + + return ( +
+
+
+ + + +
+
+ +
+ ); +} diff --git a/components/ui/page-skeleton.tsx b/components/ui/page-skeleton.tsx new file mode 100644 index 0000000..5e5068d --- /dev/null +++ b/components/ui/page-skeleton.tsx @@ -0,0 +1,42 @@ +"use client"; + +import { Skeleton } from "@/components/ui/skeleton"; +import { Card } from "@/components/ui/card"; + +export function PageSkeleton() { + return ( +
+ {/* Header Section */} +
+ + +
+ + {/* Content Grid */} +
+ {[1, 2, 3].map((i) => ( + + + +
+ + +
+
+ ))} +
+ + {/* Table/List Section */} + +
+ +
+ {[1, 2, 3, 4].map((i) => ( + + ))} +
+
+
+
+ ); +}