Introduce generic way to close any open dropdown on page location change (#11504)

In this PR we introduce a generic way to close any open dropdown
idempotently, with the hook useCloseAnyOpenDropdown.

We also introduce a generic hook useExecuteTasksOnAnyLocationChange that
is called each time the page location changes.

This way we can close any open dropdown when the page location changes,
which fixes the original issue of having advanced filter dropdown
staying open between page changes.

Fixes https://github.com/twentyhq/core-team-issues/issues/659

packages/twenty-front/src/modules/app/effect-components/PageChangeEffect.tsx

@@ -13,6 +13,7 @@ import {
   setSessionId,
   useEventTracker,
 } from '@/analytics/hooks/useEventTracker';
+import { useExecuteTasksOnAnyLocationChange } from '@/app/hooks/useExecuteTasksOnAnyLocationChange';
 import { useRequestFreshCaptchaToken } from '@/captcha/hooks/useRequestFreshCaptchaToken';
 import { isCaptchaScriptLoadedState } from '@/captcha/states/isCaptchaScriptLoadedState';
 import { isCaptchaRequiredForPath } from '@/captcha/utils/isCaptchaRequiredForPath';
@@ -52,13 +53,17 @@ export const PageChangeEffect = () => {
 
   const resetTableSelections = useResetTableRowSelection(objectNamePlural);
 
+  const { executeTasksOnAnyLocationChange } =
+    useExecuteTasksOnAnyLocationChange();
+
   useEffect(() => {
     if (!previousLocation || previousLocation !== location.pathname) {
       setPreviousLocation(location.pathname);
+      executeTasksOnAnyLocationChange();
     } else {
       return;
     }
-  }, [location, previousLocation]);
+  }, [location, previousLocation, executeTasksOnAnyLocationChange]);
 
   const [searchParams] = useSearchParams();
 

packages/twenty-front/src/modules/app/hooks/useExecuteTasksOnAnyLocationChange.ts

@@ -0,0 +1,16 @@
+import { useCloseAnyOpenDropdown } from '@/ui/layout/dropdown/hooks/useCloseAnyOpenDropdown';
+
+export const useExecuteTasksOnAnyLocationChange = () => {
+  const { closeAnyOpenDropdown } = useCloseAnyOpenDropdown();
+
+  /**
+   * Be careful to put idempotent tasks here.
+   *
+   * Because it might be called multiple times.
+   */
+  const executeTasksOnAnyLocationChange = () => {
+    closeAnyOpenDropdown();
+  };
+
+  return { executeTasksOnAnyLocationChange };
+};