'use client'; import { cn } from '@/lib/utils'; import { BookOpenText, Home, Search, SquarePen, Settings } from 'lucide-react'; import Link from 'next/link'; import { useSelectedLayoutSegments } from 'next/navigation'; import React, { Fragment, useState } from 'react'; import Layout from './Layout'; import { Dialog, Transition } from '@headlessui/react'; import SettingsDialog from './SettingsDialog'; const Sidebar = ({ children }: { children: React.ReactNode }) => { const segments = useSelectedLayoutSegments(); const [isSettingsOpen, setIsSettingsOpen] = useState(false); const navLinks = [ { icon: Home, href: '/', active: segments.length === 0, label: 'Home', }, { icon: Search, href: '/discover', active: segments.includes('discover'), label: 'Discover', }, { icon: BookOpenText, href: '/library', active: segments.includes('library'), label: 'Library', }, ]; return (
{navLinks.map((link, i) => ( {link.active && (
)} ))}
setIsSettingsOpen(!isSettingsOpen)} className="text-white cursor-pointer" />
{navLinks.map((link, i) => ( {link.active && (
)}

{link.label}

))}
{children}
); }; export default Sidebar;