From 210da98b69737c6fa7ad57666f29bfe5f086f54a Mon Sep 17 00:00:00 2001
From: Dhruwang Jariwala <67850763+Dhruwang@users.noreply.github.com>
Date: Thu, 15 Jan 2026 17:29:17 +0530
Subject: [PATCH] fix: scrolling in project breadcrumb dropdown (#7118)

---
 .../[environmentId]/components/organization-breadcrumb.tsx    | 2 +-
 .../[environmentId]/components/project-breadcrumb.tsx         | 2 +-
 .../settings/api-keys/components/add-api-key-modal.tsx        | 4 ++--
 apps/web/modules/ui/globals.css                               | 2 ++
 4 files changed, 6 insertions(+), 4 deletions(-)

diff --git a/apps/web/app/(app)/environments/[environmentId]/components/organization-breadcrumb.tsx b/apps/web/app/(app)/environments/[environmentId]/components/organization-breadcrumb.tsx
index 9f36cf47eb..df322c6726 100644
--- a/apps/web/app/(app)/environments/[environmentId]/components/organization-breadcrumb.tsx
+++ b/apps/web/app/(app)/environments/[environmentId]/components/organization-breadcrumb.tsx
@@ -209,7 +209,7 @@ export const OrganizationBreadcrumb = ({
               )}
               {!isLoadingOrganizations && !loadError && (
                 <>
-                  <DropdownMenuGroup>
+                  <DropdownMenuGroup className="max-h-[300px] overflow-y-auto">
                     {organizations.map((org) => (
                       <DropdownMenuCheckboxItem
                         key={org.id}
diff --git a/apps/web/app/(app)/environments/[environmentId]/components/project-breadcrumb.tsx b/apps/web/app/(app)/environments/[environmentId]/components/project-breadcrumb.tsx
index 82ea0d06c4..ccb371a489 100644
--- a/apps/web/app/(app)/environments/[environmentId]/components/project-breadcrumb.tsx
+++ b/apps/web/app/(app)/environments/[environmentId]/components/project-breadcrumb.tsx
@@ -234,7 +234,7 @@ export const ProjectBreadcrumb = ({
           )}
           {!isLoadingProjects && !loadError && (
             <>
-              <DropdownMenuGroup>
+              <DropdownMenuGroup className="max-h-[300px] overflow-y-auto">
                 {projects.map((proj) => (
                   <DropdownMenuCheckboxItem
                     key={proj.id}
diff --git a/apps/web/modules/organization/settings/api-keys/components/add-api-key-modal.tsx b/apps/web/modules/organization/settings/api-keys/components/add-api-key-modal.tsx
index 147b9bfb77..9a0164ee11 100644
--- a/apps/web/modules/organization/settings/api-keys/components/add-api-key-modal.tsx
+++ b/apps/web/modules/organization/settings/api-keys/components/add-api-key-modal.tsx
@@ -255,7 +255,7 @@ export const AddApiKeyModal = ({
                               </span>
                             </button>
                           </DropdownMenuTrigger>
-                          <DropdownMenuContent className="min-w-[8rem]">
+                          <DropdownMenuContent className="max-h-[300px] min-w-[8rem] overflow-y-auto">
                             {projectOptions.map((option) => (
                               <DropdownMenuItem
                                 key={option.id}
@@ -286,7 +286,7 @@ export const AddApiKeyModal = ({
                               </span>
                             </button>
                           </DropdownMenuTrigger>
-                          <DropdownMenuContent className="min-w-[8rem] capitalize">
+                          <DropdownMenuContent className="max-h-[300px] min-w-[8rem] overflow-y-auto capitalize">
                             {getEnvironmentOptionsForProject(permission.projectId).map((env) => (
                               <DropdownMenuItem
                                 key={env.id}
diff --git a/apps/web/modules/ui/globals.css b/apps/web/modules/ui/globals.css
index 585084c39e..330ae959ab 100644
--- a/apps/web/modules/ui/globals.css
+++ b/apps/web/modules/ui/globals.css
@@ -64,11 +64,13 @@
 
 *::-webkit-scrollbar-track {
   background: #e2e8f0;
+  border-radius: 10px;
 }
 
 *::-webkit-scrollbar-thumb {
   background-color: #cbd5e1;
   border: 1px solid #cbd5e1;
+  border-radius: 10px;
 }
 
 .filter-scrollbar::-webkit-scrollbar {