feat: integrate sidebar functionality for mobile responsiveness
This commit is contained in:
parent
dc8ecf6c52
commit
16909d076b
@ -1,3 +1,4 @@
|
||||
import React from 'react';
|
||||
import AppLogo from '@/components/app-logo';
|
||||
import {
|
||||
Sidebar,
|
||||
@ -8,6 +9,7 @@ import {
|
||||
SidebarMenu,
|
||||
SidebarMenuButton,
|
||||
SidebarMenuItem,
|
||||
useSidebar,
|
||||
} from '@/components/ui/sidebar';
|
||||
import { useCurrentUrl } from '@/hooks/use-current-url';
|
||||
import { dashboard } from '@/routes';
|
||||
@ -23,7 +25,7 @@ import { index as customersIndex } from '@/routes/admin/master/customers';
|
||||
import { index as productsIndex } from '@/routes/admin/master/products';
|
||||
import { index as suppliersIndex } from '@/routes/admin/master/suppliers';
|
||||
import { index as rolesIndex } from '@/routes/admin/settings/roles';
|
||||
import { Link } from '@inertiajs/react';
|
||||
import { Link, router } from '@inertiajs/react';
|
||||
import type { LucideIcon } from 'lucide-react';
|
||||
import {
|
||||
Activity,
|
||||
@ -119,6 +121,17 @@ function MenuGroup({ label, items }: { label: string; items: NavMenuItem[] }) {
|
||||
|
||||
export function AppSidebar() {
|
||||
const { isCurrentUrl } = useCurrentUrl();
|
||||
const { isMobile, setOpenMobile } = useSidebar();
|
||||
|
||||
React.useEffect(() => {
|
||||
if (!isMobile) return;
|
||||
|
||||
const cleanup = router.on('finish', () => {
|
||||
setOpenMobile(false);
|
||||
});
|
||||
|
||||
return cleanup;
|
||||
}, [isMobile, setOpenMobile]);
|
||||
|
||||
return (
|
||||
<Sidebar collapsible="icon" variant="inset">
|
||||
|
||||
Loading…
Reference in New Issue
Block a user