fix: add correctly switch case to components on sidebar (#2802)

* 📝 (headerComponent/index.tsx): Remove unnecessary width styling from header-end-division class
🔧 (sidebarComponent/index.tsx): Ensure correct import of cn function from utils/utils file
💡 (sidebarComponent/index.tsx): Refactor sidebarContent logic to cover all conditions and provide a default case if necessary

* 📝 (sidebarComponent/index.tsx): remove unnecessary comment about ensuring correct import of cn function

src/frontend/src/components/headerComponent/index.tsx

@@ -134,7 +134,7 @@ export default function Header(): JSX.Element {
           </Link>
         )}
       </div>
-      <div className="header-end-division lg:w-[407px]">
+      <div className="header-end-division">
         <div className="header-end-display">
           <a
             href="https://github.com/langflow-ai/langflow"

src/frontend/src/components/sidebarComponent/index.tsx

@@ -34,22 +34,22 @@ export default function SidebarNav({
   const pathValues = ["folder", "components", "flows", "all"];
   const isFolderPath = pathValues.some((value) => pathname.includes(value));
 
+  // Ensure all conditions are covered and provide a default case if necessary
+  const sidebarContent =
+    items.length > 0 ? (
+      <SideBarButtonsComponent items={items} pathname={pathname} />
+    ) : !loadingFolders && folders?.length > 0 && isFolderPath ? (
+      <SideBarFoldersButtonsComponent
+        pathname={pathname}
+        handleChangeFolder={handleChangeFolder}
+        handleDeleteFolder={handleDeleteFolder}
+      />
+    ) : null;
+
   return (
     <nav className={cn(className)} {...props}>
       <HorizontalScrollFadeComponent>
-        {items.length > 0 ? (
+        {sidebarContent!}
-          <SideBarButtonsComponent items={items} pathname={pathname} />
-        ) : (
-          !loadingFolders &&
-          folders?.length > 0 &&
-          isFolderPath && (
-            <SideBarFoldersButtonsComponent
-              pathname={pathname}
-              handleChangeFolder={handleChangeFolder}
-              handleDeleteFolder={handleDeleteFolder}
-            />
-          )
-        )}
       </HorizontalScrollFadeComponent>
     </nav>
   );