From 03a8b837b661c0550049f993220cbe36b1af2129 Mon Sep 17 00:00:00 2001 From: Leo dev Date: Tue, 11 Nov 2025 19:56:13 +0100 Subject: [PATCH] Small thing --- src/app/workspace/page.tsx | 20 +- src/components/Router.tsx | 16 ++ src/components/sidebar/AppSidebar.tsx | 21 +-- src/components/sidebar/Entity.tsx | 1 + src/components/ui/dropdown-menu.tsx | 257 ++++++++++++++++++++++++++ src/hooks/workspace.ts | 30 +++ 6 files changed, 312 insertions(+), 33 deletions(-) create mode 100644 src/components/Router.tsx create mode 100644 src/components/ui/dropdown-menu.tsx create mode 100644 src/hooks/workspace.ts diff --git a/src/app/workspace/page.tsx b/src/app/workspace/page.tsx index dfe152b..4a60eea 100644 --- a/src/app/workspace/page.tsx +++ b/src/app/workspace/page.tsx @@ -1,8 +1,9 @@ "use client"; +import Router from "@/components/Router"; import AppSidebar, { SidebarTrigger } from "@/components/sidebar/AppSidebar"; -import BoardView from "@/components/view/board/BoardView"; import TaskView from "@/components/view/TaskView"; +import useWorkspace from "@/hooks/workspace"; import { Task } from "@/lib/types"; import { useEffect, useState } from "react"; @@ -11,20 +12,7 @@ const id = (prefix = "t") => export default function Workspace() { const [tasks, setTasks] = useState([]); - - useEffect(() => { - setTasks([ - { id: id(), title: "Buy groceries", status: "todo" }, - { id: id(), title: "Plan sprint", status: "todo" }, - { - id: id(), - title: "Build App", - description: "A simple description", - tags: ["website", "api", "app"], - status: "inprogress", - }, - ]); - }, []); + const workspace = useWorkspace(); const createTask = (status: string) => { const task: Task = { @@ -36,7 +24,7 @@ export default function Workspace() { }; return ( - +
diff --git a/src/components/Router.tsx b/src/components/Router.tsx new file mode 100644 index 0000000..0d059c7 --- /dev/null +++ b/src/components/Router.tsx @@ -0,0 +1,16 @@ +"use client"; + +import { SetState } from "@/lib/types"; +import React, { useState } from "react"; + +export default function Router({ + children, + route, + setRoute, +}: { + children: (route: string) => React.JSX.Element; + route: string; + setRoute: SetState; +}) { + return children(route); +} diff --git a/src/components/sidebar/AppSidebar.tsx b/src/components/sidebar/AppSidebar.tsx index a2fc26b..4d12cc4 100644 --- a/src/components/sidebar/AppSidebar.tsx +++ b/src/components/sidebar/AppSidebar.tsx @@ -8,7 +8,7 @@ import { SidebarProvider, useSidebar, } from "@/components/ui/sidebar"; -import EntitySwitch, { Entity } from "./Entity"; +import EntitySwitch from "./Entity"; import { DropdownMenu, DropdownMenuContent, @@ -16,27 +16,14 @@ import { DropdownMenuTrigger, } from "../ui/dropdown-menu"; import { ChevronDown } from "lucide-react"; - -interface Workspace { - name: string; - entities: Entity[]; -} - -const workspace: Workspace = { - name: "Personal Workspace", - entities: [ - { - name: "Project alpha", - kind: "group", - children: [{ name: "Tasks", kind: "todo" }], - }, - ], -}; +import { Workspace } from "@/hooks/workspace"; export default function AppSidebar({ children, + workspace, }: Readonly<{ children: React.ReactNode; + workspace: Workspace; }>) { return ( diff --git a/src/components/sidebar/Entity.tsx b/src/components/sidebar/Entity.tsx index 70f05e6..34c68cb 100644 --- a/src/components/sidebar/Entity.tsx +++ b/src/components/sidebar/Entity.tsx @@ -11,6 +11,7 @@ import { Collapsible, CollapsibleContent } from "../ui/collapsible"; import { ChevronDown } from "lucide-react"; export interface Entity { + id: string; name: string; kind: "group" | "todo"; children?: Entity[]; diff --git a/src/components/ui/dropdown-menu.tsx b/src/components/ui/dropdown-menu.tsx new file mode 100644 index 0000000..bbe6fb0 --- /dev/null +++ b/src/components/ui/dropdown-menu.tsx @@ -0,0 +1,257 @@ +"use client" + +import * as React from "react" +import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu" +import { CheckIcon, ChevronRightIcon, CircleIcon } from "lucide-react" + +import { cn } from "@/lib/utils" + +function DropdownMenu({ + ...props +}: React.ComponentProps) { + return +} + +function DropdownMenuPortal({ + ...props +}: React.ComponentProps) { + return ( + + ) +} + +function DropdownMenuTrigger({ + ...props +}: React.ComponentProps) { + return ( + + ) +} + +function DropdownMenuContent({ + className, + sideOffset = 4, + ...props +}: React.ComponentProps) { + return ( + + + + ) +} + +function DropdownMenuGroup({ + ...props +}: React.ComponentProps) { + return ( + + ) +} + +function DropdownMenuItem({ + className, + inset, + variant = "default", + ...props +}: React.ComponentProps & { + inset?: boolean + variant?: "default" | "destructive" +}) { + return ( + + ) +} + +function DropdownMenuCheckboxItem({ + className, + children, + checked, + ...props +}: React.ComponentProps) { + return ( + + + + + + + {children} + + ) +} + +function DropdownMenuRadioGroup({ + ...props +}: React.ComponentProps) { + return ( + + ) +} + +function DropdownMenuRadioItem({ + className, + children, + ...props +}: React.ComponentProps) { + return ( + + + + + + + {children} + + ) +} + +function DropdownMenuLabel({ + className, + inset, + ...props +}: React.ComponentProps & { + inset?: boolean +}) { + return ( + + ) +} + +function DropdownMenuSeparator({ + className, + ...props +}: React.ComponentProps) { + return ( + + ) +} + +function DropdownMenuShortcut({ + className, + ...props +}: React.ComponentProps<"span">) { + return ( + + ) +} + +function DropdownMenuSub({ + ...props +}: React.ComponentProps) { + return +} + +function DropdownMenuSubTrigger({ + className, + inset, + children, + ...props +}: React.ComponentProps & { + inset?: boolean +}) { + return ( + + {children} + + + ) +} + +function DropdownMenuSubContent({ + className, + ...props +}: React.ComponentProps) { + return ( + + ) +} + +export { + DropdownMenu, + DropdownMenuPortal, + DropdownMenuTrigger, + DropdownMenuContent, + DropdownMenuGroup, + DropdownMenuLabel, + DropdownMenuItem, + DropdownMenuCheckboxItem, + DropdownMenuRadioGroup, + DropdownMenuRadioItem, + DropdownMenuSeparator, + DropdownMenuShortcut, + DropdownMenuSub, + DropdownMenuSubTrigger, + DropdownMenuSubContent, +} diff --git a/src/hooks/workspace.ts b/src/hooks/workspace.ts new file mode 100644 index 0000000..7aac325 --- /dev/null +++ b/src/hooks/workspace.ts @@ -0,0 +1,30 @@ +import { Entity } from "@/components/sidebar/Entity"; +import { SetState } from "@/lib/types"; +import { useState } from "react"; + +export type Workspace = { + name: string; + entities: Entity[]; + + route: string; + setRoute: SetState; +}; + +export default function useWorkspace(): Workspace { + const [route, setRoute] = useState(""); + + return { + name: "Personal Workspace", + entities: [ + { + id: "alpha", + name: "Project alpha", + kind: "group", + children: [{ id: "alpha_tasks", name: "Tasks", kind: "todo" }], + }, + ], + + route, + setRoute, + }; +}