53 lines
2.0 KiB
JavaScript
53 lines
2.0 KiB
JavaScript
import { Link, usePage } from '@inertiajs/react';
|
|
import SidebarSubmenu from './SidebarSubmenu';
|
|
import XMarkIcon from '@heroicons/react/24/outline/XMarkIcon';
|
|
import routes from '../Routes/sidebar';
|
|
|
|
function LeftSidebar() {
|
|
const { url } = usePage();
|
|
|
|
const close = () => {
|
|
document.getElementById('left-sidebar-drawer').click();
|
|
};
|
|
|
|
return (
|
|
<div className="drawer-side z-30">
|
|
<label htmlFor="left-sidebar-drawer" className="drawer-overlay"></label>
|
|
<ul className="menu pt-2 w-80 bg-base-100 min-h-full text-base-content">
|
|
<button
|
|
className="btn btn-ghost bg-base-300 btn-circle z-50 top-0 right-0 mt-4 mr-2 absolute lg:hidden"
|
|
onClick={close}
|
|
>
|
|
<XMarkIcon className="h-5 w-5" />
|
|
</button>
|
|
<li className="mb-2 font-semibold text-xl">
|
|
<Link href="/dashboard">GoGoSantri</Link>
|
|
</li>
|
|
{routes.map((route, k) => (
|
|
<li key={k}>
|
|
{route.submenu ? (
|
|
<SidebarSubmenu {...route} />
|
|
) : (
|
|
<Link
|
|
href={route.path}
|
|
className={`relative font-normal ${route.path === url ? 'font-semibold bg-base-200' : ''
|
|
}`}
|
|
>
|
|
{route.path === url && (
|
|
<span
|
|
className="absolute inset-y-0 left-0 w-1 rounded-tr-md rounded-br-md bg-primary"
|
|
aria-hidden="true"
|
|
></span>
|
|
)}
|
|
{route.icon} {route.name}
|
|
</Link>
|
|
)}
|
|
</li>
|
|
))}
|
|
</ul>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export default LeftSidebar;
|