admin/twenty
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

Fix dropdown height and scroll in workflows (#11324)

Browse Source 
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"
/>
This commit is contained in:
Thomas Trompette
2025-04-01 16:11:06 +02:00
committed by GitHub
parent 1d4fc5ff4a
commit 7e07b3f7e9
3 changed files with 6 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
packages/twenty-front/src/modules/workflow/workflow-variables/components/WorkflowVariablesDropdownFieldItems.tsx
View File

@ -20,13 +20,13 @@ import { getStepHeaderLabel } from '@/workflow/workflow-variables/utils/getStepH
import { isLinkOutputSchema } from '@/workflow/workflow-variables/utils/isLinkOutputSchema'; import { isLinkOutputSchema } from '@/workflow/workflow-variables/utils/isLinkOutputSchema';
import { useState } from 'react'; import { useState } from 'react';
import { useSetRecoilState } from 'recoil'; import { useSetRecoilState } from 'recoil';
import { isDefined } from 'twenty-shared/utils';
import { import {
IconChevronLeft, IconChevronLeft,
MenuItemSelect, MenuItemSelect,
OverflowingTextWithTooltip, OverflowingTextWithTooltip,
useIcons, useIcons,
} from 'twenty-ui'; } from 'twenty-ui';
import { isDefined } from 'twenty-shared/utils';
type WorkflowVariablesDropdownFieldItemsProps = { type WorkflowVariablesDropdownFieldItemsProps = {
step: StepOutputSchema; step: StepOutputSchema;
@ -136,7 +136,7 @@ export const WorkflowVariablesDropdownFieldItems = ({
onChange={(event) => setSearchInputValue(event.target.value)} onChange={(event) => setSearchInputValue(event.target.value)}
/> />
<DropdownMenuSeparator /> <DropdownMenuSeparator />
<DropdownMenuItemsContainer> <DropdownMenuItemsContainer hasMaxHeight>
{filteredOptions.map(([key, subStep]) => ( {filteredOptions.map(([key, subStep]) => (
<MenuItemSelect <MenuItemSelect
key={key} key={key}

4
packages/twenty-front/src/modules/workflow/workflow-variables/components/WorkflowVariablesDropdownObjectItems.tsx
View File

@ -8,6 +8,7 @@ import { getStepHeaderLabel } from '@/workflow/workflow-variables/utils/getStepH
import { isBaseOutputSchema } from '@/workflow/workflow-variables/utils/isBaseOutputSchema'; import { isBaseOutputSchema } from '@/workflow/workflow-variables/utils/isBaseOutputSchema';
import { isRecordOutputSchema } from '@/workflow/workflow-variables/utils/isRecordOutputSchema'; import { isRecordOutputSchema } from '@/workflow/workflow-variables/utils/isRecordOutputSchema';
import { DropdownMenuHeaderLeftComponent } from '@/ui/layout/dropdown/components/DropdownMenuHeader/internal/DropdownMenuHeaderLeftComponent';
import { useState } from 'react'; import { useState } from 'react';
import { import {
IconChevronLeft, IconChevronLeft,
@ -15,7 +16,6 @@ import {
OverflowingTextWithTooltip, OverflowingTextWithTooltip,
useIcons, useIcons,
} from 'twenty-ui'; } from 'twenty-ui';
import { DropdownMenuHeaderLeftComponent } from '@/ui/layout/dropdown/components/DropdownMenuHeader/internal/DropdownMenuHeaderLeftComponent';
type WorkflowVariablesDropdownObjectItemsProps = { type WorkflowVariablesDropdownObjectItemsProps = {
step: StepOutputSchema; step: StepOutputSchema;
@ -117,7 +117,7 @@ export const WorkflowVariablesDropdownObjectItems = ({
onChange={(event) => setSearchInputValue(event.target.value)} onChange={(event) => setSearchInputValue(event.target.value)}
/> />
<DropdownMenuSeparator /> <DropdownMenuSeparator />
<DropdownMenuItemsContainer> <DropdownMenuItemsContainer hasMaxHeight>
{shouldDisplaySubStepObject && displayedSubStepObject?.label && ( {shouldDisplaySubStepObject && displayedSubStepObject?.label && (
<MenuItemSelect <MenuItemSelect
selected={false} selected={false}

4
packages/twenty-front/src/modules/workflow/workflow-variables/components/WorkflowVariablesDropdownWorkflowStepItems.tsx
View File

@ -1,4 +1,5 @@
import { DropdownMenuHeader } from '@/ui/layout/dropdown/components/DropdownMenuHeader/DropdownMenuHeader'; 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 { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer';
import { DropdownMenuSearchInput } from '@/ui/layout/dropdown/components/DropdownMenuSearchInput'; import { DropdownMenuSearchInput } from '@/ui/layout/dropdown/components/DropdownMenuSearchInput';
import { DropdownMenuSeparator } from '@/ui/layout/dropdown/components/DropdownMenuSeparator'; import { DropdownMenuSeparator } from '@/ui/layout/dropdown/components/DropdownMenuSeparator';
@ -12,7 +13,6 @@ import {
OverflowingTextWithTooltip, OverflowingTextWithTooltip,
useIcons, useIcons,
} from 'twenty-ui'; } from 'twenty-ui';
import { DropdownMenuHeaderLeftComponent } from '@/ui/layout/dropdown/components/DropdownMenuHeader/internal/DropdownMenuHeaderLeftComponent';
type WorkflowVariablesDropdownWorkflowStepItemsProps = { type WorkflowVariablesDropdownWorkflowStepItemsProps = {
dropdownId: string; dropdownId: string;
@ -54,7 +54,7 @@ export const WorkflowVariablesDropdownWorkflowStepItems = ({
onChange={(event) => setSearchInputValue(event.target.value)} onChange={(event) => setSearchInputValue(event.target.value)}
/> />
<DropdownMenuSeparator /> <DropdownMenuSeparator />
<DropdownMenuItemsContainer> <DropdownMenuItemsContainer hasMaxHeight>
{availableSteps.length > 0 ? ( {availableSteps.length > 0 ? (
availableSteps.map((item, _index) => ( availableSteps.map((item, _index) => (
<MenuItemSelect <MenuItemSelect