diff --git a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/SelectFieldInput.tsx b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/SelectFieldInput.tsx index e0b433eef..0f745de75 100644 --- a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/SelectFieldInput.tsx +++ b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/SelectFieldInput.tsx @@ -1,5 +1,6 @@ -import { useRef, useState } from 'react'; +import React, { useRef, useState } from 'react'; import styled from '@emotion/styled'; +import { Key } from 'ts-key-enum'; import { useSelectField } from '@/object-record/record-field/meta-types/hooks/useSelectField'; import { FieldInputEvent } from '@/object-record/record-field/types/FieldInputEvent'; @@ -8,6 +9,7 @@ import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/Drop import { DropdownMenuSearchInput } from '@/ui/layout/dropdown/components/DropdownMenuSearchInput'; import { DropdownMenuSeparator } from '@/ui/layout/dropdown/components/DropdownMenuSeparator'; import { MenuItemSelectTag } from '@/ui/navigation/menu-item/components/MenuItemSelectTag'; +import { useScopedHotkeys } from '@/ui/utilities/hotkey/hooks/useScopedHotkeys'; import { useListenClickOutside } from '@/ui/utilities/pointer-event/hooks/useListenClickOutside'; import { isDefined } from '~/utils/isDefined'; @@ -26,7 +28,8 @@ export const SelectFieldInput = ({ onSubmit, onCancel, }: SelectFieldInputProps) => { - const { persistField, fieldDefinition, fieldValue } = useSelectField(); + const { persistField, fieldDefinition, fieldValue, hotkeyScope } = + useSelectField(); const [searchFilter, setSearchFilter] = useState(''); const containerRef = useRef(null); @@ -59,6 +62,20 @@ export const SelectFieldInput = ({ }, }); + useScopedHotkeys( + Key.Enter, + () => { + const selectedOption = optionsInDropDown.find((option) => + option.label.toLowerCase().includes(searchFilter.toLowerCase()), + ); + + if (isDefined(selectedOption)) { + onSubmit?.(() => persistField(selectedOption.value)); + } + }, + hotkeyScope, + ); + return ( diff --git a/packages/twenty-front/src/modules/object-record/record-table/components/RecordTableCellFieldContextWrapper.tsx b/packages/twenty-front/src/modules/object-record/record-table/components/RecordTableCellFieldContextWrapper.tsx index 165dc3786..ec30ebe03 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/components/RecordTableCellFieldContextWrapper.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/components/RecordTableCellFieldContextWrapper.tsx @@ -3,6 +3,7 @@ import { useContext } from 'react'; import { isLabelIdentifierField } from '@/object-metadata/utils/isLabelIdentifierField'; import { FieldContext } from '@/object-record/record-field/contexts/FieldContext'; import { isFieldRelation } from '@/object-record/record-field/types/guards/isFieldRelation'; +import { isFieldSelect } from '@/object-record/record-field/types/guards/isFieldSelect'; import { RecordUpdateContext } from '@/object-record/record-table/contexts/EntityUpdateMutationHookContext'; import { RecordTableCellContext } from '@/object-record/record-table/contexts/RecordTableCellContext'; import { RecordTableContext } from '@/object-record/record-table/contexts/RecordTableContext'; @@ -10,6 +11,7 @@ import { RecordTableRowContext } from '@/object-record/record-table/contexts/Rec import { RecordTableCell } from '@/object-record/record-table/record-table-cell/components/RecordTableCell'; import { TableHotkeyScope } from '@/object-record/record-table/types/TableHotkeyScope'; import { RelationPickerHotkeyScope } from '@/object-record/relation-picker/types/RelationPickerHotkeyScope'; +import { SelectFieldHotkeyScope } from '@/object-record/select/types/SelectFieldHotkeyScope'; import { isUndefinedOrNull } from '~/utils/isUndefinedOrNull'; export const RecordTableCellFieldContextWrapper = () => { @@ -25,7 +27,9 @@ export const RecordTableCellFieldContextWrapper = () => { const customHotkeyScope = isFieldRelation(columnDefinition) ? RelationPickerHotkeyScope.RelationPicker - : TableHotkeyScope.CellEditMode; + : isFieldSelect(columnDefinition) + ? SelectFieldHotkeyScope.SelectField + : TableHotkeyScope.CellEditMode; return (