diff --git a/src/components/new-task-button.tsx b/src/components/new-task-button.tsx index 3167ce8..61288cf 100644 --- a/src/components/new-task-button.tsx +++ b/src/components/new-task-button.tsx @@ -1,10 +1,17 @@ import { useState, type ComponentProps } from "react"; -import { useNavigate } from "@tanstack/react-router"; +import { useNavigate, useRouterState } from "@tanstack/react-router"; import { useLiveQuery } from "@tanstack/react-db"; import { useHotkey } from "@tanstack/react-hotkeys"; -import { Loader2, Plus } from "lucide-react"; +import { ChevronDown, Loader2, Plus } from "lucide-react"; import { Button } from "@/components/ui/button"; import { Kbd } from "@/components/ui/kbd"; +import { + DropdownMenu, + DropdownMenuContent, + DropdownMenuItem, + DropdownMenuLabel, + DropdownMenuTrigger, +} from "@/components/ui/dropdown-menu"; import { Tooltip, TooltipContent, TooltipTrigger } from "@/components/ui/tooltip"; import { projectsCollection, tasksCollection } from "@/lib/collections"; import { createDesktopRunnerSession } from "@/lib/desktop-runner"; @@ -24,17 +31,30 @@ export function NewTaskButton({ }: NewTaskButtonProps) { const navigate = useNavigate(); const [creating, setCreating] = useState(false); + const pathname = useRouterState({ select: (state) => state.location.pathname }); const { data: projects } = useLiveQuery((query) => query.from({ p: projectsCollection }).orderBy(({ p }) => p.created_at, "asc"), ); + const { data: tasks } = useLiveQuery((query) => + query.from({ t: tasksCollection }).orderBy(({ t }) => t.updated_at, "desc"), + ); const [defaultProject] = projects; + const hasProjects = projects.length > 0; + const hasMultipleProjects = projects.length > 1; + const singleProject = hasMultipleProjects ? undefined : defaultProject; + const currentTaskId = pathname.startsWith("/tasks/") ? pathname.split("/")[2] : undefined; + const currentTask = currentTaskId ? tasks.find((task) => task.id === currentTaskId) : undefined; + const currentProject = currentTask?.project_id + ? projects.find((project) => project.id === currentTask.project_id) + : undefined; + const hotkeyProject = currentProject ?? defaultProject; - useHotkey(hotkeys.newTask.keys, () => handleNewTask(), { enabled: hotkeyEnabled }); + useHotkey(hotkeys.newTask.keys, () => handleNewTask(hotkeyProject), { enabled: hotkeyEnabled }); - function handleNewTask() { - const repoUrl = defaultProject?.repo_url; - if (creating || !defaultProject || !repoUrl) { + function handleNewTask(project = defaultProject) { + const repoUrl = project?.repo_url; + if (creating || !project || !repoUrl) { return; } @@ -45,8 +65,8 @@ export function NewTaskButton({ const taskId = crypto.randomUUID(); tasksCollection.insert({ id: taskId, - organization_id: defaultProject.organization_id, - project_id: defaultProject.id, + organization_id: project.organization_id, + project_id: project.id, title: taskTitle, status: "open", stream_id: null, @@ -86,20 +106,64 @@ export function NewTaskButton({ const button = ( ); + if (hasMultipleProjects) { + const content = ( + + Select project + {projects.map((project) => ( + handleNewTask(project)} + > + {project.name} + + ))} + + ); + + if (iconOnly) { + return ( + + + + {button} + + + + {hotkeys.newTask.label} + + + + + {content} + + ); + } + + return ( + + {button} + {content} + + ); + } + if (iconOnly) { return (