2a157e8baa
* Enhance sidebar navigation and layout configuration - Added support for configurable sidebar collapsed style - Updated layout components to use new sidebar configuration - Added environment variable for sidebar trigger display - Simplified page header and navigation components - Improved sidebar responsiveness and user experience * Refactor admin account page layout and action buttons - Moved action buttons from sidebar to PageHeader for both personal and team account pages - Updated button variants and styling for better visual hierarchy - Improved spacing and layout of account page components - Added border to PageHeader for better visual separation * Update version updater dialog styling - Replaced `space-x-4` with `gap-x-2` for better spacing - Wrapped translation text in a `span` for improved layout - Maintained consistent icon and text alignment in dialog title * Refactor sidebar state management and configuration - Simplified sidebar context and removed minimized state - Updated layout components to use new sidebar open/closed state - Modified sidebar navigation to handle collapsed state dynamically - Added environment variable for sidebar trigger and collapsed style - Improved sidebar responsiveness and rendering logic * Remove sidebar configuration and environment variables - Simplified sidebar context by removing `minimized` state in components - Updated account selector components to use simplified sidebar state - Removed unused helper functions in sidebar implementation
68 lines
1.8 KiB
TypeScript
68 lines
1.8 KiB
TypeScript
'use client';
|
|
|
|
import Link from 'next/link';
|
|
import { usePathname } from 'next/navigation';
|
|
|
|
import { LayoutDashboard, Users } from 'lucide-react';
|
|
|
|
import {
|
|
Sidebar,
|
|
SidebarContent,
|
|
SidebarFooter,
|
|
SidebarGroup,
|
|
SidebarGroupContent,
|
|
SidebarGroupLabel,
|
|
SidebarHeader,
|
|
SidebarMenu,
|
|
SidebarMenuButton,
|
|
} from '@kit/ui/shadcn-sidebar';
|
|
|
|
import { AppLogo } from '~/components/app-logo';
|
|
import { ProfileAccountDropdownContainer } from '~/components/personal-account-dropdown-container';
|
|
|
|
export function AdminSidebar() {
|
|
const path = usePathname();
|
|
|
|
return (
|
|
<Sidebar collapsible="icon">
|
|
<SidebarHeader className={'m-2'}>
|
|
<AppLogo href={'/admin'} className="max-w-full" />
|
|
</SidebarHeader>
|
|
|
|
<SidebarContent>
|
|
<SidebarGroup>
|
|
<SidebarGroupLabel>Admin</SidebarGroupLabel>
|
|
|
|
<SidebarGroupContent>
|
|
<SidebarMenu>
|
|
<SidebarMenuButton isActive={path === '/admin'} asChild>
|
|
<Link className={'flex gap-2.5'} href={'/admin'}>
|
|
<LayoutDashboard className={'h-4'} />
|
|
<span>Dashboard</span>
|
|
</Link>
|
|
</SidebarMenuButton>
|
|
|
|
<SidebarMenuButton
|
|
isActive={path.includes('/admin/accounts')}
|
|
asChild
|
|
>
|
|
<Link
|
|
className={'flex size-full gap-2.5'}
|
|
href={'/admin/accounts'}
|
|
>
|
|
<Users className={'h-4'} />
|
|
<span>Accounts</span>
|
|
</Link>
|
|
</SidebarMenuButton>
|
|
</SidebarMenu>
|
|
</SidebarGroupContent>
|
|
</SidebarGroup>
|
|
</SidebarContent>
|
|
|
|
<SidebarFooter>
|
|
<ProfileAccountDropdownContainer />
|
|
</SidebarFooter>
|
|
</Sidebar>
|
|
);
|
|
}
|