e66ab7b7f8
- Added AppLayout component to standardize page layout with breadcrumb support. - Introduced AppSidebar for navigation with user-specific links and admin options. - Created new pages: SoundsPage, PlaylistsPage, ExtractionsPage, UsersPage, and SettingsPage. - Removed obsolete SocketStatus component and replaced it with SocketBadge for connection status. - Updated DashboardPage to utilize the new layout and sidebar components. - Added NavGroup and NavItem components for better organization of sidebar navigation. - Included SocketBadge to display real-time connection status. - Updated package.json to include vitest and coverage-v8 for testing and coverage reporting.
58 lines
1.6 KiB
TypeScript
58 lines
1.6 KiB
TypeScript
import {
|
|
Home,
|
|
Music,
|
|
Users,
|
|
Settings,
|
|
Download,
|
|
PlayCircle
|
|
} from 'lucide-react'
|
|
import {
|
|
Sidebar,
|
|
SidebarContent,
|
|
SidebarFooter,
|
|
SidebarHeader,
|
|
SidebarRail,
|
|
} from '@/components/ui/sidebar'
|
|
import { NavGroup } from './nav/NavGroup'
|
|
import { NavItem } from './nav/NavItem'
|
|
import { UserNav } from './nav/UserNav'
|
|
import { useAuth } from '@/contexts/AuthContext'
|
|
|
|
export function AppSidebar() {
|
|
const { user, logout } = useAuth()
|
|
|
|
if (!user) return null
|
|
|
|
return (
|
|
<Sidebar variant="sidebar" collapsible="icon">
|
|
<SidebarHeader>
|
|
<div className="flex items-center gap-2 px-2 py-2">
|
|
<Music className="h-6 w-6" />
|
|
<span className="font-semibold text-lg group-data-[collapsible=icon]:hidden">Soundboard</span>
|
|
</div>
|
|
</SidebarHeader>
|
|
|
|
<SidebarContent>
|
|
<NavGroup label="Application">
|
|
<NavItem href="/" icon={Home} title="Dashboard" />
|
|
<NavItem href="/sounds" icon={Music} title="Sounds" />
|
|
<NavItem href="/playlists" icon={PlayCircle} title="Playlists" />
|
|
<NavItem href="/extractions" icon={Download} title="Extractions" />
|
|
</NavGroup>
|
|
|
|
{user.role === "admin" && (
|
|
<NavGroup label="Admin">
|
|
<NavItem href="/admin/users" icon={Users} title="Users" />
|
|
<NavItem href="/admin/settings" icon={Settings} title="Settings" />
|
|
</NavGroup>
|
|
)}
|
|
</SidebarContent>
|
|
|
|
<SidebarFooter>
|
|
<UserNav user={user} logout={logout} />
|
|
</SidebarFooter>
|
|
|
|
<SidebarRail />
|
|
</Sidebar>
|
|
)
|
|
} |