resources/js/components/nav-main.tsx

@@ -1,6 +1,5 @@
 "use client"
 
-import { usePage } from "@inertiajs/react"
 import {
   SidebarGroup,
   SidebarGroupLabel,
@@ -25,11 +24,10 @@ export function NavMain({
 }: {
   items: (NavGroup | NavItem)[]
 }) {
-  const { url } = usePage()
 
   return (
     <>
-      {items.map((item) => {
+      {items.map((item, index) => {
         if ("label" in item) {
           return (
             <SidebarGroup key={item.label} className="group-data-[collapsible=icon]:hidden">
@@ -37,7 +35,7 @@ export function NavMain({
               <SidebarMenu>
                 {item.items.map((child) => (
                   <SidebarMenuItem key={child.name}>
-                    <SidebarMenuButton asChild isActive={url === child.url}>
+                    <SidebarMenuButton asChild>
                       <a href={child.url}>
                         <child.icon className="h-4 w-4" />
                         <span>{child.name}</span>
@@ -54,7 +52,7 @@ export function NavMain({
           <SidebarGroup key={item.name} className="group-data-[collapsible=icon]:hidden">
             <SidebarMenu>
               <SidebarMenuItem>
-                <SidebarMenuButton asChild isActive={url === item.url}>
+                <SidebarMenuButton asChild>
                   <a href={item.url}>
                     <item.icon className="h-4 w-4" />
                     <span>{item.name}</span>