From 1698eadc943fbeca97e32a5857f95507fe62106e Mon Sep 17 00:00:00 2001
From: Tam Nhu Tran <kaitran.ntt@gmail.com>
Date: Wed, 25 Feb 2026 18:27:28 +0700
Subject: [PATCH] fix(ui): remove nested sidebar list markup

---
 ui/src/components/layout/app-sidebar.tsx | 59 +++++++++++-------------
 1 file changed, 27 insertions(+), 32 deletions(-)

diff --git a/ui/src/components/layout/app-sidebar.tsx b/ui/src/components/layout/app-sidebar.tsx
index c0a309b3..ed4631a4 100644
--- a/ui/src/components/layout/app-sidebar.tsx
+++ b/ui/src/components/layout/app-sidebar.tsx
@@ -172,38 +172,33 @@ export function AppSidebar() {
                         defaultOpen={isParentActive(item.children) || isRouteActive(item.path)}
                         className="group/collapsible"
                       >
-                        <SidebarMenuItem>
-                          {/* Click navigates to overview AND opens submenu */}
-                          <CollapsibleTrigger asChild>
-                            <SidebarMenuButton
-                              tooltip={getItemLabel(item)}
-                              isActive={isParentActive(item.children)}
-                              onClick={() => navigate(item.path)}
-                            >
-                              {renderMenuIcon(item)}
-                              <span className="group-data-[collapsible=icon]:hidden">
-                                {getItemLabel(item)}
-                              </span>
-                              <ChevronRight className="ml-auto transition-transform duration-200 group-data-[state=open]/collapsible:rotate-90 group-data-[collapsible=icon]:hidden" />
-                            </SidebarMenuButton>
-                          </CollapsibleTrigger>
-                          <CollapsibleContent>
-                            <SidebarMenuSub>
-                              {item.children.map((child) => (
-                                <SidebarMenuSubItem key={child.path}>
-                                  <SidebarMenuSubButton
-                                    asChild
-                                    isActive={isRouteActive(child.path)}
-                                  >
-                                    <Link to={child.path}>
-                                      <span>{child.label}</span>
-                                    </Link>
-                                  </SidebarMenuSubButton>
-                                </SidebarMenuSubItem>
-                              ))}
-                            </SidebarMenuSub>
-                          </CollapsibleContent>
-                        </SidebarMenuItem>
+                        {/* Click navigates to overview AND opens submenu */}
+                        <CollapsibleTrigger asChild>
+                          <SidebarMenuButton
+                            tooltip={getItemLabel(item)}
+                            isActive={isParentActive(item.children)}
+                            onClick={() => navigate(item.path)}
+                          >
+                            {renderMenuIcon(item)}
+                            <span className="group-data-[collapsible=icon]:hidden">
+                              {getItemLabel(item)}
+                            </span>
+                            <ChevronRight className="ml-auto transition-transform duration-200 group-data-[state=open]/collapsible:rotate-90 group-data-[collapsible=icon]:hidden" />
+                          </SidebarMenuButton>
+                        </CollapsibleTrigger>
+                        <CollapsibleContent>
+                          <SidebarMenuSub>
+                            {item.children.map((child) => (
+                              <SidebarMenuSubItem key={child.path}>
+                                <SidebarMenuSubButton asChild isActive={isRouteActive(child.path)}>
+                                  <Link to={child.path}>
+                                    <span>{child.label}</span>
+                                  </Link>
+                                </SidebarMenuSubButton>
+                              </SidebarMenuSubItem>
+                            ))}
+                          </SidebarMenuSub>
+                        </CollapsibleContent>
                       </Collapsible>
                     ) : (
                       <SidebarMenuButton