@leanspec/ui 0.2.5-dev.20251120072524 → 0.2.5-dev.20251120093243

package/.next/standalone/packages/ui/src/components/project-switcher.tsx

@@ -6,225 +6,134 @@
 'use client';
 
 import React, { useState } from 'react';
-import { ChevronDown, ChevronUp, Star, FolderOpen, Plus, Search } from 'lucide-react';
-import { Button } from '@/components/ui/button';
-import { Input } from '@/components/ui/input';
+import { Check, ChevronsUpDown, Plus, FolderOpen, Star } from 'lucide-react';
 import { cn } from '@/lib/utils';
+import { Button } from '@/components/ui/button';
+import {
+  Command,
+  CommandEmpty,
+  CommandGroup,
+  CommandInput,
+  CommandItem,
+  CommandList,
+  CommandSeparator,
+} from '@/components/ui/command';
+import {
+  Popover,
+  PopoverContent,
+  PopoverTrigger,
+} from '@/components/ui/popover';
 import { useProject } from '@/contexts/project-context';
-import type { LocalProject } from '@/lib/projects/types';
+import { CreateProjectDialog } from '@/components/create-project-dialog';
 
 interface ProjectSwitcherProps {
   collapsed?: boolean;
-  onAddProject?: () => void;
+  onAddProject?: () => void; // Kept for compatibility, but we'll use internal dialog
 }
 
