diff --git a/packages/twenty-front/src/modules/object-record/record-field/ui/form-types/components/FormSelectFieldInput.tsx b/packages/twenty-front/src/modules/object-record/record-field/ui/form-types/components/FormSelectFieldInput.tsx index 80833fa557..7e15563cf6 100644 --- a/packages/twenty-front/src/modules/object-record/record-field/ui/form-types/components/FormSelectFieldInput.tsx +++ b/packages/twenty-front/src/modules/object-record/record-field/ui/form-types/components/FormSelectFieldInput.tsx @@ -6,7 +6,7 @@ import { VariableChipStandalone } from '@/object-record/record-field/ui/form-typ import { type VariablePickerComponent } from '@/object-record/record-field/ui/form-types/types/VariablePickerComponent'; import { InputHint } from '@/ui/input/components/InputHint'; import { InputLabel } from '@/ui/input/components/InputLabel'; -import { Select } from '@/ui/input/components/Select'; +import { type CallToActionButton, Select } from '@/ui/input/components/Select'; import { GenericDropdownContentWidth } from '@/ui/layout/dropdown/constants/GenericDropdownContentWidth'; import { useRemoveFocusItemFromFocusStackById } from '@/ui/utilities/focus/hooks/useRemoveFocusItemFromFocusStackById'; import { useHotkeysOnFocusedElement } from '@/ui/utilities/hotkey/hooks/useHotkeysOnFocusedElement'; @@ -26,6 +26,7 @@ type FormSelectFieldInputProps = { VariablePicker?: VariablePickerComponent; options: SelectOption[]; readonly?: boolean; + callToActionButton?: CallToActionButton; }; export const FormSelectFieldInput = ({ @@ -36,6 +37,7 @@ export const FormSelectFieldInput = ({ VariablePicker, options, readonly, + callToActionButton, }: FormSelectFieldInputProps) => { const { theme } = useContext(ThemeContext); const instanceId = useId(); @@ -139,6 +141,7 @@ export const FormSelectFieldInput = ({ value={selectedOption?.value} onChange={onSelect} emptyOption={defaultEmptyOption} + callToActionButton={callToActionButton} fullWidth hasRightElement={isDefined(VariablePicker) && !readonly} withSearchInput diff --git a/packages/twenty-front/src/modules/ui/input/components/Select.tsx b/packages/twenty-front/src/modules/ui/input/components/Select.tsx index 2b74537b8f..a5a295051e 100644 --- a/packages/twenty-front/src/modules/ui/input/components/Select.tsx +++ b/packages/twenty-front/src/modules/ui/input/components/Select.tsx @@ -26,7 +26,7 @@ import { themeCssVariables } from 'twenty-ui/theme-constants'; export type SelectSizeVariant = 'small' | 'default'; -type CallToActionButton = { +export type CallToActionButton = { text: string; onClick: (event: MouseEvent) => void; Icon?: IconComponent; diff --git a/packages/twenty-front/src/modules/workflow/workflow-steps/workflow-actions/components/WorkflowEditActionEmailBase.tsx b/packages/twenty-front/src/modules/workflow/workflow-steps/workflow-actions/components/WorkflowEditActionEmailBase.tsx index a448bd047d..200641a1b2 100644 --- a/packages/twenty-front/src/modules/workflow/workflow-steps/workflow-actions/components/WorkflowEditActionEmailBase.tsx +++ b/packages/twenty-front/src/modules/workflow/workflow-steps/workflow-actions/components/WorkflowEditActionEmailBase.tsx @@ -3,12 +3,12 @@ import { getMissingDraftEmailScopes } from '@/accounts/utils/hasMissingDraftEmai import { WorkflowSendEmailAttachments } from '@/advanced-text-editor/components/WorkflowSendEmailAttachments'; import { FormAdvancedTextFieldInput } from '@/object-record/record-field/ui/form-types/components/FormAdvancedTextFieldInput'; import { FormMultiTextFieldInput } from '@/object-record/record-field/ui/form-types/components/FormMultiTextFieldInput'; +import { FormSelectFieldInput } from '@/object-record/record-field/ui/form-types/components/FormSelectFieldInput'; import { FormTextFieldInput } from '@/object-record/record-field/ui/form-types/components/FormTextFieldInput'; import { useApolloCoreClient } from '@/object-metadata/hooks/useApolloCoreClient'; import { useMyConnectedAccounts } from '@/settings/accounts/hooks/useMyConnectedAccounts'; import { useTriggerApisOAuth } from '@/settings/accounts/hooks/useTriggerApiOAuth'; import { useSidePanelMenu } from '@/side-panel/hooks/useSidePanelMenu'; -import { Select } from '@/ui/input/components/Select'; import { Dropdown } from '@/ui/layout/dropdown/components/Dropdown'; import { DropdownContent } from '@/ui/layout/dropdown/components/DropdownContent'; import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer'; @@ -19,6 +19,7 @@ import { WORKFLOW_STEP_CONNECTED_ACCOUNT_HANDLE } from '@/workflow/graphql/queri import { useWorkflowWithCurrentVersion } from '@/workflow/hooks/useWorkflowWithCurrentVersion'; import { workflowVisualizerWorkflowIdComponentState } from '@/workflow/states/workflowVisualizerWorkflowIdComponentState'; import { type WorkflowEmailAction } from '@/workflow/types/WorkflowEmailAction'; +import { isStandaloneVariableString } from '@/workflow/utils/isStandaloneVariableString'; import { WorkflowStepBody } from '@/workflow/workflow-steps/components/WorkflowStepBody'; import { WorkflowStepFooter } from '@/workflow/workflow-steps/components/WorkflowStepFooter'; import { useEmailForm } from '@/workflow/workflow-steps/workflow-actions/hooks/useEmailForm'; @@ -112,10 +113,18 @@ export const WorkflowEditActionEmailBase = ({ const apolloCoreClient = useApolloCoreClient(); + const navigate = useNavigateSettings(); + + const { closeSidePanelMenu } = useSidePanelMenu(); + const { accounts: myAccounts, loading: myAccountsLoading } = useMyConnectedAccounts(); + // Sender variables are only enabled for DRAFT_EMAIL for now; SEND_EMAIL keeps a plain account select. + const isSenderVariableEnabled = action.type === 'DRAFT_EMAIL'; + const configuredAccountId = formData.connectedAccountId; + const isSenderVariable = isStandaloneVariableString(configuredAccountId); const isConfiguredAccountMine = myAccounts.some( (account) => account.id === configuredAccountId, ); @@ -131,6 +140,7 @@ export const WorkflowEditActionEmailBase = ({ skip: !isDefined(configuredAccountId) || configuredAccountId === '' || + isSenderVariable || isConfiguredAccountMine, }); @@ -158,11 +168,7 @@ export const WorkflowEditActionEmailBase = ({ } : null; - let emptyOption: SelectOption = { - label: t`None`, - value: null, - }; - const connectedAccountOptions: SelectOption[] = []; + const connectedAccountOptions: SelectOption[] = []; myAccounts.forEach((account) => { if ( @@ -179,16 +185,12 @@ export const WorkflowEditActionEmailBase = ({ }); if (isDefined(otherAccount)) { - emptyOption = { + connectedAccountOptions.push({ label: otherAccount.handle, value: otherAccount.id, - }; + }); } - const navigate = useNavigateSettings(); - - const { closeSidePanelMenu } = useSidePanelMenu(); - useEffect(() => { return () => { saveAction.flush(); @@ -199,13 +201,21 @@ export const WorkflowEditActionEmailBase = ({ !loading && ( <> -