Add full name composite field (#9008)

- Add composite field
- Add test
- Fix search variable dropdown scroll
<img width="548" alt="Capture d’écran 2024-12-10 à 16 52 43"
src="https://github.com/user-attachments/assets/c337f0c3-8a70-401a-abd0-7206489ba73e">
This commit is contained in:
Thomas Trompette
2024-12-10 17:29:55 +01:00
committed by GitHub
parent 96d56f8883
commit b6e02b630d
13 changed files with 148 additions and 33 deletions

View File

@ -1,4 +1,5 @@
import { Dropdown } from '@/ui/layout/dropdown/components/Dropdown';
import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer';
import { StyledDropdownButtonContainer } from '@/ui/layout/dropdown/components/StyledDropdownButtonContainer';
import { useDropdown } from '@/ui/layout/dropdown/hooks/useDropdown';
import { SearchVariablesDropdownFieldItems } from '@/workflow/search-variables/components/SearchVariablesDropdownFieldItems';
@ -26,7 +27,7 @@ const StyledDropdownVariableButtonContainer = styled(
}
`;
const StyledDropdownComponetsContainer = styled.div`
const StyledDropdownComponentsContainer = styled(DropdownMenuItemsContainer)`
background-color: ${({ theme }) => theme.background.transparent.light};
`;
@ -136,9 +137,9 @@ const SearchVariablesDropdown = ({
</StyledDropdownVariableButtonContainer>
}
dropdownComponents={
<StyledDropdownComponetsContainer>
<StyledDropdownComponentsContainer>
{renderSearchVariablesDropdownComponents()}
</StyledDropdownComponetsContainer>
</StyledDropdownComponentsContainer>
}
dropdownPlacement="bottom-end"
dropdownOffset={{ x: 0, y: 4 }}

View File

@ -1,5 +1,4 @@
import { DropdownMenuHeader } from '@/ui/layout/dropdown/components/DropdownMenuHeader';
import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer';
import { DropdownMenuSearchInput } from '@/ui/layout/dropdown/components/DropdownMenuSearchInput';
import {
BaseOutputSchema,
@ -100,8 +99,14 @@ export const SearchVariablesDropdownFieldItems = ({
: options;
return (
<DropdownMenuItemsContainer>
<DropdownMenuHeader StartIcon={IconChevronLeft} onClick={goBack}>
<>
<DropdownMenuHeader
StartIcon={IconChevronLeft}
onClick={goBack}
style={{
position: 'fixed',
}}
>
<OverflowingTextWithTooltip text={headerLabel} />
</DropdownMenuHeader>
<HorizontalSeparator
@ -128,6 +133,6 @@ export const SearchVariablesDropdownFieldItems = ({
LeftIcon={value.icon ? getIcon(value.icon) : undefined}
/>
))}
</DropdownMenuItemsContainer>
</>
);
};

View File

@ -1,5 +1,4 @@
import { DropdownMenuHeader } from '@/ui/layout/dropdown/components/DropdownMenuHeader';
import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer';
import { DropdownMenuSearchInput } from '@/ui/layout/dropdown/components/DropdownMenuSearchInput';
import {
OutputSchema,
@ -112,7 +111,7 @@ export const SearchVariablesDropdownObjectItems = ({
: options;
return (
<DropdownMenuItemsContainer>
<>
<DropdownMenuHeader StartIcon={IconChevronLeft} onClick={goBack}>
<OverflowingTextWithTooltip text={headerLabel} />
</DropdownMenuHeader>
@ -154,6 +153,6 @@ export const SearchVariablesDropdownObjectItems = ({
LeftIcon={value.icon ? getIcon(value.icon) : undefined}
/>
))}
</DropdownMenuItemsContainer>
</>
);
};

View File

@ -1,5 +1,4 @@
import { DropdownMenuHeader } from '@/ui/layout/dropdown/components/DropdownMenuHeader';
import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer';
import { DropdownMenuSearchInput } from '@/ui/layout/dropdown/components/DropdownMenuSearchInput';
import { useDropdown } from '@/ui/layout/dropdown/hooks/useDropdown';
import { StepOutputSchema } from '@/workflow/search-variables/types/StepOutputSchema';
@ -36,7 +35,7 @@ export const SearchVariablesDropdownWorkflowStepItems = ({
);
return (
<DropdownMenuItemsContainer>
<>
<DropdownMenuHeader StartIcon={IconX} onClick={closeDropdown}>
<OverflowingTextWithTooltip text={'Select Step'} />
</DropdownMenuHeader>
@ -74,6 +73,6 @@ export const SearchVariablesDropdownWorkflowStepItems = ({
hasSubMenu={false}
/>
)}
</DropdownMenuItemsContainer>
</>
);
};