-export function ProjectSwitcher({ collapsed, onAddProject }: ProjectSwitcherProps) {
+export function ProjectSwitcher({ collapsed }: ProjectSwitcherProps) {
   const {
+    mode,
     currentProject,
-    recentProjects,
-    favoriteProjects,
     projects,
     switchProject,
-    toggleFavorite,
   } = useProject();
   
-  const [isExpanded, setIsExpanded] = useState(false);
-  const [searchQuery, setSearchQuery] = useState('');
+  const [open, setOpen] = useState(false);
+  const [showNewProjectDialog, setShowNewProjectDialog] = useState(false);
 
-  const filteredProjects = projects.filter((p) =>
-    p.name.toLowerCase().includes(searchQuery.toLowerCase())
-  );
+  if (mode !== 'multi-project') {
+    return null;
+  }
 
-  const handleProjectClick = async (projectId: string) => {
+  const handleProjectSelect = async (projectId: string) => {
     await switchProject(projectId);
-    setIsExpanded(false);
-  };
-
-  const handleToggleFavorite = async (e: React.MouseEvent, projectId: string) => {
-    e.stopPropagation();
-    await toggleFavorite(projectId);
+    setOpen(false);
   };
 
-  if (collapsed) {
-    return (
-      <Button
-        variant="ghost"
-        size="sm"
-        className="w-full justify-center px-2"
-        onClick={() => setIsExpanded(!isExpanded)}
-      >
-        <FolderOpen className="h-5 w-5" />
-      </Button>
-    );
-  }
+  const sortedProjects = [...projects].sort((a, b) => {
+    if (a.favorite === b.favorite) return 0;
+    return a.favorite ? -1 : 1;
+  });
 
   return (
-    <div className="border-b border-border">
-      {/* Current Project Header */}
-      <Button
-        variant="ghost"
-        className="w-full justify-between px-3 py-4 h-auto hover:bg-accent"
-        onClick={() => setIsExpanded(!isExpanded)}
-      >
-        <div className="flex items-center gap-2 min-w-0">
-          <FolderOpen className="h-4 w-4 shrink-0" />
-          <div className="flex flex-col items-start min-w-0">
-            <span className="text-sm font-medium truncate w-full">
-              {currentProject?.name || 'Select Project'}
-            </span>
-            <span className="text-xs text-muted-foreground">
-              {isExpanded ? 'Hide projects' : 'Switch project'}
-            </span>
-          </div>
-        </div>
-        {isExpanded ? (
-          <ChevronUp className="h-4 w-4 shrink-0" />
-        ) : (
-          <ChevronDown className="h-4 w-4 shrink-0" />
-        )}
-      </Button>
-
-      {/* Expanded Project List */}
-      {isExpanded && (
-        <div className="px-2 pb-3 space-y-3">
-          {/* Search */}
-          <div className="relative">
-            <Search className="absolute left-2 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground" />
-            <Input
-              placeholder="Search projects..."
-              value={searchQuery}
-              onChange={(e) => setSearchQuery(e.target.value)}
-              className="pl-8 h-8"
-            />
-          </div>
-
-          {/* Favorites */}
-          {favoriteProjects.length > 0 && !searchQuery && (
-            <div>
-              <div className="px-2 mb-1">
-                <span className="text-xs font-semibold text-muted-foreground">
-                  ⭐ FAVORITES
-                </span>
-              </div>
-              <div className="space-y-0.5">
-                {favoriteProjects.map((project) => (
-                  <ProjectItem
-                    key={project.id}
-                    project={project}
-                    isCurrent={currentProject?.id === project.id}
-                    onSelect={handleProjectClick}
-                    onToggleFavorite={handleToggleFavorite}
-                  />
-                ))}
-              </div>
-            </div>
-          )}
-
-          {/* Recent Projects */}
-          {recentProjects.length > 0 && !searchQuery && (
-            <div>
-              <div className="px-2 mb-1">
-                <span className="text-xs font-semibold text-muted-foreground">
-                  📌 RECENT
-                </span>
-              </div>
-              <div className="space-y-0.5">
-                {recentProjects
-                  .filter((p) => !favoriteProjects.find((f) => f.id === p.id))
-                  .map((project) => (
-                    <ProjectItem
-                      key={project.id}
-                      project={project}
-                      isCurrent={currentProject?.id === project.id}
-                      onSelect={handleProjectClick}
-                      onToggleFavorite={handleToggleFavorite}
-                    />
-                  ))}
-              </div>
-            </div>
-          )}
-
-          {/* All Projects / Search Results */}
-          {(searchQuery || projects.length > 5) && (
-            <div>
-              <div className="px-2 mb-1">
-                <span className="text-xs font-semibold text-muted-foreground">
-                  {searchQuery ? 'SEARCH RESULTS' : `📂 ALL PROJECTS (${projects.length})`}
-                </span>
-              </div>
-              <div className="space-y-0.5 max-h-48 overflow-y-auto">
-                {filteredProjects.map((project) => (
-                  <ProjectItem
-                    key={project.id}
-                    project={project}
-                    isCurrent={currentProject?.id === project.id}
-                    onSelect={handleProjectClick}
-                    onToggleFavorite={handleToggleFavorite}
-                  />
-                ))}
-                {filteredProjects.length === 0 && (
-                  <div className="px-2 py-3 text-sm text-muted-foreground text-center">
-                    No projects found
-                  </div>
-                )}
-              </div>
-            </div>
-          )}
-
-          {/* Add Project Button */}
+    <>
+      <CreateProjectDialog 
+        open={showNewProjectDialog} 
+        onOpenChange={setShowNewProjectDialog} 
+      />
+      <Popover open={open} onOpenChange={setOpen}>
+        <PopoverTrigger asChild>
           <Button
             variant="outline"
-            size="sm"
-            className="w-full justify-start gap-2"
-            onClick={onAddProject}
+            role="combobox"
+            aria-expanded={open}
+            className={cn(
+              "w-full justify-between",
+              collapsed ? "h-9 w-9 p-0 justify-center" : "px-3"
+            )}
           >
-            <Plus className="h-4 w-4" />
-            Add Project
+            {collapsed ? (
+              <FolderOpen className="h-4 w-4" />
+            ) : (
+              <>
+                <div className="flex items-center gap-2 truncate">
+                  <FolderOpen className="h-4 w-4 shrink-0 opacity-50" />
+                  <span className="truncate">
+                    {currentProject?.name || "Select project..."}
+                  </span>
+                </div>
+                <ChevronsUpDown className="ml-2 h-4 w-4 shrink-0 opacity-50" />
+              </>
+            )}
           </Button>
-        </div>
-      )}
-    </div>
-  );
-}
-
-interface ProjectItemProps {
-  project: LocalProject;
-  isCurrent: boolean;
-  onSelect: (projectId: string) => void;
-  onToggleFavorite: (e: React.MouseEvent, projectId: string) => void;
-}
-
-function ProjectItem({ project, isCurrent, onSelect, onToggleFavorite }: ProjectItemProps) {
-  return (
-    <button
-      className={cn(
-        'w-full flex items-center gap-2 px-2 py-1.5 rounded text-sm transition-colors',
-        'hover:bg-accent hover:text-accent-foreground',
-        isCurrent && 'bg-accent text-accent-foreground font-medium'
-      )}
-      onClick={() => onSelect(project.id)}
-    >
-      {/* Color indicator */}
-      {project.color && (
-        <div
-          className="h-3 w-3 rounded-full shrink-0"
-          style={{ backgroundColor: project.color }}
-        />
-      )}
-      
-      {/* Project name */}
-      <span className="flex-1 text-left truncate">{project.name}</span>
-      
-      {/* Favorite star */}
-      <button
-        className={cn(
-          'p-0.5 rounded hover:bg-background/80 transition-colors',
-          project.favorite ? 'text-yellow-500' : 'text-muted-foreground hover:text-yellow-500'
-        )}
-        onClick={(e) => onToggleFavorite(e, project.id)}
-      >
-        <Star className={cn('h-3.5 w-3.5', project.favorite && 'fill-current')} />
-      </button>
-    </button>
+        </PopoverTrigger>
+        <PopoverContent className="w-[200px] p-0" align="start">
+          <Command>
+            <CommandInput placeholder="Search projects..." />
+            <CommandList>
+              <CommandEmpty>No project found.</CommandEmpty>
+              <CommandGroup heading="Projects">
+                {sortedProjects.map((project) => (
+                  <CommandItem
+                    key={project.id}
+                    onSelect={() => handleProjectSelect(project.id)}
+                    className="text-sm"
+                  >
+                    <div className="flex items-center gap-2 w-full">
+                      <Check
+                        className={cn(
+                          "mr-2 h-4 w-4",
+                          currentProject?.id === project.id
+                            ? "opacity-100"
+                            : "opacity-0"
+                        )}
+                      />
+                      <span className="truncate flex-1">{project.name}</span>
+                      {project.favorite && (
+                        <Star className="h-3 w-3 fill-yellow-500 text-yellow-500" />
+                      )}
+                    </div>
+                  </CommandItem>
+                ))}
+              </CommandGroup>
+              <CommandSeparator />
+              <CommandGroup>
+                <CommandItem
+                  className="cursor-pointer"
+                  onSelect={() => {
+                    setOpen(false);
+                    setShowNewProjectDialog(true);
+                  }}
+                >
+                  <Plus className="mr-2 h-4 w-4" />
+                  Create Project
+                </CommandItem>
+              </CommandGroup>
+            </CommandList>
+          </Command>
+        </PopoverContent>
+      </Popover>
+    </>
   );
 }

package/.next/standalone/packages/ui/src/components/ui/dropdown-menu.tsx

@@ -0,0 +1,200 @@
+"use client"
+
+import * as React from "react"
+import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu"
+import { Check, ChevronRight, Circle } from "lucide-react"
+
+import { cn } from "@/lib/utils"
+
+const DropdownMenu = DropdownMenuPrimitive.Root
+
+const DropdownMenuTrigger = DropdownMenuPrimitive.Trigger
+
+const DropdownMenuGroup = DropdownMenuPrimitive.Group
+
+const DropdownMenuPortal = DropdownMenuPrimitive.Portal
+
+const DropdownMenuSub = DropdownMenuPrimitive.Sub
+
+const DropdownMenuRadioGroup = DropdownMenuPrimitive.RadioGroup
+
+const DropdownMenuSubTrigger = React.forwardRef<
+  React.ElementRef<typeof DropdownMenuPrimitive.SubTrigger>,
+  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.SubTrigger> & {
+    inset?: boolean
+  }
+>(({ className, inset, children, ...props }, ref) => (
+  <DropdownMenuPrimitive.SubTrigger
+    ref={ref}
+    className={cn(
+      "flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent data-[state=open]:bg-accent",
+      inset && "pl-8",
+      className
+    )}
+    {...props}
+  >
+    {children}
+    <ChevronRight className="ml-auto h-4 w-4" />
+  </DropdownMenuPrimitive.SubTrigger>
+))
+DropdownMenuSubTrigger.displayName =
+  DropdownMenuPrimitive.SubTrigger.displayName
+
+const DropdownMenuSubContent = React.forwardRef<
+  React.ElementRef<typeof DropdownMenuPrimitive.SubContent>,
+  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.SubContent>
+>(({ className, ...props }, ref) => (
+  <DropdownMenuPrimitive.SubContent
+    ref={ref}
+    className={cn(
+      "z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-lg data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
+      className
+    )}
+    {...props}
+  />
+))
+DropdownMenuSubContent.displayName =
+  DropdownMenuPrimitive.SubContent.displayName
+
+const DropdownMenuContent = React.forwardRef<
+  React.ElementRef<typeof DropdownMenuPrimitive.Content>,
+  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Content>
+>(({ className, sideOffset = 4, ...props }, ref) => (
+  <DropdownMenuPrimitive.Portal>
+    <DropdownMenuPrimitive.Content
+      ref={ref}
+      sideOffset={sideOffset}
+      className={cn(
+        "z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
+        className
+      )}
+      {...props}
+    />
+  </DropdownMenuPrimitive.Portal>
+))
+DropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName
+
+const DropdownMenuItem = React.forwardRef<
+  React.ElementRef<typeof DropdownMenuPrimitive.Item>,
+  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Item> & {
+    inset?: boolean
+  }
+>(({ className, inset, ...props }, ref) => (
+  <DropdownMenuPrimitive.Item
+    ref={ref}
+    className={cn(
+      "relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+      inset && "pl-8",
+      className
+    )}
+    {...props}
+  />
+))
+DropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName
+
+const DropdownMenuCheckboxItem = React.forwardRef<
+  React.ElementRef<typeof DropdownMenuPrimitive.CheckboxItem>,
+  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.CheckboxItem>
+>(({ className, children, checked, ...props }, ref) => (
+  <DropdownMenuPrimitive.CheckboxItem
+    ref={ref}
+    className={cn(
+      "relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+      className
+    )}
+    checked={checked}
+    {...props}
+  >
+    <span className="absolute left-2 flex h-3.5 w-3.5 items-center justify-center">
+      <DropdownMenuPrimitive.ItemIndicator>
+        <Check className="h-4 w-4" />
+      </DropdownMenuPrimitive.ItemIndicator>
+    </span>
+    {children}
+  </DropdownMenuPrimitive.CheckboxItem>
+))
+DropdownMenuCheckboxItem.displayName =
+  DropdownMenuPrimitive.CheckboxItem.displayName
+
+const DropdownMenuRadioItem = React.forwardRef<
+  React.ElementRef<typeof DropdownMenuPrimitive.RadioItem>,
+  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.RadioItem>
+>(({ className, children, ...props }, ref) => (
+  <DropdownMenuPrimitive.RadioItem
+    ref={ref}
+    className={cn(
+      "relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+      className
+    )}
+    {...props}
+  >
+    <span className="absolute left-2 flex h-3.5 w-3.5 items-center justify-center">
+      <DropdownMenuPrimitive.ItemIndicator>
+        <Circle className="h-2 w-2 fill-current" />
+      </DropdownMenuPrimitive.ItemIndicator>
+    </span>
+    {children}
+  </DropdownMenuPrimitive.RadioItem>
+))
+DropdownMenuRadioItem.displayName = DropdownMenuPrimitive.RadioItem.displayName
+
+const DropdownMenuLabel = React.forwardRef<
+  React.ElementRef<typeof DropdownMenuPrimitive.Label>,
+  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Label> & {
+    inset?: boolean
+  }
+>(({ className, inset, ...props }, ref) => (
+  <DropdownMenuPrimitive.Label
+    ref={ref}
+    className={cn(
+      "px-2 py-1.5 text-sm font-semibold",
+      inset && "pl-8",
+      className
+    )}
+    {...props}
+  />
+))
+DropdownMenuLabel.displayName = DropdownMenuPrimitive.Label.displayName
+
+const DropdownMenuSeparator = React.forwardRef<
+  React.ElementRef<typeof DropdownMenuPrimitive.Separator>,
+  React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Separator>
+>(({ className, ...props }, ref) => (
+  <DropdownMenuPrimitive.Separator
+    ref={ref}
+    className={cn("-mx-1 my-1 h-px bg-muted", className)}
+    {...props}
+  />
+))
+DropdownMenuSeparator.displayName = DropdownMenuPrimitive.Separator.displayName
+
+const DropdownMenuShortcut = ({
+  className,
+  ...props
+}: React.HTMLAttributes<HTMLSpanElement>) => {
+  return (
+    <span
+      className={cn("ml-auto text-xs tracking-widest opacity-60", className)}
+      {...props}
+    />
+  )
+}
+DropdownMenuShortcut.displayName = "DropdownMenuShortcut"
+
+export {
+  DropdownMenu,
+  DropdownMenuTrigger,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuCheckboxItem,
+  DropdownMenuRadioItem,
+  DropdownMenuLabel,
+  DropdownMenuSeparator,
+  DropdownMenuShortcut,
+  DropdownMenuGroup,
+  DropdownMenuPortal,
+  DropdownMenuSub,
+  DropdownMenuSubContent,
+  DropdownMenuSubTrigger,
+  DropdownMenuRadioGroup,
+}

package/.next/standalone/packages/ui/src/components/ui/popover.tsx

@@ -0,0 +1,31 @@
+"use client"
+
+import * as React from "react"
+import * as PopoverPrimitive from "@radix-ui/react-popover"
+
+import { cn } from "@/lib/utils"
+
+const Popover = PopoverPrimitive.Root
+
+const PopoverTrigger = PopoverPrimitive.Trigger
+
+const PopoverContent = React.forwardRef<
+  React.ElementRef<typeof PopoverPrimitive.Content>,
+  React.ComponentPropsWithoutRef<typeof PopoverPrimitive.Content>
+>(({ className, align = "center", sideOffset = 4, ...props }, ref) => (
+  <PopoverPrimitive.Portal>
+    <PopoverPrimitive.Content
+      ref={ref}
+      align={align}
+      sideOffset={sideOffset}
+      className={cn(
+        "z-50 w-72 rounded-md border bg-popover p-4 text-popover-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
+        className
+      )}
+      {...props}
+    />
+  </PopoverPrimitive.Portal>
+))
+PopoverContent.displayName = PopoverPrimitive.Content.displayName
+
+export { Popover, PopoverTrigger, PopoverContent }

package/.next/standalone/packages/ui/src/contexts/project-context.tsx

@@ -9,6 +9,7 @@ import React, { createContext, useContext, useState, useEffect, useCallback } fr
 import type { LocalProject } from '@/lib/projects/types';
 
 interface ProjectContextType {
+  mode: 'multi-project' | 'single-project';
   currentProject: LocalProject | null;
   projects: LocalProject[];
   recentProjects: LocalProject[];
@@ -39,6 +40,7 @@ interface ProjectProviderProps {
 }
 
 export function ProjectProvider({ children, initialProjectId }: ProjectProviderProps) {
+  const [mode, setMode] = useState<'multi-project' | 'single-project'>('single-project');
   const [currentProject, setCurrentProject] = useState<LocalProject | null>(null);
   const [projects, setProjects] = useState<LocalProject[]>([]);
   const [recentProjects, setRecentProjects] = useState<LocalProject[]>([]);
@@ -52,12 +54,13 @@ export function ProjectProvider({ children, initialProjectId }: ProjectProviderP
       setIsLoading(true);
       setError(null);
 
-      const response = await fetch('/api/local-projects');
+      const response = await fetch('/api/projects');
       if (!response.ok) {
         throw new Error('Failed to fetch projects');
       }
 
       const data = await response.json();
+      setMode(data.mode || 'single-project');
       setProjects(data.projects || []);
       setRecentProjects(data.recentProjects || []);
       setFavoriteProjects(data.favoriteProjects || []);
@@ -83,7 +86,7 @@ export function ProjectProvider({ children, initialProjectId }: ProjectProviderP
   // Switch to a different project
   const switchProject = useCallback(async (projectId: string) => {
     try {
-      const response = await fetch(`/api/local-projects/${projectId}`);
+      const response = await fetch(`/api/projects/${projectId}`);
       if (!response.ok) {
         throw new Error('Failed to fetch project');
       }
@@ -106,7 +109,7 @@ export function ProjectProvider({ children, initialProjectId }: ProjectProviderP
     options?: { favorite?: boolean; color?: string }
   ): Promise<LocalProject> => {
     try {
-      const response = await fetch('/api/local-projects', {
+      const response = await fetch('/api/projects', {
         method: 'POST',
         headers: { 'Content-Type': 'application/json' },
         body: JSON.stringify({ path, ...options }),
@@ -130,7 +133,7 @@ export function ProjectProvider({ children, initialProjectId }: ProjectProviderP
   // Remove a project
   const removeProject = useCallback(async (projectId: string) => {
     try {
-      const response = await fetch(`/api/local-projects/${projectId}`, {
+      const response = await fetch(`/api/projects/${projectId}`, {
         method: 'DELETE',
       });
 
@@ -155,7 +158,7 @@ export function ProjectProvider({ children, initialProjectId }: ProjectProviderP
   // Toggle favorite status
   const toggleFavorite = useCallback(async (projectId: string) => {
     try {
-      const response = await fetch(`/api/local-projects/${projectId}`, {
+      const response = await fetch(`/api/projects/${projectId}`, {
         method: 'PATCH',
         headers: { 'Content-Type': 'application/json' },
         body: JSON.stringify({ favorite: true }),
@@ -179,7 +182,7 @@ export function ProjectProvider({ children, initialProjectId }: ProjectProviderP
     updates: Partial<Pick<LocalProject, 'name' | 'color' | 'description'>>
   ) => {
     try {
-      const response = await fetch(`/api/local-projects/${projectId}`, {
+      const response = await fetch(`/api/projects/${projectId}`, {
         method: 'PATCH',
         headers: { 'Content-Type': 'application/json' },
         body: JSON.stringify(updates),
@@ -203,6 +206,7 @@ export function ProjectProvider({ children, initialProjectId }: ProjectProviderP
   }, []);
 
   const value: ProjectContextType = {
+    mode,
     currentProject,
     projects,
     recentProjects,