Working system

src/components/sidebar/Entity.tsx

@@ -11,40 +11,24 @@ import {
 } from "../ui/sidebar";
 import { Collapsible, CollapsibleContent } from "../ui/collapsible";
 import { ChevronDown } from "lucide-react";
-import { Route, Workspace } from "@/lib/types";
-
-export type SidebarEntity =
-  | {
-      kind: "group";
-      id: string; // ✅ add stable id
-      name: string;
-      children: SidebarEntity[];
-    }
-  | {
-      kind?: "item";
-      id: string;
-    };
+import { Route, Workspace, LayoutNode } from "@/lib/types";
 
 type Props = {
-  entity: SidebarEntity;
+  node: LayoutNode;
   workspace: Workspace;
   setRoute: (route: Route) => void;
 };
 
-export default function EntitySwitch({
-  entity,
-  workspace,
-  setRoute,
-}: Props) {
+export default function EntitySwitch({ node, workspace, setRoute }: Props) {
   // ---- GROUP ----
-  if (entity.kind === "group") {
+  if (node.type === "group") {
     return (
       <Collapsible defaultOpen className="group/collapsible">
         <SidebarGroup>
           <SidebarGroupLabel asChild>
             <SidebarMenuButton asChild>
               <CollapsibleTrigger className="flex w-full items-center">
-                {entity.name}
+                {node.name}
                 <ChevronDown className="ml-auto h-4 w-4 transition-transform group-data-[state=open]/collapsible:rotate-180" />
               </CollapsibleTrigger>
             </SidebarMenuButton>
@@ -53,10 +37,10 @@ export default function EntitySwitch({
           <CollapsibleContent>
             <SidebarGroupContent>
               <SidebarMenu>
-                {entity.children.map((child) => (
+                {node.children.map((child) => (
                   <EntitySwitch
-                    key={child.id} // ✅ stable key
-                    entity={child}
+                    key={child.type === "group" ? child.id : child.entityId}
+                    node={child}
                     workspace={workspace}
                     setRoute={setRoute}
                   />
@@ -70,10 +54,10 @@ export default function EntitySwitch({
   }
 
   // ---- ITEM ----
-  const workspaceEntity = workspace.entities[entity.id];
+  const workspaceEntity = workspace.entities[node.entityId];
 
   if (!workspaceEntity) {
-    return null; // defensive against stale layout
+    return null;
   }
 
   return (
@@ -82,7 +66,7 @@ export default function EntitySwitch({
         onClick={() =>
           setRoute({
             workspace: workspace.id,
-            entity: entity.id,
+            entity: node.entityId,
           })
         }
       >
@@ -90,4 +74,4 @@ export default function EntitySwitch({
       </SidebarMenuButton>
     </SidebarMenuItem>
   );
-}
+}