Revert "fix: Country Dropdown not closing with AddressInput " (#8174)

Reverts twentyhq/twenty#8147
This commit is contained in:
Baptiste Devessier
2024-10-29 15:55:18 +01:00
committed by GitHub
parent 31ecaf2a0d
commit d887a857ca
3 changed files with 9 additions and 19 deletions

View File

@ -5,7 +5,9 @@ import { Key } from 'ts-key-enum';
import { FieldAddressDraftValue } from '@/object-record/record-field/types/FieldInputDraftValue'; import { FieldAddressDraftValue } from '@/object-record/record-field/types/FieldInputDraftValue';
import { FieldAddressValue } from '@/object-record/record-field/types/FieldMetadata'; import { FieldAddressValue } from '@/object-record/record-field/types/FieldMetadata';
import { CountrySelect } from '@/ui/input/components/internal/country/components/CountrySelect'; import { CountrySelect } from '@/ui/input/components/internal/country/components/CountrySelect';
import { SELECT_COUNTRY_DROPDOWN_ID } from '@/ui/input/components/internal/country/constants/SelectCountryDropdownId';
import { TextInputV2 } from '@/ui/input/components/TextInputV2'; import { TextInputV2 } from '@/ui/input/components/TextInputV2';
import { useDropdown } from '@/ui/layout/dropdown/hooks/useDropdown';
import { useScopedHotkeys } from '@/ui/utilities/hotkey/hooks/useScopedHotkeys'; import { useScopedHotkeys } from '@/ui/utilities/hotkey/hooks/useScopedHotkeys';
import { useClickOutsideListener } from '@/ui/utilities/pointer-event/hooks/useClickOutsideListener'; import { useClickOutsideListener } from '@/ui/utilities/pointer-event/hooks/useClickOutsideListener';
import { MOBILE_VIEWPORT } from 'twenty-ui'; import { MOBILE_VIEWPORT } from 'twenty-ui';
@ -93,6 +95,10 @@ export const AddressInput = ({
const [focusPosition, setFocusPosition] = const [focusPosition, setFocusPosition] =
useState<keyof FieldAddressDraftValue>('addressStreet1'); useState<keyof FieldAddressDraftValue>('addressStreet1');
const { closeDropdown: closeCountryDropdown } = useDropdown(
SELECT_COUNTRY_DROPDOWN_ID,
);
const wrapperRef = useRef<HTMLDivElement>(null); const wrapperRef = useRef<HTMLDivElement>(null);
const getChangeHandler = const getChangeHandler =
@ -186,6 +192,8 @@ export const AddressInput = ({
callback: (event) => { callback: (event) => {
event.stopImmediatePropagation(); event.stopImmediatePropagation();
closeCountryDropdown();
onClickOutside?.(event, internalValue); onClickOutside?.(event, internalValue);
}, },
enabled: isDefined(onClickOutside), enabled: isDefined(onClickOutside),

View File

@ -71,7 +71,6 @@ export const Dropdown = ({
closeDropdown, closeDropdown,
dropdownWidth, dropdownWidth,
setDropdownPlacement, setDropdownPlacement,
resetDropdown,
} = useDropdown(dropdownId); } = useDropdown(dropdownId);
const offsetMiddlewares = []; const offsetMiddlewares = [];
@ -144,12 +143,6 @@ export const Dropdown = ({
[closeDropdown], [closeDropdown],
); );
useEffect(() => {
return () => {
resetDropdown();
};
}, [resetDropdown]);
return ( return (
<DropdownScope dropdownScopeId={getScopeIdFromComponentId(dropdownId)}> <DropdownScope dropdownScopeId={getScopeIdFromComponentId(dropdownId)}>
<div ref={containerRef} className={className}> <div ref={containerRef} className={className}>

View File

@ -1,4 +1,4 @@
import { useRecoilCallback, useRecoilState } from 'recoil'; import { useRecoilState } from 'recoil';
import { useDropdownStates } from '@/ui/layout/dropdown/hooks/internal/useDropdownStates'; import { useDropdownStates } from '@/ui/layout/dropdown/hooks/internal/useDropdownStates';
import { usePreviousHotkeyScope } from '@/ui/utilities/hotkey/hooks/usePreviousHotkeyScope'; import { usePreviousHotkeyScope } from '@/ui/utilities/hotkey/hooks/usePreviousHotkeyScope';
@ -56,16 +56,6 @@ export const useDropdown = (dropdownId?: string) => {
} }
}; };
const resetDropdown = useRecoilCallback(
({ reset }) =>
() => {
reset(dropdownHotkeyScopeState);
reset(dropdownWidthState);
reset(isDropdownOpenState);
},
[dropdownHotkeyScopeState, dropdownWidthState, isDropdownOpenState],
);
return { return {
scopeId, scopeId,
isDropdownOpen, isDropdownOpen,
@ -76,6 +66,5 @@ export const useDropdown = (dropdownId?: string) => {
setDropdownWidth, setDropdownWidth,
dropdownPlacement, dropdownPlacement,
setDropdownPlacement, setDropdownPlacement,
resetDropdown,
}; };
}; };