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

Add full name composite field (#9008)

Browse Source 
- 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
Download Patch File Download Diff File Expand all files Collapse all files

7
packages/twenty-front/src/modules/workflow/search-variables/components/SearchVariablesDropdown.tsx
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 }}

13
packages/twenty-front/src/modules/workflow/search-variables/components/SearchVariablesDropdownFieldItems.tsx
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>
</>
);
};

5
packages/twenty-front/src/modules/workflow/search-variables/components/SearchVariablesDropdownObjectItems.tsx
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>
</>
);
};

5
packages/twenty-front/src/modules/workflow/search-variables/components/SearchVariablesDropdownWorkflowStepItems.tsx
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>
</>
);
};

16
packages/twenty-front/src/modules/workflow/workflow-actions/components/WorkflowEditActionFormServerlessFunction.tsx
View File

@ -1,4 +1,5 @@
import { FormTextFieldInput } from '@/object-record/record-field/form-types/components/FormTextFieldInput';
import { StyledFormCompositeFieldInputContainer } from '@/object-record/record-field/form-types/components/StyledFormCompositeFieldInputContainer';
import { useGetAvailablePackages } from '@/settings/serverless-functions/hooks/useGetAvailablePackages';
import { useServerlessFunctionUpdateFormState } from '@/settings/serverless-functions/hooks/useServerlessFunctionUpdateFormState';
import { useUpdateOneServerlessFunction } from '@/settings/serverless-functions/hooks/useUpdateOneServerlessFunction';
@ -44,17 +45,6 @@ const StyledLabel = styled.div`
margin-bottom: ${({ theme }) => theme.spacing(2)};
`;
const StyledInputContainer = styled.div`
background: ${({ theme }) => theme.background.secondary};
border: 1px solid ${({ theme }) => theme.border.color.medium};
border-radius: ${({ theme }) => theme.border.radius.md};
display: flex;
flex-direction: column;
gap: ${({ theme }) => theme.spacing(2)};
padding: ${({ theme }) => theme.spacing(2)};
position: relative;
`;
type WorkflowEditActionFormServerlessFunctionProps = {
action: WorkflowCodeAction;
actionOptions:
@ -223,9 +213,9 @@ export const WorkflowEditActionFormServerlessFunction = ({
return (
<StyledContainer key={pathKey}>
<StyledLabel>{inputKey}</StyledLabel>
<StyledInputContainer>
<StyledFormCompositeFieldInputContainer>
{renderFields(inputValue, currentPath, false)}
</StyledInputContainer>
</StyledFormCompositeFieldInputContainer>
</StyledContainer>
);
} else {