fix: Country Dropdown not closing with AddressInput (#8147)

## Description

- This PR fixes #8080 
- The Country Selector dropdown closes with Address Input `clickOutside`
function

## Changes


https://github.com/user-attachments/assets/1ab85175-9ce9-40d2-ac52-14bfe87e254f

---------

Co-authored-by: Devessier <baptiste@devessier.fr>
This commit is contained in:
Harshit Singh
2024-10-29 14:33:28 +05:30
committed by GitHub
parent 94f2e1067b
commit 7901dbc02f
2 changed files with 19 additions and 1 deletions

View File

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

View File

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