Feat/better hotkeys scope (#526)

* Working version

* fix

* Fixed console log

* Fix lint

* wip

* Fix

* Fix

* consolelog

---------

Co-authored-by: Charles Bochet <charles@twenty.com>

front/src/modules/hotkeys/hooks/internal/useHotkeysScope.ts

@@ -0,0 +1,103 @@
+import { useHotkeysContext } from 'react-hotkeys-hook';
+import { useRecoilCallback } from 'recoil';
+
+import { internalHotkeysEnabledScopesState } from '@/hotkeys/states/internal/internalHotkeysEnabledScopesState';
+
+export function useHotkeysScope() {
+  const { disableScope, enableScope } = useHotkeysContext();
+
+  const disableAllHotkeysScopes = useRecoilCallback(
+    ({ set, snapshot }) => {
+      return async () => {
+        const enabledScopes = await snapshot.getPromise(
+          internalHotkeysEnabledScopesState,
+        );
+
+        for (const enabledScope of enabledScopes) {
+          disableScope(enabledScope);
+        }
+
+        set(internalHotkeysEnabledScopesState, []);
+      };
+    },
+    [disableScope],
+  );
+
+  const enableHotkeysScope = useRecoilCallback(
+    ({ set, snapshot }) => {
+      return async (scopeToEnable: string) => {
+        const enabledScopes = await snapshot.getPromise(
+          internalHotkeysEnabledScopesState,
+        );
+
+        if (!enabledScopes.includes(scopeToEnable)) {
+          enableScope(scopeToEnable);
+          set(internalHotkeysEnabledScopesState, [
+            ...enabledScopes,
+            scopeToEnable,
+          ]);
+        }
+      };
+    },
+    [enableScope],
+  );
+
+  const disableHotkeysScope = useRecoilCallback(
+    ({ set, snapshot }) => {
+      return async (scopeToDisable: string) => {
+        const enabledScopes = await snapshot.getPromise(
+          internalHotkeysEnabledScopesState,
+        );
+
+        const scopeToRemoveIndex = enabledScopes.findIndex(
+          (scope) => scope === scopeToDisable,
+        );
+
+        if (scopeToRemoveIndex > -1) {
+          disableScope(scopeToDisable);
+
+          enabledScopes.splice(scopeToRemoveIndex);
+
+          set(internalHotkeysEnabledScopesState, enabledScopes);
+        }
+      };
+    },
+    [disableScope],
+  );
+
+  const setHotkeysScopes = useRecoilCallback(
+    ({ set, snapshot }) => {
+      return async (scopesToSet: string[]) => {
+        const enabledScopes = await snapshot.getPromise(
+          internalHotkeysEnabledScopesState,
+        );
+
+        const scopesToDisable = enabledScopes.filter(
+          (enabledScope) => !scopesToSet.includes(enabledScope),
+        );
+
+        const scopesToEnable = scopesToSet.filter(
+          (scopeToSet) => !enabledScopes.includes(scopeToSet),
+        );
+
+        for (const scopeToDisable of scopesToDisable) {
+          disableScope(scopeToDisable);
+        }
+
+        for (const scopeToEnable of scopesToEnable) {
+          enableScope(scopeToEnable);
+        }
+
+        set(internalHotkeysEnabledScopesState, scopesToSet);
+      };
+    },
+    [disableScope, enableScope],
+  );
+
+  return {
+    disableAllHotkeysScopes,
+    enableHotkeysScope,
+    disableHotkeysScope,
+    setHotkeysScopes,
+  };
+}

front/src/modules/hotkeys/hooks/internal/useHotkeysScopeStackAutoSync.ts

@@ -0,0 +1,37 @@
+import { useEffect } from 'react';
+import { useRecoilValue } from 'recoil';
+
+import { customHotkeysScopesState } from '@/hotkeys/states/internal/customHotkeysScopesState';
+import { hotkeysScopeStackState } from '@/hotkeys/states/internal/hotkeysScopeStackState';
+import { InternalHotkeysScope } from '@/hotkeys/types/internal/InternalHotkeysScope';
+
+import { useHotkeysScope } from './useHotkeysScope';
+
+export function useHotkeysScopeStackAutoSync() {
+  const { setHotkeysScopes } = useHotkeysScope();
+
+  const hotkeysScopeStack = useRecoilValue(hotkeysScopeStackState);
+  const customHotkeysScopes = useRecoilValue(customHotkeysScopesState);
+
+  useEffect(() => {
+    if (hotkeysScopeStack.length === 0) {
+      return;
+    }
+
+    const scopesToSet: string[] = [];
+
+    const currentHotkeysScope = hotkeysScopeStack[hotkeysScopeStack.length - 1];
+
+    if (currentHotkeysScope.customScopes?.['command-menu']) {
+      scopesToSet.push(InternalHotkeysScope.CommandMenu);
+    }
+
+    if (currentHotkeysScope?.customScopes?.goto) {
+      scopesToSet.push(InternalHotkeysScope.Goto);
+    }
+
+    scopesToSet.push(currentHotkeysScope.scope);
+
+    setHotkeysScopes(scopesToSet);
+  }, [setHotkeysScopes, customHotkeysScopes, hotkeysScopeStack]);
+}