From 4af319f4258ebf6e79801d3b9bcc569050e27226 Mon Sep 17 00:00:00 2001
From: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>
Date: Tue, 14 Apr 2026 04:05:54 +0000
Subject: [PATCH] Disable project creation when user has 10 projects

- Add MAX_PROJECTS constant (10)
- When at limit, disable 'New project' button with reduced opacity and cursor-not-allowed
- Show tooltip on hover explaining 'Maximum of 10 projects reached'
- Uses existing Tooltip component from shadcn/ui

Co-Authored-By: tony@opensecret.cloud <TonyGiorgio@protonmail.com>
---
 frontend/src/components/ChatHistoryList.tsx | 37 ++++++++++++++++-----
 1 file changed, 29 insertions(+), 8 deletions(-)

diff --git a/frontend/src/components/ChatHistoryList.tsx b/frontend/src/components/ChatHistoryList.tsx
index bb0d2b8b..c8d31492 100644
--- a/frontend/src/components/ChatHistoryList.tsx
+++ b/frontend/src/components/ChatHistoryList.tsx
@@ -28,6 +28,7 @@ import { Checkbox } from "@/components/ui/checkbox";
 import { RenameChatDialog } from "@/components/RenameChatDialog";
 import { DeleteChatDialog } from "@/components/DeleteChatDialog";
 import { BulkDeleteDialog } from "@/components/BulkDeleteDialog";
+import { Tooltip, TooltipContent, TooltipTrigger } from "@/components/ui/tooltip";
 import {
   useOpenSecret,
   type Conversation,
@@ -40,6 +41,8 @@ import { DeleteConversationProjectDialog } from "@/components/DeleteConversation
 import { MoveChatsDialog } from "@/components/MoveChatsDialog";
 import { listAllConversationProjects, listAllConversations } from "@/utils/paginatedLists";
 
+const MAX_PROJECTS = 10;
+
 interface ChatHistoryListProps {
   currentChatId?: string;
   searchQuery?: string;
@@ -1278,14 +1281,32 @@ export function ChatHistoryList({
       <div ref={pullContentRef} className="flex flex-col gap-5" style={{ willChange: "transform" }}>
         <div className="space-y-2">
           <div className="text-sm font-semibold text-muted-foreground">Projects</div>
-          <button
-            type="button"
-            onClick={handleOpenCreateProjectDialog}
-            className="flex w-full items-center gap-2 rounded-lg py-2 text-left text-muted-foreground transition-colors hover:text-primary"
-          >
-            <FolderPlus className="h-4 w-4" />
-            <span>New project</span>
-          </button>
+          {conversationProjects.length >= MAX_PROJECTS ? (
+            <Tooltip>
+              <TooltipTrigger asChild>
+                <button
+                  type="button"
+                  disabled
+                  className="flex w-full items-center gap-2 rounded-lg py-2 text-left text-muted-foreground/50 cursor-not-allowed"
+                >
+                  <FolderPlus className="h-4 w-4" />
+                  <span>New project</span>
+                </button>
+              </TooltipTrigger>
+              <TooltipContent side="bottom">
+                <p>Maximum of {MAX_PROJECTS} projects reached</p>
+              </TooltipContent>
+            </Tooltip>
+          ) : (
+            <button
+              type="button"
+              onClick={handleOpenCreateProjectDialog}
+              className="flex w-full items-center gap-2 rounded-lg py-2 text-left text-muted-foreground transition-colors hover:text-primary"
+            >
+              <FolderPlus className="h-4 w-4" />
+              <span>New project</span>
+            </button>
+          )}
 
           {filteredProjects.map((project) => {
             const isProjectExpanded = expandedProjectId === project.id;