diff --git a/nx-dev/ui-common/src/lib/sidebar.tsx b/nx-dev/ui-common/src/lib/sidebar.tsx
index fa6d6e8271764..5819fa099315a 100644
--- a/nx-dev/ui-common/src/lib/sidebar.tsx
+++ b/nx-dev/ui-common/src/lib/sidebar.tsx
@@ -105,14 +105,17 @@ function SidebarSectionItems({
         )}
       </h5>
       <ul className={cx('mb-6', collapsed ? 'hidden' : '')}>
-        {(item.itemList as MenuItem[]).map((item, index) => {
-          const isActiveLink = item.path === withoutAnchors(router?.asPath);
+        {(item.itemList as MenuItem[]).map((subItem, index) => {
+          const isActiveLink = subItem.path === withoutAnchors(router?.asPath);
+          if (isActiveLink && collapsed) {
+            handleCollapseToggle();
+          }
           return (
             <li
-              key={item.id + '-' + index}
-              data-testid={`section-li:${item.id}`}
+              key={subItem.id + '-' + index}
+              data-testid={`section-li:${subItem.id}`}
             >
-              <Link href={item.path as string}>
+              <Link href={subItem.path as string}>
                 <a
                   className={cx(
                     'relative block py-1 text-gray-500 transition-colors duration-200 hover:text-gray-900'
@@ -126,7 +129,7 @@ function SidebarSectionItems({
                       'text-gray-900': isActiveLink,
                     })}
                   >
-                    {item.name}
+                    {subItem.name}
                   </span>
                 </a>
               </Link>