diff --git a/src/app/workspace/page.tsx b/src/app/workspace/page.tsx index 517fd54..e030b92 100644 --- a/src/app/workspace/page.tsx +++ b/src/app/workspace/page.tsx @@ -5,6 +5,7 @@ import AppSidebar, { SidebarTrigger } from "@/components/sidebar/AppSidebar"; import TaskView from "@/components/view/TaskView"; import useWorkspace from "@/hooks/workspace"; import { Task } from "@/lib/types"; +import { ChevronRight } from "lucide-react"; import { useEffect, useState } from "react"; const id = (prefix = "t") => @@ -20,7 +21,7 @@ export default function Workspace() { title: "New task", status: status, }; - workspace.entityData[workspace.route].setTasks((c: Task[]) => [...c, task]); + workspace.entities[workspace.route].setTasks((c: Task[]) => [...c, task]); }; return ( @@ -30,14 +31,16 @@ export default function Workspace() { <>
-
- Workspace +
+ {workspace.name} + + {workspace.entities[workspace.route].name}
- {workspace.entities.map((entity, i) => ( - + {workspace.entityLayout.map((entity, i) => ( + ))} diff --git a/src/components/sidebar/Entity.tsx b/src/components/sidebar/Entity.tsx index 9a7d75a..0ac8a64 100644 --- a/src/components/sidebar/Entity.tsx +++ b/src/components/sidebar/Entity.tsx @@ -9,44 +9,61 @@ import { } from "../ui/sidebar"; import { Collapsible, CollapsibleContent } from "../ui/collapsible"; import { ChevronDown } from "lucide-react"; -import { Entity } from "@/hooks/workspace"; +import { Workspace } from "@/hooks/workspace"; -export interface SidebarEntity extends Entity { - kind: "group" | "todo"; - children?: SidebarEntity[]; -} +export type SidebarEntity = + | { + kind: "group"; + name: string; + children: SidebarEntity[]; + } + | { + kind?: "item"; + id: string; + }; -export default function EntitySwitch({ entity }: { entity: SidebarEntity }) { - switch (entity.kind) { - case "group": - return ( - - - - - - {entity.name} - - - - - - - - {entity.children?.map((entity, i) => ( - - ))} - - - - - - ); - case "todo": - return ( - - {entity.name} - - ); +export default function EntitySwitch({ + entity, + workspace, +}: { + entity: SidebarEntity; + workspace: Workspace; +}) { + if (entity.kind === "group") { + return ( + + + + + + {entity.name} + + + + + + + + {entity.children?.map((entity, i) => ( + + ))} + + + + + + ); + } else { + return ( + + { + workspace.setRoute(entity.id); + }} + > + {workspace.entities[entity.id].name} + + + ); } } diff --git a/src/hooks/workspace.ts b/src/hooks/workspace.ts index dd1a9a2..65e9084 100644 --- a/src/hooks/workspace.ts +++ b/src/hooks/workspace.ts @@ -2,19 +2,21 @@ import { SidebarEntity } from "@/components/sidebar/Entity"; import { SetState, Task } from "@/lib/types"; import { useEffect, useState } from "react"; -export interface Entity { - id: string; +export type Entity = { name: string; -} + kind: "todo"; + setTasks: SetState; + tasks: Task[]; +}; -export type Workspace = { +export interface Workspace { name: string; - entities: SidebarEntity[]; - entityData: Record; + entityLayout: SidebarEntity[]; + entities: Record; route: string; setRoute: SetState; -}; +} function useTasks() { return useState([]); @@ -40,21 +42,32 @@ export default function useWorkspace(): Workspace { return { name: "Personal Workspace", - entities: [ - { - id: "alpha", - name: "Project alpha", - kind: "group", - children: [{ id: "alpha_tasks", name: "Tasks", kind: "todo" }], - }, - ], - - entityData: { + entities: { alpha_tasks: { + name: "Alpha tasks", + kind: "todo", + tasks, + setTasks, + }, + beta_tasks: { + name: "Beta tasks", + kind: "todo", tasks, setTasks, }, }, + entityLayout: [ + { + kind: "group", + name: "Project alpha", + children: [{ id: "alpha_tasks" }], + }, + { + kind: "group", + name: "Project beta", + children: [{ id: "beta_tasks" }], + }, + ], route, setRoute,