diff --git a/packages/twenty-front/src/modules/command-menu/components/CommandMenuItemNumberInput.tsx b/packages/twenty-front/src/modules/command-menu/components/CommandMenuItemNumberInput.tsx index b68ee73497..1bca45a49d 100644 --- a/packages/twenty-front/src/modules/command-menu/components/CommandMenuItemNumberInput.tsx +++ b/packages/twenty-front/src/modules/command-menu/components/CommandMenuItemNumberInput.tsx @@ -3,9 +3,11 @@ import { useRegisterInputEvents } from '@/object-record/record-field/ui/meta-typ import { TextInput } from '@/ui/input/components/TextInput'; import { usePushFocusItemToFocusStack } from '@/ui/utilities/focus/hooks/usePushFocusItemToFocusStack'; import { useRemoveFocusItemFromFocusStackById } from '@/ui/utilities/focus/hooks/useRemoveFocusItemFromFocusStackById'; +import { currentFocusIdSelector } from '@/ui/utilities/focus/states/currentFocusIdSelector'; import { FocusComponentType } from '@/ui/utilities/focus/types/FocusComponentType'; import styled from '@emotion/styled'; import { useRef, useState } from 'react'; +import { useRecoilValue } from 'recoil'; import { isDefined } from 'twenty-shared/utils'; import { type IconComponent } from 'twenty-ui/display'; import { @@ -43,6 +45,9 @@ export const CommandMenuItemNumberInput = ({ const [draftValue, setDraftValue] = useState(value); const [hasError, setHasError] = useState(false); + const currentFocusId = useRecoilValue(currentFocusIdSelector); + const isNumberInputCurrentlyFocused = currentFocusId === focusId; + const { pushFocusItemToFocusStack } = usePushFocusItemToFocusStack(); const { removeFocusItemFromFocusStackById } = useRemoveFocusItemFromFocusStackById(); @@ -105,7 +110,9 @@ export const CommandMenuItemNumberInput = ({ inputValue: draftValue, onEscape: handleEscape, onEnter: handleEnter, - onClickOutside: handleClickOutside, + onClickOutside: isNumberInputCurrentlyFocused + ? handleClickOutside + : undefined, }); const handleChange = (text: string) => { diff --git a/packages/twenty-front/src/modules/command-menu/components/CommandMenuItemTextInput.tsx b/packages/twenty-front/src/modules/command-menu/components/CommandMenuItemTextInput.tsx index c333eca5fd..0c4fd7e5c0 100644 --- a/packages/twenty-front/src/modules/command-menu/components/CommandMenuItemTextInput.tsx +++ b/packages/twenty-front/src/modules/command-menu/components/CommandMenuItemTextInput.tsx @@ -3,9 +3,11 @@ import { useRegisterInputEvents } from '@/object-record/record-field/ui/meta-typ import { TextInput } from '@/ui/input/components/TextInput'; import { usePushFocusItemToFocusStack } from '@/ui/utilities/focus/hooks/usePushFocusItemToFocusStack'; import { useRemoveFocusItemFromFocusStackById } from '@/ui/utilities/focus/hooks/useRemoveFocusItemFromFocusStackById'; +import { currentFocusIdSelector } from '@/ui/utilities/focus/states/currentFocusIdSelector'; import { FocusComponentType } from '@/ui/utilities/focus/types/FocusComponentType'; import styled from '@emotion/styled'; import { useRef, useState } from 'react'; +import { useRecoilValue } from 'recoil'; import { type IconComponent } from 'twenty-ui/display'; type CommandMenuItemTextInputProps = { @@ -35,6 +37,9 @@ export const CommandMenuItemTextInput = ({ const focusId = `${id}-input`; const [draftValue, setDraftValue] = useState(value); + const currentFocusId = useRecoilValue(currentFocusIdSelector); + const isTextInputCurrentlyFocused = currentFocusId === focusId; + const { pushFocusItemToFocusStack } = usePushFocusItemToFocusStack(); const { removeFocusItemFromFocusStackById } = useRemoveFocusItemFromFocusStackById(); @@ -77,7 +82,9 @@ export const CommandMenuItemTextInput = ({ inputValue: draftValue, onEscape: handleEscape, onEnter: handleEnter, - onClickOutside: handleClickOutside, + onClickOutside: isTextInputCurrentlyFocused + ? handleClickOutside + : undefined, }); const focusInput = () => {