From b0fa792f8ece33ded17999ea2c94b83ccd2c8b2e Mon Sep 17 00:00:00 2001
From: Umesh Pal <umeshpal8141@gmail.com>
Date: Sat, 3 Jan 2026 09:08:57 +0000
Subject: [PATCH 1/2] fix(a11y): wrap SidebarItem with <li> in SidebarGroup

---
 .../src/Containers/Sidebar/SidebarGroup/index.tsx             | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/packages/ui-components/src/Containers/Sidebar/SidebarGroup/index.tsx b/packages/ui-components/src/Containers/Sidebar/SidebarGroup/index.tsx
index e156939474058..dd4fa7e976713 100644
--- a/packages/ui-components/src/Containers/Sidebar/SidebarGroup/index.tsx
+++ b/packages/ui-components/src/Containers/Sidebar/SidebarGroup/index.tsx
@@ -25,7 +25,9 @@ const SidebarGroup: FC<SidebarGroupProps> = ({
     <label className={styles.groupName}>{groupName}</label>
     <ul className={styles.itemList}>
       {items.map(({ label, link }) => (
-        <SidebarItem key={link} label={label} link={link} {...props} />
+        <li key={link}>
+          <SidebarItem label={label} link={link} {...props} />
+        </li>
       ))}
     </ul>
   </section>

From 0aceb3bb20cc083412b10ecb14eef24c43739642 Mon Sep 17 00:00:00 2001
From: Umesh Pal <umeshpal8141@gmail.com>
Date: Sun, 4 Jan 2026 03:21:59 +0000
Subject: [PATCH 2/2] refactor(a11y): move <li> wrapper from SidebarGroup to
 SidebarItem

---
 .../Containers/Sidebar/SidebarGroup/index.tsx |  4 +---
 .../Containers/Sidebar/SidebarItem/index.tsx  | 24 ++++++++++---------
 2 files changed, 14 insertions(+), 14 deletions(-)

diff --git a/packages/ui-components/src/Containers/Sidebar/SidebarGroup/index.tsx b/packages/ui-components/src/Containers/Sidebar/SidebarGroup/index.tsx
index dd4fa7e976713..e156939474058 100644
--- a/packages/ui-components/src/Containers/Sidebar/SidebarGroup/index.tsx
+++ b/packages/ui-components/src/Containers/Sidebar/SidebarGroup/index.tsx
@@ -25,9 +25,7 @@ const SidebarGroup: FC<SidebarGroupProps> = ({
     <label className={styles.groupName}>{groupName}</label>
     <ul className={styles.itemList}>
       {items.map(({ label, link }) => (
-        <li key={link}>
-          <SidebarItem label={label} link={link} {...props} />
-        </li>
+        <SidebarItem key={link} label={label} link={link} {...props} />
       ))}
     </ul>
   </section>
diff --git a/packages/ui-components/src/Containers/Sidebar/SidebarItem/index.tsx b/packages/ui-components/src/Containers/Sidebar/SidebarItem/index.tsx
index 3fa8912a6fad3..db2f57a3d9f0b 100644
--- a/packages/ui-components/src/Containers/Sidebar/SidebarItem/index.tsx
+++ b/packages/ui-components/src/Containers/Sidebar/SidebarItem/index.tsx
@@ -15,18 +15,20 @@ type SidebarItemProps = {
 };
 
 const SidebarItem: FC<SidebarItemProps> = ({ label, link, ...props }) => (
-  <BaseActiveLink
-    className={styles.item}
-    href={link}
-    activeClassName={styles.active}
-    {...props}
-  >
-    <div className={styles.label}>
-      <span>{label}</span>
+  <li>
+    <BaseActiveLink
+      className={styles.item}
+      href={link}
+      activeClassName={styles.active}
+      {...props}
+    >
+      <div className={styles.label}>
+        <span>{label}</span>
 
-      {/^https?:/.test(link) && <ArrowUpRightIcon className={styles.icon} />}
-    </div>
-  </BaseActiveLink>
+        {/^https?:/.test(link) && <ArrowUpRightIcon className={styles.icon} />}
+      </div>
+    </BaseActiveLink>
+  </li>
 );
 
 export default SidebarItem;