86 lines
2.6 KiB
TypeScript
86 lines
2.6 KiB
TypeScript
import { Separator } from '@/components/ui/separator'
|
|
import {
|
|
Sidebar,
|
|
SidebarContent,
|
|
SidebarFooter,
|
|
SidebarHeader,
|
|
SidebarRail,
|
|
} from '@/components/ui/sidebar'
|
|
import { useAuth } from '@/contexts/AuthContext'
|
|
import {
|
|
CalendarClock,
|
|
Download,
|
|
Home,
|
|
Music,
|
|
PlayCircle,
|
|
Settings,
|
|
Users,
|
|
AudioLines,
|
|
} from 'lucide-react'
|
|
import { CreditsNav } from './nav/CreditsNav'
|
|
import { NavGroup } from './nav/NavGroup'
|
|
import { NavItem } from './nav/NavItem'
|
|
import { StopSoundsButton } from './nav/StopSoundsButton'
|
|
import { UserNav } from './nav/UserNav'
|
|
import { CompactPlayer } from './player/CompactPlayer'
|
|
|
|
interface AppSidebarProps {
|
|
showCompactPlayer?: boolean
|
|
}
|
|
|
|
export function AppSidebar({ showCompactPlayer = false }: AppSidebarProps) {
|
|
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">
|
|
SDB v2
|
|
</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="/sequencer" icon={AudioLines} title="Sequencer" />
|
|
<NavItem href="/extractions" icon={Download} title="Extractions" />
|
|
<NavItem href="/schedulers" icon={CalendarClock} title="Schedulers" />
|
|
</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>
|
|
{showCompactPlayer && (
|
|
<>
|
|
<Separator className="mb-1 group-data-[collapsible=icon]:hidden" />
|
|
<div className="p-2">
|
|
<CompactPlayer />
|
|
</div>
|
|
<Separator className="mb-1 group-data-[collapsible=icon]:hidden" />
|
|
</>
|
|
)}
|
|
<StopSoundsButton />
|
|
<Separator className="mb-1 group-data-[collapsible=icon]:hidden" />
|
|
<CreditsNav user={user} />
|
|
<Separator className="mb-1 group-data-[collapsible=icon]:hidden" />
|
|
<UserNav user={user} logout={logout} />
|
|
</SidebarFooter>
|
|
|
|
<SidebarRail />
|
|
</Sidebar>
|
|
)
|
|
}
|