diff --git a/front/src/modules/companies/editable-field/components/CompanyNameEditableField.tsx b/front/src/modules/companies/editable-field/components/CompanyNameEditableField.tsx index 60d094013..0a117ad16 100644 --- a/front/src/modules/companies/editable-field/components/CompanyNameEditableField.tsx +++ b/front/src/modules/companies/editable-field/components/CompanyNameEditableField.tsx @@ -2,9 +2,12 @@ import { useEffect, useState } from 'react'; import styled from '@emotion/styled'; import { FieldRecoilScopeContext } from '@/ui/data/inline-cell/states/recoil-scope-contexts/FieldRecoilScopeContext'; +import { usePreviousHotkeyScope } from '@/ui/utilities/hotkey/hooks/usePreviousHotkeyScope'; import { RecoilScope } from '@/ui/utilities/recoil-scope/components/RecoilScope'; import { Company, useUpdateOneCompanyMutation } from '~/generated/graphql'; +import { EditableFieldHotkeyScope } from '../types/EditableFieldHotkeyScope'; + type CompanyNameEditableFieldProps = { company: Pick; }; @@ -40,6 +43,11 @@ export const CompanyNameEditableField = ({ const [updateCompany] = useUpdateOneCompanyMutation(); + const { + goBackToPreviousHotkeyScope, + setHotkeyScopeAndMemorizePreviousScope, + } = usePreviousHotkeyScope(); + useEffect(() => { setInternalValue(company.name); }, [company.name]); @@ -49,6 +57,7 @@ export const CompanyNameEditableField = ({ }; const handleSubmit = async () => { + goBackToPreviousHotkeyScope(); await updateCompany({ variables: { where: { @@ -61,12 +70,19 @@ export const CompanyNameEditableField = ({ }); }; + const handleFocus = async () => { + setHotkeyScopeAndMemorizePreviousScope( + EditableFieldHotkeyScope.EditableField, + ); + }; + return ( handleChange(event.target.value)} onBlur={handleSubmit} + onFocus={handleFocus} value={internalValue} /> diff --git a/front/src/modules/companies/editable-field/types/EditableFieldHotkeyScope.ts b/front/src/modules/companies/editable-field/types/EditableFieldHotkeyScope.ts new file mode 100644 index 000000000..309495c8f --- /dev/null +++ b/front/src/modules/companies/editable-field/types/EditableFieldHotkeyScope.ts @@ -0,0 +1,3 @@ +export enum EditableFieldHotkeyScope { + EditableField = 'editable-field', +} diff --git a/front/src/modules/ui/input/components/EntityTitleDoubleTextInput.tsx b/front/src/modules/ui/input/components/EntityTitleDoubleTextInput.tsx index d10cad5f0..6f08f7ead 100644 --- a/front/src/modules/ui/input/components/EntityTitleDoubleTextInput.tsx +++ b/front/src/modules/ui/input/components/EntityTitleDoubleTextInput.tsx @@ -3,6 +3,9 @@ import styled from '@emotion/styled'; import { StyledInput } from '@/ui/data/field/meta-types/input/components/internal/TextInput'; import { ComputeNodeDimensions } from '@/ui/utilities/dimensions/components/ComputeNodeDimensions'; +import { usePreviousHotkeyScope } from '@/ui/utilities/hotkey/hooks/usePreviousHotkeyScope'; + +import { InputHotkeyScope } from '../types/InputHotkeyScope'; export type EntityTitleDoubleTextInputProps = { firstValue: string; @@ -38,32 +41,48 @@ export const EntityTitleDoubleTextInput = ({ firstValuePlaceholder, secondValuePlaceholder, onChange, -}: EntityTitleDoubleTextInputProps) => ( - - - {(nodeDimensions) => ( - ) => { - onChange(event.target.value, secondValue); - }} - /> - )} - - - {(nodeDimensions) => ( - ) => { - onChange(firstValue, event.target.value); - }} - /> - )} - - -); +}: EntityTitleDoubleTextInputProps) => { + const { + goBackToPreviousHotkeyScope, + setHotkeyScopeAndMemorizePreviousScope, + } = usePreviousHotkeyScope(); + const handleFocus = () => { + setHotkeyScopeAndMemorizePreviousScope(InputHotkeyScope.TextInput); + }; + const handleBlur = () => { + goBackToPreviousHotkeyScope(); + }; + + return ( + + + {(nodeDimensions) => ( + ) => { + onChange(event.target.value, secondValue); + }} + /> + )} + + + {(nodeDimensions) => ( + ) => { + onChange(firstValue, event.target.value); + }} + /> + )} + + + ); +};