frontend

frontend/src/sidebar/Sidebar.jsx

@@ -29,12 +29,12 @@ const FolderNode = ({
 }) => {
   const isRoot = node.id === 'root';
   const hasChildren = Boolean(node.hasChildren);
-  const canToggle = !isRoot && (hasChildren || !node.loaded);
-  const showChevron = !isRoot && (hasChildren || !node.loaded);
+  const canToggle = hasChildren || !node.loaded;
+  const showChevron = canToggle;
   const icon = showChevron ? <ChevronIcon className="toggle-icon" /> : null;
   const canDrag = !isRoot;
   const isDragging = draggingFolderId === node.id;
-  const isExpanded = isRoot ? true : Boolean(node.expanded);
+  const isExpanded = Boolean(node.expanded);
   const rowClasses = ['folder-row'];
   if (isSelected) {
     rowClasses.push('active');
@@ -66,14 +66,12 @@ const FolderNode = ({
           }
         }}
       >
-        {!isRoot && (
-          <span
-            className={`toggle${showChevron ? '' : ' invisible'}${isExpanded ? ' expanded' : ''}`}
-            onClick={handleToggleClick}
-          >
-            {icon}
-          </span>
-        )}
+        <span
+          className={`toggle${showChevron ? '' : ' invisible'}${isExpanded ? ' expanded' : ''}`}
+          onClick={handleToggleClick}
+        >
+          {icon}
+        </span>
         <span className="name">
           <FolderIcon className="folder-icon-image" size={16} />
           {node.name}