diff --git a/src/routes/Dashboard/DashboardLayout.tsx b/src/routes/Dashboard/DashboardLayout.tsx index 8ef974821..5f6f00329 100644 --- a/src/routes/Dashboard/DashboardLayout.tsx +++ b/src/routes/Dashboard/DashboardLayout.tsx @@ -1,9 +1,12 @@ import { Link, Outlet } from "@tanstack/react-router"; +import { isAuthorizationRequired } from "@/components/shared/Authentication/helpers"; +import { TopBarAuthentication } from "@/components/shared/Authentication/TopBarAuthentication"; import { Icon, type IconName } from "@/components/ui/icon"; import { BlockStack, InlineStack } from "@/components/ui/layout"; import { Heading, Text } from "@/components/ui/typography"; import { cn } from "@/lib/utils"; +import { DOCUMENTATION_URL } from "@/utils/constants"; interface SidebarItem { to: string; @@ -19,7 +22,15 @@ const SIDEBAR_ITEMS: SidebarItem[] = [ { to: "/dashboard/recently-viewed", label: "Recently Viewed", icon: "Clock" }, ]; +const navItemClass = (isActive: boolean) => + cn( + "flex items-center gap-2 w-full px-3 py-2 rounded-md text-sm cursor-pointer hover:bg-accent", + isActive && "bg-accent font-medium", + ); + export function DashboardLayout() { + const requiresAuthorization = isAuthorizationRequired(); + return (
@@ -36,31 +47,53 @@ export function DashboardLayout() { - - {SIDEBAR_ITEMS.map((item) => ( - + {/* Top nav */} + + {SIDEBAR_ITEMS.map((item) => ( + + {({ isActive }) => ( +
+ + {item.label} +
+ )} + + ))} +
+ + {/* Bottom utilities */} + + + + Docs + + {({ isActive }) => ( -
- - {item.label} +
+ + Settings
)} - ))} - + {requiresAuthorization && ( +
+ +
+ )} + +