From b3537cc47833eaa3d5b9d1fc54ae37323cb1e74f Mon Sep 17 00:00:00 2001
From: Githelp AI Aagent <stian@githelp.app>
Date: Tue, 25 Aug 2026 17:53:31 +0000
Subject: [PATCH] feat: What to change: The top left dropdown field, where all
 projects associated wi...

Task: d0d9ff55
Source: slack
Requested by: U04E9DZ5ELF
---
 src/components/layout/top-bar.tsx | 27 ++++++++++++++++-----------
 1 file changed, 16 insertions(+), 11 deletions(-)

diff --git a/src/components/layout/top-bar.tsx b/src/components/layout/top-bar.tsx
index 6a06826..ed5381b 100644
--- a/src/components/layout/top-bar.tsx
+++ b/src/components/layout/top-bar.tsx
@@ -7,6 +7,7 @@ import { useRouter } from "next/navigation"
 import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar"
 import { ProfileAvatar } from "@/components/ui/profile-avatar"
 import { logoutUser } from "@/lib/supabase/auth"
+import { cn } from "@/lib/utils"
 import {
   DropdownMenu,
   DropdownMenuContent,
@@ -253,17 +254,21 @@ export function TopBar() {
                 className="w-56 font-sans"
                 onCloseAutoFocus={(e) => e.preventDefault()}
               >
-                {userProjects.map((project) => {
-                  const isSelected = selectedProject?.project_id === project.project_id
-                  return (
-                    <ProjectLogoWithBranding
-                      key={project.project_id}
-                      project={project}
-                      isSelected={isSelected}
-                      onSelect={handleProjectSelect}
-                    />
-                  )
-                })}
+                {/* Scrollable project list — capped at three rows (3 × 32px) so the
+                    separator and "Add new" below always stay visible. */}
+                <div className={cn("max-h-24 overflow-y-auto")}>
+                  {userProjects.map((project) => {
+                    const isSelected = selectedProject?.project_id === project.project_id
+                    return (
+                      <ProjectLogoWithBranding
+                        key={project.project_id}
+                        project={project}
+                        isSelected={isSelected}
+                        onSelect={handleProjectSelect}
+                      />
+                    )
+                  })}
+                </div>
                 <DropdownMenuSeparator />
                 <DropdownMenuItem
                   className="font-sans text-[14px] text-brand-primary"