diff --git a/packages/twenty-front/src/modules/ui/layout/dropdown/components/Dropdown.tsx b/packages/twenty-front/src/modules/ui/layout/dropdown/components/Dropdown.tsx index c6d5205e3888..c4d62a560024 100644 --- a/packages/twenty-front/src/modules/ui/layout/dropdown/components/Dropdown.tsx +++ b/packages/twenty-front/src/modules/ui/layout/dropdown/components/Dropdown.tsx @@ -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 (
diff --git a/packages/twenty-front/src/modules/ui/layout/dropdown/hooks/useDropdown.ts b/packages/twenty-front/src/modules/ui/layout/dropdown/hooks/useDropdown.ts index 24225beabcc4..1386773d7f4a 100644 --- a/packages/twenty-front/src/modules/ui/layout/dropdown/hooks/useDropdown.ts +++ b/packages/twenty-front/src/modules/ui/layout/dropdown/hooks/useDropdown.ts @@ -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, }; };