From 7e07b3f7e9cb6e012dad26db10ae3c9c6cc5fc2b Mon Sep 17 00:00:00 2001
From: Thomas Trompette <thomas.trompette@sfr.fr>
Date: Tue, 1 Apr 2025 16:11:06 +0200
Subject: [PATCH] Fix dropdown height and scroll in workflows (#11324)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Before
<img width="459" alt="Capture d’écran 2025-04-01 à 15 58 41"
src="https://github.com/user-attachments/assets/8f2183b3-cbc4-4e03-97f7-e9edc719af35"
/>

After
<img width="459" alt="Capture d’écran 2025-04-01 à 15 58 28"
src="https://github.com/user-attachments/assets/00ef0ffe-bfc8-429c-942a-c02f6c52d91d"
/>
---
 .../components/WorkflowVariablesDropdownFieldItems.tsx        | 4 ++--
 .../components/WorkflowVariablesDropdownObjectItems.tsx       | 4 ++--
 .../components/WorkflowVariablesDropdownWorkflowStepItems.tsx | 4 ++--
 3 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/packages/twenty-front/src/modules/workflow/workflow-variables/components/WorkflowVariablesDropdownFieldItems.tsx b/packages/twenty-front/src/modules/workflow/workflow-variables/components/WorkflowVariablesDropdownFieldItems.tsx
index 67bf4c0dc..606a52408 100644
--- a/packages/twenty-front/src/modules/workflow/workflow-variables/components/WorkflowVariablesDropdownFieldItems.tsx
+++ b/packages/twenty-front/src/modules/workflow/workflow-variables/components/WorkflowVariablesDropdownFieldItems.tsx
@@ -20,13 +20,13 @@ import { getStepHeaderLabel } from '@/workflow/workflow-variables/utils/getStepH
 import { isLinkOutputSchema } from '@/workflow/workflow-variables/utils/isLinkOutputSchema';
 import { useState } from 'react';
 import { useSetRecoilState } from 'recoil';
+import { isDefined } from 'twenty-shared/utils';
 import {
   IconChevronLeft,
   MenuItemSelect,
   OverflowingTextWithTooltip,
   useIcons,
 } from 'twenty-ui';
-import { isDefined } from 'twenty-shared/utils';
 
 type WorkflowVariablesDropdownFieldItemsProps = {
   step: StepOutputSchema;
@@ -136,7 +136,7 @@ export const WorkflowVariablesDropdownFieldItems = ({
         onChange={(event) => setSearchInputValue(event.target.value)}
       />
       <DropdownMenuSeparator />
-      <DropdownMenuItemsContainer>
+      <DropdownMenuItemsContainer hasMaxHeight>
         {filteredOptions.map(([key, subStep]) => (
           <MenuItemSelect
             key={key}
diff --git a/packages/twenty-front/src/modules/workflow/workflow-variables/components/WorkflowVariablesDropdownObjectItems.tsx b/packages/twenty-front/src/modules/workflow/workflow-variables/components/WorkflowVariablesDropdownObjectItems.tsx
index 7a0d94a95..050a686c4 100644
--- a/packages/twenty-front/src/modules/workflow/workflow-variables/components/WorkflowVariablesDropdownObjectItems.tsx
+++ b/packages/twenty-front/src/modules/workflow/workflow-variables/components/WorkflowVariablesDropdownObjectItems.tsx
@@ -8,6 +8,7 @@ import { getStepHeaderLabel } from '@/workflow/workflow-variables/utils/getStepH
 import { isBaseOutputSchema } from '@/workflow/workflow-variables/utils/isBaseOutputSchema';
 import { isRecordOutputSchema } from '@/workflow/workflow-variables/utils/isRecordOutputSchema';
 
+import { DropdownMenuHeaderLeftComponent } from '@/ui/layout/dropdown/components/DropdownMenuHeader/internal/DropdownMenuHeaderLeftComponent';
 import { useState } from 'react';
 import {
   IconChevronLeft,
@@ -15,7 +16,6 @@ import {
   OverflowingTextWithTooltip,
   useIcons,
 } from 'twenty-ui';
-import { DropdownMenuHeaderLeftComponent } from '@/ui/layout/dropdown/components/DropdownMenuHeader/internal/DropdownMenuHeaderLeftComponent';
 
 type WorkflowVariablesDropdownObjectItemsProps = {
   step: StepOutputSchema;
@@ -117,7 +117,7 @@ export const WorkflowVariablesDropdownObjectItems = ({
         onChange={(event) => setSearchInputValue(event.target.value)}
       />
       <DropdownMenuSeparator />
-      <DropdownMenuItemsContainer>
+      <DropdownMenuItemsContainer hasMaxHeight>
         {shouldDisplaySubStepObject && displayedSubStepObject?.label && (
           <MenuItemSelect
             selected={false}
diff --git a/packages/twenty-front/src/modules/workflow/workflow-variables/components/WorkflowVariablesDropdownWorkflowStepItems.tsx b/packages/twenty-front/src/modules/workflow/workflow-variables/components/WorkflowVariablesDropdownWorkflowStepItems.tsx
index c95887b42..c01459c40 100644
--- a/packages/twenty-front/src/modules/workflow/workflow-variables/components/WorkflowVariablesDropdownWorkflowStepItems.tsx
+++ b/packages/twenty-front/src/modules/workflow/workflow-variables/components/WorkflowVariablesDropdownWorkflowStepItems.tsx
@@ -1,4 +1,5 @@
 import { DropdownMenuHeader } from '@/ui/layout/dropdown/components/DropdownMenuHeader/DropdownMenuHeader';
+import { DropdownMenuHeaderLeftComponent } from '@/ui/layout/dropdown/components/DropdownMenuHeader/internal/DropdownMenuHeaderLeftComponent';
 import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer';
 import { DropdownMenuSearchInput } from '@/ui/layout/dropdown/components/DropdownMenuSearchInput';
 import { DropdownMenuSeparator } from '@/ui/layout/dropdown/components/DropdownMenuSeparator';
@@ -12,7 +13,6 @@ import {
   OverflowingTextWithTooltip,
   useIcons,
 } from 'twenty-ui';
-import { DropdownMenuHeaderLeftComponent } from '@/ui/layout/dropdown/components/DropdownMenuHeader/internal/DropdownMenuHeaderLeftComponent';
 
 type WorkflowVariablesDropdownWorkflowStepItemsProps = {
   dropdownId: string;
@@ -54,7 +54,7 @@ export const WorkflowVariablesDropdownWorkflowStepItems = ({
         onChange={(event) => setSearchInputValue(event.target.value)}
       />
       <DropdownMenuSeparator />
-      <DropdownMenuItemsContainer>
+      <DropdownMenuItemsContainer hasMaxHeight>
         {availableSteps.length > 0 ? (
           availableSteps.map((item, _index) => (
             <MenuItemSelect