Initialize client forms

src/layouts/admin/(partials)/header-page-title.tsx

@@ -1,29 +0,0 @@
-import { AppContext } from "@/src/pages/__root";
-import { ChevronRight } from "lucide-react";
-import { useContext } from "react";
-
-const SECTION_TITLES: Record<string, string> = {
-    "/admin": "Dashboard",
-    "/admin/clients": "Clients",
-    "/admin/host": "Host",
-    "/admin/settings": "Settings",
-};
-
-export default function HeaderPageTitle() {
-    const { pageProps } = useContext(AppContext);
-    const pathname = pageProps?.url?.pathname || "/admin";
-    const title = SECTION_TITLES[pathname] || "Admin";
-
-    return (
-        <span className="hidden xl:flex items-center gap-2 text-[14px] font-semibold text-foreground-light dark:text-foreground-dark">
-            <span className="font-medium text-foreground-light/50 dark:text-foreground-dark/50">
-                Admin
-            </span>
-            <ChevronRight
-                size={14}
-                className="text-foreground-light/30 dark:text-foreground-dark/30"
-            />
-            <span>{title}</span>
-        </span>
-    );
-}

src/layouts/admin/(sections)/Header.tsx

@@ -2,15 +2,16 @@ import Row from "@/src/components/twui/layout/Row";
 import HeaderUser from "../../main/(partials)/header-user";
 import LogoIcon from "@/src/components/general/logo-icon";
 import MobileNav from "../(partials)/MobileNav";
-import HeaderPageTitle from "../(partials)/header-page-title";
 import { twMerge } from "tailwind-merge";
+import Breadcrumbs from "@/src/components/twui/elements/Breadcrumbs";
+import { useContext } from "react";
+import { AppContext } from "@/src/pages/__root";
 
 type Props = {};
 
 export default function Header({}: Props) {
-    /**
-     * Render component
-     */
+    const { pageProps } = useContext(AppContext);
+
     return (
         <header className="h-20">
             <Row
@@ -25,7 +26,17 @@ export default function Header({}: Props) {
                         img_props={{ className: "flex xl:hidden" }}
                     />
                     <MobileNav />
-                    <HeaderPageTitle />
+                    <Breadcrumbs
+                        dividerProps={{
+                            className: "-skew-10",
+                        }}
+                        currentLinkProps={{
+                            className: "text-slate-400! pointer-events-none",
+                        }}
+                        pageUrl={pageProps?.url?.pathname}
+                        backButton
+                        skipHome
+                    />
                 </Row>
                 <Row className="flex-nowrap">
                     <HeaderUser />