feat: update loading for different route

This commit is contained in:
hanif salafi 2024-12-24 22:44:47 +07:00
parent 07ab513348
commit 2585df309e
10 changed files with 355 additions and 284 deletions

View File

@ -1,5 +1,6 @@
import PageTitle from "@/components/page-title";
import { Metadata } from "next";
import { Suspense } from "react";
export const metadata: Metadata = {
title: "Media Hub | POLRI",
@ -7,8 +8,9 @@ export const metadata: Metadata = {
};
const Layout = ({ children }: { children: React.ReactNode }) => {
return <>
<PageTitle className="mb-6" />
{children}</>;
<PageTitle className="mb-6" />
{children}
</>
};
export default Layout;

View File

@ -1,3 +1,5 @@
'use client'
import { StatisticsBlock } from "@/components/blocks/statistics-block";
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
import DashboardDropdown from "@/components/dashboard-dropdown";
@ -11,162 +13,165 @@ import BlogTable from "../contributor/blog/components/blog-table";
import ContentTable from "./routine-task/components/content-table";
import RecentActivity from "./routine-task/components/recent-activity";
import { Link } from "@/components/navigation";
import { Suspense } from "react";
const DashboardPage = () => {
const t = useTranslations("AnalyticsDashboard");
return (
<div>
<div className="my-3">
<Tabs defaultValue="routine-task" className="w-full">
<Card className="py-3 px-2 my-4">
<TabsList className="flex-wrap">
<TabsTrigger
value="routine-task"
className="data-[state=active]:bg-primary data-[state=active]:text-primary-foreground rounded-md px-6"
>
Tugas Rutin
</TabsTrigger>
<TabsTrigger
value="task"
className="data-[state=active]:bg-primary data-[state=active]:text-primary-foreground rounded-md px-6"
>
Penugasan
</TabsTrigger>
<TabsTrigger
value="schedule"
className="data-[state=active]:bg-primary data-[state=active]:text-primary-foreground rounded-md px-6"
>
Jadwal
</TabsTrigger>
<TabsTrigger
value="indeks"
className="data-[state=active]:bg-primary data-[state=active]:text-primary-foreground rounded-md px-6"
>
Indeks
</TabsTrigger>
</TabsList>
</Card>
<TabsContent value="routine-task">
<div className="grid grid-cols-12 items-center gap-5 mb-5">
<div className="2xl:col-span-12 lg:col-span-12 col-span-12">
<Card>
<CardContent className="p-4">
<div className="grid md:grid-cols-3 gap-4">
<StatisticsBlock
title={"Hasil unggah disetujui hari ini"}
total="3,564"
className="bg-info/10 border-none shadow-none"
/>
<StatisticsBlock
title={"Hasil unggah direvisi hari ini"}
total="564"
className="bg-warning/10 border-none shadow-none"
chartColor="#FB8F65"
/>
<StatisticsBlock
title={"Hasil unggah ditolak hari ini"}
total="+5.0%"
className="bg-primary/10 border-none shadow-none"
chartColor="#2563eb"
/>
</div>
</CardContent>
</Card>
</div>
</div>
<div className="grid grid-cols-12 gap-5">
<div className="lg:col-span-4 col-span-12">
<Card>
<CardHeader className="flex flex-row items-center">
<CardTitle className="flex-1 text-lg">
{"Total Produksi Konten"}
</CardTitle>
<DashboardDropdown />
</CardHeader>
<CardContent>
<RecentActivity />
</CardContent>
</Card>
</div>
<div className="lg:col-span-8 col-span-12">
<Card>
<CardHeader className="flex flex-row items-center">
<CardTitle className="flex-1">{"Table"}</CardTitle>
<DashboardDropdown />
</CardHeader>
<CardContent className="p-0">
<ContentTable />
</CardContent>
</Card>
</div>
</div>
</TabsContent>
<TabsContent value="task">
<div className="grid grid-cols-12 gap-5">
<div className="lg:col-span-12 col-span-12">
<Card>
<Card className="py-4 px-3">
<div className="flex flex-row justify-between items-center">
<div className="flex-1 text-xl font-medium text-default-900">
Table Penugasan
<Suspense>
<div>
<div className="my-3">
<Tabs defaultValue="routine-task" className="w-full">
<Card className="py-3 px-2 my-4">
<TabsList className="flex-wrap">
<TabsTrigger
value="routine-task"
className="data-[state=active]:bg-primary data-[state=active]:text-primary-foreground rounded-md px-6"
>
Tugas Rutin
</TabsTrigger>
<TabsTrigger
value="task"
className="data-[state=active]:bg-primary data-[state=active]:text-primary-foreground rounded-md px-6"
>
Penugasan
</TabsTrigger>
<TabsTrigger
value="schedule"
className="data-[state=active]:bg-primary data-[state=active]:text-primary-foreground rounded-md px-6"
>
Jadwal
</TabsTrigger>
<TabsTrigger
value="indeks"
className="data-[state=active]:bg-primary data-[state=active]:text-primary-foreground rounded-md px-6"
>
Indeks
</TabsTrigger>
</TabsList>
</Card>
<TabsContent value="routine-task">
<div className="grid grid-cols-12 items-center gap-5 mb-5">
<div className="2xl:col-span-12 lg:col-span-12 col-span-12">
<Card>
<CardContent className="p-4">
<div className="grid md:grid-cols-3 gap-4">
<StatisticsBlock
title={"Hasil unggah disetujui hari ini"}
total="3,564"
className="bg-info/10 border-none shadow-none"
/>
<StatisticsBlock
title={"Hasil unggah direvisi hari ini"}
total="564"
className="bg-warning/10 border-none shadow-none"
chartColor="#FB8F65"
/>
<StatisticsBlock
title={"Hasil unggah ditolak hari ini"}
total="+5.0%"
className="bg-primary/10 border-none shadow-none"
chartColor="#2563eb"
/>
</div>
<div>
<Link href={"/contributor/task/create"}>
<Button color="primary" className="text-white">
<UploadIcon />
Buat Penugasan
</Button>
</Link>
</div>
</div>
</CardContent>
</Card>
<CardContent className="p-0 mt-3">
<TaskTable />
</CardContent>
</Card>
</div>
</div>
</div>
</TabsContent>
<TabsContent value="schedule">
<div className="grid grid-cols-12 gap-5">
<div className="lg:col-span-12 col-span-12">
<Card>
<CardContent className="p-0 ">
<PressConferenceTable />
</CardContent>
</Card>
</div>
</div>
</TabsContent>
<TabsContent value="indeks">
<div className="grid grid-cols-12 gap-5">
<div className="lg:col-span-12 col-span-12">
<Card>
<Card className="py-4 px-3">
<div className="flex flex-row justify-between items-center">
<div className="flex-1 text-xl font-medium text-default-900">
Table Indeks
</div>
<div>
<Link href={"/contributor/blog/create"}>
<Button color="primary" className="text-white">
<UploadIcon />
Tambah Indeks
</Button>
</Link>
</div>
</div>
<div className="grid grid-cols-12 gap-5">
<div className="lg:col-span-4 col-span-12">
<Card>
<CardHeader className="flex flex-row items-center">
<CardTitle className="flex-1 text-lg">
{"Total Produksi Konten"}
</CardTitle>
<DashboardDropdown />
</CardHeader>
<CardContent>
<RecentActivity />
</CardContent>
</Card>
<CardContent className="p-0 mt-3">
<BlogTable />
</CardContent>
</Card>
</div>
<div className="lg:col-span-8 col-span-12">
<Card>
<CardHeader className="flex flex-row items-center">
<CardTitle className="flex-1">{"Table"}</CardTitle>
<DashboardDropdown />
</CardHeader>
<CardContent className="p-0">
<ContentTable />
</CardContent>
</Card>
</div>
</div>
</div>
</TabsContent>
</Tabs>
</TabsContent>
<TabsContent value="task">
<div className="grid grid-cols-12 gap-5">
<div className="lg:col-span-12 col-span-12">
<Card>
<Card className="py-4 px-3">
<div className="flex flex-row justify-between items-center">
<div className="flex-1 text-xl font-medium text-default-900">
Table Penugasan
</div>
<div>
<Link href={"/contributor/task/create"}>
<Button color="primary" className="text-white">
<UploadIcon />
Buat Penugasan
</Button>
</Link>
</div>
</div>
</Card>
<CardContent className="p-0 mt-3">
<TaskTable />
</CardContent>
</Card>
</div>
</div>
</TabsContent>
<TabsContent value="schedule">
<div className="grid grid-cols-12 gap-5">
<div className="lg:col-span-12 col-span-12">
<Card>
<CardContent className="p-0 ">
<PressConferenceTable />
</CardContent>
</Card>
</div>
</div>
</TabsContent>
<TabsContent value="indeks">
<div className="grid grid-cols-12 gap-5">
<div className="lg:col-span-12 col-span-12">
<Card>
<Card className="py-4 px-3">
<div className="flex flex-row justify-between items-center">
<div className="flex-1 text-xl font-medium text-default-900">
Table Indeks
</div>
<div>
<Link href={"/contributor/blog/create"}>
<Button color="primary" className="text-white">
<UploadIcon />
Tambah Indeks
</Button>
</Link>
</div>
</div>
</Card>
<CardContent className="p-0 mt-3">
<BlogTable />
</CardContent>
</Card>
</div>
</div>
</TabsContent>
</Tabs>
</div>
</div>
</div>
</Suspense>
);
};

View File

@ -4,18 +4,22 @@ import DashCodeSidebar from "@/components/partials/sidebar";
import DashCodeFooter from "@/components/partials/footer";
import ThemeCustomize from "@/components/partials/customizer";
import DashCodeHeader from "@/components/partials/header";
import MountedProvider from "@/providers/mounted.provider";
import { redirect } from "@/components/navigation";
const layout = async ({ children }: { children: React.ReactNode }) => {
return (
<LayoutProvider>
<ThemeCustomize />
<DashCodeHeader />
<DashCodeSidebar />
<LayoutContentProvider>{children}</LayoutContentProvider>
<DashCodeFooter />
</LayoutProvider>
<MountedProvider
isProtected={true}
>
<LayoutProvider>
<ThemeCustomize />
<DashCodeHeader />
<DashCodeSidebar />
<LayoutContentProvider>{children}</LayoutContentProvider>
<DashCodeFooter />
</LayoutProvider>
</MountedProvider>
);
};

View File

@ -1,7 +1,7 @@
import { Metadata } from "next";
export const metadata: Metadata = {
title: "Media Hub | POLRI",
title: "Dashcode Next Js",
description: "Dashcode is a popular dashboard template.",
};
const Layout = ({ children }: { children: React.ReactNode }) => {

View File

@ -0,0 +1,24 @@
"use client"; // Error components must be Client Components
import { useEffect } from "react";
import { Button } from "@/components/ui/button";
import { Alert, AlertDescription, AlertTitle } from "@/components/ui/alert";
import { Info } from "lucide-react";
export default function Error({ error, reset }: {
error: Error & { digest?: string }
reset: () => void
}) {
return (
<div className="space-y-4">
<Alert color="destructive" variant="soft">
<Info className="h-5 w-5" />
<AlertDescription>Something went wrong!</AlertDescription>
</Alert>
<Button onClick={() => reset()} color="destructive" size="sm">
Try again
</Button>
</div>
);
}

View File

@ -0,0 +1,20 @@
import LayoutProvider from "@/providers/layout.provider";
import LayoutContentProvider from "@/providers/content.provider";
import DashCodeSidebar from "@/components/partials/sidebar";
import DashCodeFooter from "@/components/partials/footer";
import ThemeCustomize from "@/components/partials/customizer";
import DashCodeHeader from "@/components/partials/header";
import MountedProvider from "@/providers/mounted.provider";
const layout = async ({ children }: { children: React.ReactNode }) => {
return (
<MountedProvider
isProtected={false}
>
{children}
</MountedProvider>
);
};
export default layout;

View File

@ -34,11 +34,9 @@ export default async function RootLayout({
<NextIntlClientProvider messages={messages} locale={locale}>
<AuthProvider>
<ThemeProvider attribute="class" defaultTheme="light">
<MountedProvider>
<DirectionProvider direction={direction}>
{children}
</DirectionProvider>
</MountedProvider>
<DirectionProvider direction={direction}>
{children}
</DirectionProvider>
<Toaster />
<SonnerToaster />
</ThemeProvider>

257
package-lock.json generated
View File

@ -102,6 +102,7 @@
"react-cssfx-loading": "^2.1.0",
"react-datepicker": "^7.5.0",
"react-day-picker": "^8.10.1",
"react-dom": "^19.0.0",
"react-dropzone": "^14.2.3",
"react-geocode": "^0.2.3",
"react-hook-form": "^7.52.1",
@ -1062,6 +1063,126 @@
"glob": "10.3.10"
}
},
"node_modules/@next/swc-darwin-arm64": {
"version": "14.2.3",
"resolved": "https://registry.npmjs.org/@next/swc-darwin-arm64/-/swc-darwin-arm64-14.2.3.tgz",
"integrity": "sha512-3pEYo/RaGqPP0YzwnlmPN2puaF2WMLM3apt5jLW2fFdXD9+pqcoTzRk+iZsf8ta7+quAe4Q6Ms0nR0SFGFdS1A==",
"cpu": [
"arm64"
],
"optional": true,
"os": [
"darwin"
],
"engines": {
"node": ">= 10"
}
},
"node_modules/@next/swc-darwin-x64": {
"version": "14.2.3",
"resolved": "https://registry.npmjs.org/@next/swc-darwin-x64/-/swc-darwin-x64-14.2.3.tgz",
"integrity": "sha512-6adp7waE6P1TYFSXpY366xwsOnEXM+y1kgRpjSRVI2CBDOcbRjsJ67Z6EgKIqWIue52d2q/Mx8g9MszARj8IEA==",
"cpu": [
"x64"
],
"optional": true,
"os": [
"darwin"
],
"engines": {
"node": ">= 10"
}
},
"node_modules/@next/swc-linux-arm64-gnu": {
"version": "14.2.3",
"resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-gnu/-/swc-linux-arm64-gnu-14.2.3.tgz",
"integrity": "sha512-cuzCE/1G0ZSnTAHJPUT1rPgQx1w5tzSX7POXSLaS7w2nIUJUD+e25QoXD/hMfxbsT9rslEXugWypJMILBj/QsA==",
"cpu": [
"arm64"
],
"optional": true,
"os": [
"linux"
],
"engines": {
"node": ">= 10"
}
},
"node_modules/@next/swc-linux-arm64-musl": {
"version": "14.2.3",
"resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-musl/-/swc-linux-arm64-musl-14.2.3.tgz",
"integrity": "sha512-0D4/oMM2Y9Ta3nGuCcQN8jjJjmDPYpHX9OJzqk42NZGJocU2MqhBq5tWkJrUQOQY9N+In9xOdymzapM09GeiZw==",
"cpu": [
"arm64"
],
"optional": true,
"os": [
"linux"
],
"engines": {
"node": ">= 10"
}
},
"node_modules/@next/swc-linux-x64-gnu": {
"version": "14.2.3",
"resolved": "https://registry.npmjs.org/@next/swc-linux-x64-gnu/-/swc-linux-x64-gnu-14.2.3.tgz",
"integrity": "sha512-ENPiNnBNDInBLyUU5ii8PMQh+4XLr4pG51tOp6aJ9xqFQ2iRI6IH0Ds2yJkAzNV1CfyagcyzPfROMViS2wOZ9w==",
"cpu": [
"x64"
],
"optional": true,
"os": [
"linux"
],
"engines": {
"node": ">= 10"
}
},
"node_modules/@next/swc-linux-x64-musl": {
"version": "14.2.3",
"resolved": "https://registry.npmjs.org/@next/swc-linux-x64-musl/-/swc-linux-x64-musl-14.2.3.tgz",
"integrity": "sha512-BTAbq0LnCbF5MtoM7I/9UeUu/8ZBY0i8SFjUMCbPDOLv+un67e2JgyN4pmgfXBwy/I+RHu8q+k+MCkDN6P9ViQ==",
"cpu": [
"x64"
],
"optional": true,
"os": [
"linux"
],
"engines": {
"node": ">= 10"
}
},
"node_modules/@next/swc-win32-arm64-msvc": {
"version": "14.2.3",
"resolved": "https://registry.npmjs.org/@next/swc-win32-arm64-msvc/-/swc-win32-arm64-msvc-14.2.3.tgz",
"integrity": "sha512-AEHIw/dhAMLNFJFJIJIyOFDzrzI5bAjI9J26gbO5xhAKHYTZ9Or04BesFPXiAYXDNdrwTP2dQceYA4dL1geu8A==",
"cpu": [
"arm64"
],
"optional": true,
"os": [
"win32"
],
"engines": {
"node": ">= 10"
}
},
"node_modules/@next/swc-win32-ia32-msvc": {
"version": "14.2.3",
"resolved": "https://registry.npmjs.org/@next/swc-win32-ia32-msvc/-/swc-win32-ia32-msvc-14.2.3.tgz",
"integrity": "sha512-vga40n1q6aYb0CLrM+eEmisfKCR45ixQYXuBXxOOmmoV8sYST9k7E3US32FsY+CkkF7NtzdcebiFT4CHuMSyZw==",
"cpu": [
"ia32"
],
"optional": true,
"os": [
"win32"
],
"engines": {
"node": ">= 10"
}
},
"node_modules/@next/swc-win32-x64-msvc": {
"version": "14.2.3",
"resolved": "https://registry.npmjs.org/@next/swc-win32-x64-msvc/-/swc-win32-x64-msvc-14.2.3.tgz",
@ -10808,6 +10929,17 @@
"react": "^16.8.0 || ^17.0.0 || ^18.0.0"
}
},
"node_modules/react-dom": {
"version": "19.0.0",
"resolved": "https://registry.npmjs.org/react-dom/-/react-dom-19.0.0.tgz",
"integrity": "sha512-4GV5sHFG0e/0AD4X+ySy6UJd3jVl1iNsNHdpad0qhABJ11twS3TTBnseqsKurKcsNqCEFeGL3uLpVChpIO3QfQ==",
"dependencies": {
"scheduler": "^0.25.0"
},
"peerDependencies": {
"react": "^19.0.0"
}
},
"node_modules/react-dropzone": {
"version": "14.3.5",
"resolved": "https://registry.npmjs.org/react-dropzone/-/react-dropzone-14.3.5.tgz",
@ -11747,6 +11879,11 @@
"resolved": "https://registry.npmjs.org/safer-buffer/-/safer-buffer-2.1.2.tgz",
"integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg=="
},
"node_modules/scheduler": {
"version": "0.25.0",
"resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.25.0.tgz",
"integrity": "sha512-xFVuu11jh+xcO7JOAGJNOXld8/TcEHK/4CituBUeUb5hqxJLj9YuemAEuvm9gQ/+pgXYfbQuqAkiYu+u7YEsNA=="
},
"node_modules/scroll-into-view-if-needed": {
"version": "3.1.0",
"resolved": "https://registry.npmjs.org/scroll-into-view-if-needed/-/scroll-into-view-if-needed-3.1.0.tgz",
@ -13828,126 +13965,6 @@
"type": "github",
"url": "https://github.com/sponsors/wooorm"
}
},
"node_modules/@next/swc-darwin-arm64": {
"version": "14.2.3",
"resolved": "https://registry.npmjs.org/@next/swc-darwin-arm64/-/swc-darwin-arm64-14.2.3.tgz",
"integrity": "sha512-3pEYo/RaGqPP0YzwnlmPN2puaF2WMLM3apt5jLW2fFdXD9+pqcoTzRk+iZsf8ta7+quAe4Q6Ms0nR0SFGFdS1A==",
"cpu": [
"arm64"
],
"optional": true,
"os": [
"darwin"
],
"engines": {
"node": ">= 10"
}
},
"node_modules/@next/swc-darwin-x64": {
"version": "14.2.3",
"resolved": "https://registry.npmjs.org/@next/swc-darwin-x64/-/swc-darwin-x64-14.2.3.tgz",
"integrity": "sha512-6adp7waE6P1TYFSXpY366xwsOnEXM+y1kgRpjSRVI2CBDOcbRjsJ67Z6EgKIqWIue52d2q/Mx8g9MszARj8IEA==",
"cpu": [
"x64"
],
"optional": true,
"os": [
"darwin"
],
"engines": {
"node": ">= 10"
}
},
"node_modules/@next/swc-linux-arm64-gnu": {
"version": "14.2.3",
"resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-gnu/-/swc-linux-arm64-gnu-14.2.3.tgz",
"integrity": "sha512-cuzCE/1G0ZSnTAHJPUT1rPgQx1w5tzSX7POXSLaS7w2nIUJUD+e25QoXD/hMfxbsT9rslEXugWypJMILBj/QsA==",
"cpu": [
"arm64"
],
"optional": true,
"os": [
"linux"
],
"engines": {
"node": ">= 10"
}
},
"node_modules/@next/swc-linux-arm64-musl": {
"version": "14.2.3",
"resolved": "https://registry.npmjs.org/@next/swc-linux-arm64-musl/-/swc-linux-arm64-musl-14.2.3.tgz",
"integrity": "sha512-0D4/oMM2Y9Ta3nGuCcQN8jjJjmDPYpHX9OJzqk42NZGJocU2MqhBq5tWkJrUQOQY9N+In9xOdymzapM09GeiZw==",
"cpu": [
"arm64"
],
"optional": true,
"os": [
"linux"
],
"engines": {
"node": ">= 10"
}
},
"node_modules/@next/swc-linux-x64-gnu": {
"version": "14.2.3",
"resolved": "https://registry.npmjs.org/@next/swc-linux-x64-gnu/-/swc-linux-x64-gnu-14.2.3.tgz",
"integrity": "sha512-ENPiNnBNDInBLyUU5ii8PMQh+4XLr4pG51tOp6aJ9xqFQ2iRI6IH0Ds2yJkAzNV1CfyagcyzPfROMViS2wOZ9w==",
"cpu": [
"x64"
],
"optional": true,
"os": [
"linux"
],
"engines": {
"node": ">= 10"
}
},
"node_modules/@next/swc-linux-x64-musl": {
"version": "14.2.3",
"resolved": "https://registry.npmjs.org/@next/swc-linux-x64-musl/-/swc-linux-x64-musl-14.2.3.tgz",
"integrity": "sha512-BTAbq0LnCbF5MtoM7I/9UeUu/8ZBY0i8SFjUMCbPDOLv+un67e2JgyN4pmgfXBwy/I+RHu8q+k+MCkDN6P9ViQ==",
"cpu": [
"x64"
],
"optional": true,
"os": [
"linux"
],
"engines": {
"node": ">= 10"
}
},
"node_modules/@next/swc-win32-arm64-msvc": {
"version": "14.2.3",
"resolved": "https://registry.npmjs.org/@next/swc-win32-arm64-msvc/-/swc-win32-arm64-msvc-14.2.3.tgz",
"integrity": "sha512-AEHIw/dhAMLNFJFJIJIyOFDzrzI5bAjI9J26gbO5xhAKHYTZ9Or04BesFPXiAYXDNdrwTP2dQceYA4dL1geu8A==",
"cpu": [
"arm64"
],
"optional": true,
"os": [
"win32"
],
"engines": {
"node": ">= 10"
}
},
"node_modules/@next/swc-win32-ia32-msvc": {
"version": "14.2.3",
"resolved": "https://registry.npmjs.org/@next/swc-win32-ia32-msvc/-/swc-win32-ia32-msvc-14.2.3.tgz",
"integrity": "sha512-vga40n1q6aYb0CLrM+eEmisfKCR45ixQYXuBXxOOmmoV8sYST9k7E3US32FsY+CkkF7NtzdcebiFT4CHuMSyZw==",
"cpu": [
"ia32"
],
"optional": true,
"os": [
"win32"
],
"engines": {
"node": ">= 10"
}
}
}
}

View File

@ -103,6 +103,7 @@
"react-cssfx-loading": "^2.1.0",
"react-datepicker": "^7.5.0",
"react-day-picker": "^8.10.1",
"react-dom": "^19.0.0",
"react-dropzone": "^14.2.3",
"react-geocode": "^0.2.3",
"react-hook-form": "^7.52.1",

View File

@ -4,9 +4,9 @@ import Loader from "@/components/loader";
import { useMounted } from "@/hooks/use-mounted";
import React from "react";
const MountedProvider = ({ children }: { children: React.ReactNode }) => {
const MountedProvider = ({ children, isProtected }: { children: React.ReactNode, isProtected: Boolean }) => {
const mounted = useMounted();
// if (!mounted) return <Loader />
if (!mounted) return isProtected ? <Loader /> : null;
return children;
};