From cbc0d06a2f7b0dc5909851020d11dfcb2e8ea6ee Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Rapha=C3=ABl=20Bosi?=
 <71827178+bosiraphael@users.noreply.github.com>
Date: Thu, 19 Jun 2025 14:53:18 +0200
Subject: [PATCH] Replace hotkey scopes by focus stack (Part 1 - Dropdowns and
 Side Panel) (#12673)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

This PR is the first part of a refactoring aiming to deprecate the
hotkey scopes api in favor of the new focus stack api which is more
robust.

The refactored components in this PR are the dropdowns and the side
panel/command menu.

- Replaced `useScopedHotkeys` by `useHotkeysOnFocusedElement` for all
dropdown components, selectable lists and the command menu
- Introduced `focusId` for all dropdowns and created a common hotkey
scope `DropdownHotkeyScope` for backward compatibility
- Replaced `setHotkeyScopeAndMemorizePreviousScope` occurrences with
`usePushFocusItemToFocusStack` and `goBackToPreviousHotkeyScope` with
`removeFocusItemFromFocusStack`

Note: Test that the shorcuts and arrow key navigation still work
properly when interacting with dropdowns and the command menu.

Bugs that I have spotted during the QA but which are already present on
main:
- Icon picker select with arrow keys doesn’t work inside dropdowns
- Some dropdowns are not selectable with arrow keys (no selectable list)
- Dropdowns in dropdowns don’t reset the hotkey scope correctly when
closing
- The table click outside is not triggered after closing a table cell
and clicking outside of the table
---
 .../components/CmdEnterActionButton.tsx       | 16 ++--
 .../CommandMenuActionMenuDropdown.tsx         | 58 +++++++------
 .../RecordIndexActionMenuDropdown.tsx         |  8 +-
 .../RecordShowRightDrawerOpenRecordButton.tsx | 16 ++--
 .../types/ActionMenuDropdownHotKeyScope.ts    |  3 -
 ...ommandMenuActionMenuDropdownHotkeyScope.ts |  3 -
 .../files/components/AttachmentDropdown.tsx   |  1 -
 .../components/ActivityTargetsInlineCell.tsx  |  1 +
 .../useOpenActivityTargetCellEditMode.ts      | 21 +++--
 .../CommandMenuContextChipGroups.tsx          |  4 -
 .../components/CommandMenuList.tsx            |  4 +-
 .../constants/SidePanelFocusId.ts             |  1 +
 .../command-menu/hooks/useCommandMenu.ts      | 13 ++-
 .../hooks/useNavigateCommandMenu.ts           | 25 ++++--
 ...riteFolderNavigationDrawerItemDropdown.tsx |  4 -
 .../components/FavoriteFolderPicker.tsx       | 34 +++++---
 .../AdvancedFilterAddFilterRuleSelect.tsx     |  1 -
 .../AdvancedFilterDropdownFilterInput.tsx     | 11 ++-
 ...dvancedFilterFieldSelectDropdownButton.tsx |  1 -
 .../AdvancedFilterFieldSelectMenu.tsx         |  4 +-
 ...FilterRecordFilterGroupOptionsDropdown.tsx |  1 -
 ...FilterRecordFilterOperandSelectContent.tsx |  5 +-
 ...ancedFilterRecordFilterOptionsDropdown.tsx |  1 -
 .../AdvancedFilterSubFieldSelectMenu.tsx      |  4 +-
 .../components/AdvancedFilterValueInput.tsx   |  6 +-
 ...SelectFieldUsedInAdvancedFilterDropdown.ts | 20 +++--
 .../ObjectFilterDropdownBooleanSelect.tsx     |  5 +-
 .../ObjectFilterDropdownFilterInput.tsx       |  9 +-
 .../ObjectFilterDropdownOperandDropdown.tsx   |  4 -
 .../ObjectFilterDropdownOptionSelect.tsx      | 26 +++---
 .../ObjectFilterDropdownRecordSelect.tsx      |  5 +-
 .../ObjectFilterDropdownSourceSelect.tsx      |  9 +-
 .../types/FiltersHotkeyScope.ts               |  5 --
 .../components/ObjectOptionsDropdown.tsx      |  2 -
 .../ObjectOptionsDropdownLayoutContent.tsx    |  5 +-
 ...jectOptionsDropdownLayoutOpenInContent.tsx |  5 +-
 .../ObjectOptionsDropdownMenuContent.tsx      | 16 +---
 .../ObjectOptionsDropdownMenuViewName.tsx     | 17 ++--
 ...tOptionsDropdownRecordGroupSortContent.tsx |  5 +-
 ...jectOptionsDropdownRecordGroupsContent.tsx | 12 ++-
 .../components/ObjectSortDropdownButton.tsx   | 30 +++----
 .../components/RecordBoardCard.tsx            |  4 +-
 ...cordBoardColumnHeaderAggregateDropdown.tsx |  4 -
 .../components/FormMultiSelectFieldInput.tsx  |  4 +-
 .../components/FormSingleRecordPicker.tsx     |  4 +-
 .../hooks/useOpenFieldInputEditMode.ts        | 33 ++++++--
 .../meta-types/hooks/useMultiSelectField.ts   |  1 +
 .../meta-types/hooks/useSelectField.ts        |  1 +
 .../components/MultiSelectFieldInput.tsx      | 10 ++-
 .../components/RelationFromManyFieldInput.tsx |  7 +-
 .../components/RelationToOneFieldInput.tsx    |  7 +-
 .../input/components/SelectFieldInput.tsx     |  9 +-
 .../RelationFromManyFieldInput.stories.tsx    | 10 ++-
 .../RelationToOneFieldInput.stories.tsx       | 31 +++++--
 .../useOpenRelationFromManyFieldInput.tsx     | 27 ++++--
 .../hooks/useOpenRelationToOneFieldInput.tsx  | 26 ++++--
 .../input/types/RelationPickerHotkeyScope.ts  |  3 -
 ...getRelationFromManyFieldInputInstanceId.ts |  9 ++
 .../getRelationToOneFieldInputInstanceId.ts   |  9 ++
 .../utils/getFieldInputInstanceId.ts          |  6 ++
 .../components/MultipleRecordPicker.tsx       | 29 ++++---
 .../MultipleRecordPickerItemsDisplay.tsx      |  4 +-
 .../MultipleRecordPickerMenuItems.tsx         |  7 +-
 .../types/MultipleRecordPickerHotkeyScope.ts  |  3 -
 .../components/SingleRecordPicker.tsx         |  2 +
 .../SingleRecordPickerMenuItems.tsx           | 24 +++---
 .../SingleRecordPickerMenuItemsWithSearch.tsx |  5 ++
 .../types/SingleRecordPickerHotkeyScope.ts    |  3 -
 .../RecordDetailRelationRecordsListItem.tsx   |  1 -
 .../RecordDetailRelationSectionDropdown.tsx   |  3 +-
 .../useCloseRecordTableCellInGroup.ts         |  8 ++
 .../useCloseRecordTableCellNoGroup.ts         |  8 ++
 .../hooks/useTriggerActionMenuDropdown.ts     |  5 +-
 ...TableColumnAggregateFooterWithDropdown.tsx |  1 -
 .../RecordTableColumnHeadWithDropdown.tsx     |  1 -
 .../RecordTableHeaderLastColumn.tsx           |  6 --
 .../components/MultipleSelectDropdown.tsx     | 23 ++---
 .../SettingsAccountsRowDropdownMenu.tsx       |  1 -
 .../ConfigVariableDatabaseInput.tsx           |  2 -
 .../ConfigVariableFilterDropdown.tsx          |  1 -
 ...ngsDataModelNewFieldBreadcrumbDropDown.tsx |  1 -
 ...tingsDataModelFieldSelectFormOptionRow.tsx |  2 -
 ...ettingsObjectFieldActiveActionDropdown.tsx |  1 -
 ...tingsObjectFieldDisabledActionDropdown.tsx |  3 -
 .../SettingsObjectInactiveMenuDropDown.tsx    |  1 -
 ...tegrationDatabaseConnectionSummaryCard.tsx |  1 -
 .../components/SettingsRoleAssignment.tsx     |  1 -
 .../SettingsSecuritySSORowDropdownMenu.tsx    |  1 -
 ...ityApprovedAccessDomainRowDropdownMenu.tsx |  1 -
 ...FunctionTabEnvironmentVariableTableRow.tsx |  1 -
 .../components/MatchColumnToFieldSelect.tsx   |  3 -
 .../SubMatchingSelectRowRightDropdown.tsx     |  1 -
 .../support/components/SupportDropdown.tsx    |  1 -
 .../input/components/MultiSelectInput.tsx     | 52 +++++++-----
 .../ui/field/input/components/SelectInput.tsx | 10 ++-
 .../ui/input/components/IconPicker.tsx        |  8 +-
 .../modules/ui/input/components/Select.tsx    |  6 +-
 .../ui/input/components/SelectInput.tsx       | 83 +++++++++++--------
 .../CurrencyPickerDropdownButton.tsx          |  1 -
 .../PhoneCountryPickerDropdownButton.tsx      |  3 -
 .../ui/input/types/SelectHotkeyScope.ts       |  3 -
 .../layout/dropdown/components/Dropdown.tsx   | 32 +++----
 .../components/DropdownMenuInnerSelect.tsx    | 10 +--
 .../__stories__/Dropdown.stories.tsx          |  3 -
 .../DropdownMenuHeader.stories.tsx            |  2 -
 .../internal/DropdownInternalContainer.tsx    | 37 +++++----
 .../dropdown/constants/DropdownHotkeyScope.ts |  3 +
 .../constants/DropdownMenuHotkeyScope.ts      |  3 -
 .../useInternalHotkeyScopeManagement.test.tsx | 47 -----------
 .../hooks/internal/useDropdownStates.ts       |  5 --
 .../dropdown/hooks/useCloseAnyOpenDropdown.ts | 18 ++--
 .../ui/layout/dropdown/hooks/useDropdown.ts   | 81 +++++++++---------
 .../ui/layout/dropdown/hooks/useDropdownV2.ts | 71 +++++++++-------
 .../hooks/useInternalHotkeyScopeManagement.ts | 30 -------
 .../states/dropdownHotkeyComponentState.ts    |  9 --
 .../ui/layout/modal/hooks/useModal.tsx        | 14 ++--
 .../components/SelectableList.tsx             | 15 +++-
 .../SelectableListItemHotkeyEffect.tsx        |  6 +-
 .../internal/useSelectableListHotKeys.ts      | 41 ++++++---
 ...SelectableListListenToEnterHotkeyOnItem.ts | 23 +++--
 .../states/contexts/SelectableListContext.tsx |  1 +
 .../tab-list/components/TabListDropdown.tsx   |  1 -
 .../components/MenuItemWithOptionDropdown.tsx |  2 -
 .../MultiWorkspaceDropdownButton.tsx          |  4 -
 ...ultiWorkspaceDropdownDefaultComponents.tsx |  8 +-
 .../focus/constants/DebugFocusStack.ts        |  3 +
 .../usePushFocusItemToFocusStack.test.tsx     |  8 +-
 ...useRemoveFocusItemFromFocusStack.test.tsx} | 21 ++---
 .../__tests__/useResetFocusStack.test.tsx     |  8 +-
 .../useResetFocusStackToFocusItem.test.tsx    | 10 +--
 .../hooks/usePushFocusItemToFocusStack.ts     | 56 +++++++++----
 .../hooks/useRemoveFocusIdFromFocusStack.ts   | 22 -----
 .../hooks/useRemoveFocusItemFromFocusStack.ts | 34 ++++++++
 .../focus/hooks/useResetFocusStack.ts         | 10 ++-
 .../hooks/useResetFocusStackToFocusItem.ts    | 12 ++-
 .../focus/types/FocusComponentType.ts         |  3 +
 .../hotkey/components/HotkeyEffect.tsx        | 16 ++--
 .../useHotkeysOnFocusedElementCallback.ts     |  4 +-
 .../AdvancedFilterDropdownButton.tsx          |  1 -
 .../EditableFilterDropdownButton.tsx          |  4 -
 .../components/UpdateViewButtonGroup.tsx      |  5 +-
 .../src/modules/views/components/ViewBar.tsx  | 22 +----
 .../views/components/ViewBarDetails.tsx       |  7 +-
 .../views/components/ViewBarFilterButton.tsx  | 17 +---
 .../components/ViewBarFilterDropdown.tsx      | 15 ++--
 ...wBarFilterDropdownAdvancedFilterButton.tsx |  4 +-
 .../ViewBarFilterDropdownFieldSelectMenu.tsx  |  6 +-
 ...temFromViewBarFilterDropdown.test.test.tsx | 28 +++++--
 ...ldMetadataItemFromViewBarFilterDropdown.ts | 28 +++++--
 .../modules/views/types/ViewsHotkeyScope.ts   |  4 -
 .../ViewPickerContentCreateMode.tsx           | 31 +++----
 .../components/ViewPickerContentEditMode.tsx  | 21 +++--
 .../components/ViewPickerDropdown.tsx         |  2 -
 .../WorkflowEditTriggerDatabaseEventForm.tsx  |  4 +-
 .../components/WorkflowVariablesDropdown.tsx  |  3 -
 155 files changed, 977 insertions(+), 845 deletions(-)
 delete mode 100644 packages/twenty-front/src/modules/action-menu/types/ActionMenuDropdownHotKeyScope.ts
 delete mode 100644 packages/twenty-front/src/modules/action-menu/types/CommandMenuActionMenuDropdownHotkeyScope.ts
 create mode 100644 packages/twenty-front/src/modules/command-menu/constants/SidePanelFocusId.ts
 delete mode 100644 packages/twenty-front/src/modules/object-record/object-filter-dropdown/types/FiltersHotkeyScope.ts
 delete mode 100644 packages/twenty-front/src/modules/object-record/record-field/meta-types/input/types/RelationPickerHotkeyScope.ts
 create mode 100644 packages/twenty-front/src/modules/object-record/record-field/meta-types/input/utils/getRelationFromManyFieldInputInstanceId.ts
 create mode 100644 packages/twenty-front/src/modules/object-record/record-field/meta-types/input/utils/getRelationToOneFieldInputInstanceId.ts
 create mode 100644 packages/twenty-front/src/modules/object-record/record-field/utils/getFieldInputInstanceId.ts
 delete mode 100644 packages/twenty-front/src/modules/object-record/record-picker/multiple-record-picker/types/MultipleRecordPickerHotkeyScope.ts
 delete mode 100644 packages/twenty-front/src/modules/object-record/record-picker/single-record-picker/types/SingleRecordPickerHotkeyScope.ts
 delete mode 100644 packages/twenty-front/src/modules/ui/input/types/SelectHotkeyScope.ts
 create mode 100644 packages/twenty-front/src/modules/ui/layout/dropdown/constants/DropdownHotkeyScope.ts
 delete mode 100644 packages/twenty-front/src/modules/ui/layout/dropdown/constants/DropdownMenuHotkeyScope.ts
 delete mode 100644 packages/twenty-front/src/modules/ui/layout/dropdown/hooks/__tests__/useInternalHotkeyScopeManagement.test.tsx
 delete mode 100644 packages/twenty-front/src/modules/ui/layout/dropdown/hooks/useInternalHotkeyScopeManagement.ts
 delete mode 100644 packages/twenty-front/src/modules/ui/layout/dropdown/states/dropdownHotkeyComponentState.ts
 create mode 100644 packages/twenty-front/src/modules/ui/utilities/focus/constants/DebugFocusStack.ts
 rename packages/twenty-front/src/modules/ui/utilities/focus/hooks/__tests__/{useRemoveFocusIdFromFocusStack.test.tsx => useRemoveFocusItemFromFocusStack.test.tsx} (81%)
 delete mode 100644 packages/twenty-front/src/modules/ui/utilities/focus/hooks/useRemoveFocusIdFromFocusStack.ts
 create mode 100644 packages/twenty-front/src/modules/ui/utilities/focus/hooks/useRemoveFocusItemFromFocusStack.ts
 delete mode 100644 packages/twenty-front/src/modules/views/types/ViewsHotkeyScope.ts

diff --git a/packages/twenty-front/src/modules/action-menu/components/CmdEnterActionButton.tsx b/packages/twenty-front/src/modules/action-menu/components/CmdEnterActionButton.tsx
index 0d3227416..e7076b5dd 100644
--- a/packages/twenty-front/src/modules/action-menu/components/CmdEnterActionButton.tsx
+++ b/packages/twenty-front/src/modules/action-menu/components/CmdEnterActionButton.tsx
@@ -1,4 +1,5 @@
-import { useScopedHotkeys } from '@/ui/utilities/hotkey/hooks/useScopedHotkeys';
+import { SIDE_PANEL_FOCUS_ID } from '@/command-menu/constants/SidePanelFocusId';
+import { useHotkeysOnFocusedElement } from '@/ui/utilities/hotkey/hooks/useHotkeysOnFocusedElement';
 import { AppHotkeyScope } from '@/ui/utilities/hotkey/types/AppHotkeyScope';
 import { Key } from 'ts-key-enum';
 import { Button } from 'twenty-ui/input';
@@ -13,12 +14,13 @@ export const CmdEnterActionButton = ({
   onClick: () => void;
   disabled?: boolean;
 }) => {
-  useScopedHotkeys(
-    [`${Key.Control}+${Key.Enter}`, `${Key.Meta}+${Key.Enter}`],
-    () => onClick(),
-    AppHotkeyScope.CommandMenuOpen,
-    [onClick],
-  );
+  useHotkeysOnFocusedElement({
+    keys: [`${Key.Control}+${Key.Enter}`, `${Key.Meta}+${Key.Enter}`],
+    callback: () => onClick(),
+    focusId: SIDE_PANEL_FOCUS_ID,
+    scope: AppHotkeyScope.CommandMenuOpen,
+    dependencies: [onClick],
+  });
 
   return (
     <Button
diff --git a/packages/twenty-front/src/modules/action-menu/components/CommandMenuActionMenuDropdown.tsx b/packages/twenty-front/src/modules/action-menu/components/CommandMenuActionMenuDropdown.tsx
index 683a109b7..f63be138b 100644
--- a/packages/twenty-front/src/modules/action-menu/components/CommandMenuActionMenuDropdown.tsx
+++ b/packages/twenty-front/src/modules/action-menu/components/CommandMenuActionMenuDropdown.tsx
@@ -2,15 +2,16 @@ import { ActionComponent } from '@/action-menu/actions/display/components/Action
 import { ActionScope } from '@/action-menu/actions/types/ActionScope';
 import { ActionMenuContext } from '@/action-menu/contexts/ActionMenuContext';
 import { ActionMenuComponentInstanceContext } from '@/action-menu/states/contexts/ActionMenuComponentInstanceContext';
-import { CommandMenuActionMenuDropdownHotkeyScope } from '@/action-menu/types/CommandMenuActionMenuDropdownHotkeyScope';
 import { getRightDrawerActionMenuDropdownIdFromActionMenuId } from '@/action-menu/utils/getRightDrawerActionMenuDropdownIdFromActionMenuId';
+import { SIDE_PANEL_FOCUS_ID } from '@/command-menu/constants/SidePanelFocusId';
 import { Dropdown } from '@/ui/layout/dropdown/components/Dropdown';
 import { DropdownContent } from '@/ui/layout/dropdown/components/DropdownContent';
 import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer';
+import { DropdownHotkeyScope } from '@/ui/layout/dropdown/constants/DropdownHotkeyScope';
 import { useDropdownV2 } from '@/ui/layout/dropdown/hooks/useDropdownV2';
 import { SelectableList } from '@/ui/layout/selectable-list/components/SelectableList';
 import { useSelectableList } from '@/ui/layout/selectable-list/hooks/useSelectableList';
-import { useScopedHotkeys } from '@/ui/utilities/hotkey/hooks/useScopedHotkeys';
+import { useHotkeysOnFocusedElement } from '@/ui/utilities/hotkey/hooks/useHotkeysOnFocusedElement';
 import { AppHotkeyScope } from '@/ui/utilities/hotkey/types/AppHotkeyScope';
 import { useAvailableComponentInstanceIdOrThrow } from '@/ui/utilities/state/component-state/hooks/useAvailableComponentInstanceIdOrThrow';
 import { useTheme } from '@emotion/react';
@@ -25,24 +26,30 @@ export const CommandMenuActionMenuDropdown = () => {
     ActionMenuComponentInstanceContext,
   );
 
-  const { toggleDropdown } = useDropdownV2();
-
   const theme = useTheme();
 
-  useScopedHotkeys(
-    ['ctrl+o,meta+o'],
-    () => {
-      toggleDropdown(
-        getRightDrawerActionMenuDropdownIdFromActionMenuId(actionMenuId),
-        {
-          scope:
-            CommandMenuActionMenuDropdownHotkeyScope.CommandMenuActionMenuDropdown,
-        },
-      );
+  const dropdownId =
+    getRightDrawerActionMenuDropdownIdFromActionMenuId(actionMenuId);
+  const { toggleDropdown } = useDropdownV2();
+
+  const hotkeysConfig = {
+    keys: ['ctrl+o', 'meta+o'],
+    callback: () => {
+      toggleDropdown(dropdownId);
     },
-    AppHotkeyScope.CommandMenuOpen,
-    [toggleDropdown],
-  );
+    scope: AppHotkeyScope.CommandMenuOpen,
+    dependencies: [toggleDropdown],
+  };
+
+  useHotkeysOnFocusedElement({
+    ...hotkeysConfig,
+    focusId: SIDE_PANEL_FOCUS_ID,
+  });
+
+  useHotkeysOnFocusedElement({
+    ...hotkeysConfig,
+    focusId: dropdownId,
+  });
 
   const recordSelectionActions = actions.filter(
     (action) => action.scope === ActionScope.RecordSelection,
@@ -56,19 +63,17 @@ export const CommandMenuActionMenuDropdown = () => {
 
   return (
     <Dropdown
-      dropdownId={getRightDrawerActionMenuDropdownIdFromActionMenuId(
-        actionMenuId,
-      )}
-      dropdownHotkeyScope={{
-        scope:
-          CommandMenuActionMenuDropdownHotkeyScope.CommandMenuActionMenuDropdown,
-      }}
+      dropdownId={dropdownId}
       data-select-disable
       clickableComponent={
         <Button title="Options" hotkeys={[getOsControlSymbol(), 'O']} />
       }
       dropdownPlacement="top-end"
       dropdownOffset={{ y: parseInt(theme.spacing(2), 10) }}
+      globalHotkeysConfig={{
+        enableGlobalHotkeysWithModifiers: true,
+        enableGlobalHotkeysConflictingWithKeyboard: false,
+      }}
       onOpen={() => {
         setSelectedItemId(selectableItemIdArray[0]);
       }}
@@ -77,10 +82,9 @@ export const CommandMenuActionMenuDropdown = () => {
           <DropdownMenuItemsContainer>
             <SelectableList
               selectableListInstanceId={actionMenuId}
-              hotkeyScope={
-                CommandMenuActionMenuDropdownHotkeyScope.CommandMenuActionMenuDropdown
-              }
+              focusId={dropdownId}
               selectableItemIdArray={selectableItemIdArray}
+              hotkeyScope={DropdownHotkeyScope.Dropdown}
             >
               {recordSelectionActions.map((action) => (
                 <ActionComponent action={action} key={action.key} />
diff --git a/packages/twenty-front/src/modules/action-menu/components/RecordIndexActionMenuDropdown.tsx b/packages/twenty-front/src/modules/action-menu/components/RecordIndexActionMenuDropdown.tsx
index 669835403..8411e9cbd 100644
--- a/packages/twenty-front/src/modules/action-menu/components/RecordIndexActionMenuDropdown.tsx
+++ b/packages/twenty-front/src/modules/action-menu/components/RecordIndexActionMenuDropdown.tsx
@@ -5,12 +5,12 @@ import { ACTION_MENU_DROPDOWN_CLICK_OUTSIDE_ID } from '@/action-menu/constants/A
 import { ActionMenuContext } from '@/action-menu/contexts/ActionMenuContext';
 import { ActionMenuComponentInstanceContext } from '@/action-menu/states/contexts/ActionMenuComponentInstanceContext';
 import { recordIndexActionMenuDropdownPositionComponentState } from '@/action-menu/states/recordIndexActionMenuDropdownPositionComponentState';
-import { ActionMenuDropdownHotkeyScope } from '@/action-menu/types/ActionMenuDropdownHotKeyScope';
 import { getActionMenuDropdownIdFromActionMenuId } from '@/action-menu/utils/getActionMenuDropdownIdFromActionMenuId';
 import { useCommandMenu } from '@/command-menu/hooks/useCommandMenu';
 import { Dropdown } from '@/ui/layout/dropdown/components/Dropdown';
 import { DropdownContent } from '@/ui/layout/dropdown/components/DropdownContent';
 import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer';
+import { DropdownHotkeyScope } from '@/ui/layout/dropdown/constants/DropdownHotkeyScope';
 import { useDropdownV2 } from '@/ui/layout/dropdown/hooks/useDropdownV2';
 import { SelectableList } from '@/ui/layout/selectable-list/components/SelectableList';
 import { SelectableListItem } from '@/ui/layout/selectable-list/components/SelectableListItem';
@@ -72,9 +72,6 @@ export const RecordIndexActionMenuDropdown = () => {
   return (
     <Dropdown
       dropdownId={dropdownId}
-      dropdownHotkeyScope={{
-        scope: ActionMenuDropdownHotkeyScope.ActionMenuDropdown,
-      }}
       data-select-disable
       dropdownPlacement="bottom-start"
       dropdownStrategy="absolute"
@@ -89,9 +86,10 @@ export const RecordIndexActionMenuDropdown = () => {
           >
             <DropdownMenuItemsContainer>
               <SelectableList
-                hotkeyScope={ActionMenuDropdownHotkeyScope.ActionMenuDropdown}
+                focusId={dropdownId}
                 selectableItemIdArray={selectedItemIdArray}
                 selectableListInstanceId={dropdownId}
+                hotkeyScope={DropdownHotkeyScope.Dropdown}
               >
                 {recordIndexActions.map((action) => (
                   <ActionComponent action={action} key={action.key} />
diff --git a/packages/twenty-front/src/modules/action-menu/components/RecordShowRightDrawerOpenRecordButton.tsx b/packages/twenty-front/src/modules/action-menu/components/RecordShowRightDrawerOpenRecordButton.tsx
index 769a3c38c..6d852e6ca 100644
--- a/packages/twenty-front/src/modules/action-menu/components/RecordShowRightDrawerOpenRecordButton.tsx
+++ b/packages/twenty-front/src/modules/action-menu/components/RecordShowRightDrawerOpenRecordButton.tsx
@@ -1,5 +1,6 @@
 import { ActionMenuComponentInstanceContext } from '@/action-menu/states/contexts/ActionMenuComponentInstanceContext';
 import { getRightDrawerActionMenuDropdownIdFromActionMenuId } from '@/action-menu/utils/getRightDrawerActionMenuDropdownIdFromActionMenuId';
+import { SIDE_PANEL_FOCUS_ID } from '@/command-menu/constants/SidePanelFocusId';
 import { useCommandMenu } from '@/command-menu/hooks/useCommandMenu';
 import { CommandMenuPageComponentInstanceContext } from '@/command-menu/states/contexts/CommandMenuPageComponentInstanceContext';
 import { MAIN_CONTEXT_STORE_INSTANCE_ID } from '@/context-store/constants/MainContextStoreInstanceId';
@@ -11,7 +12,7 @@ import { AppPath } from '@/types/AppPath';
 import { useDropdownV2 } from '@/ui/layout/dropdown/hooks/useDropdownV2';
 import { getShowPageTabListComponentId } from '@/ui/layout/show-page/utils/getShowPageTabListComponentId';
 import { activeTabIdComponentState } from '@/ui/layout/tab-list/states/activeTabIdComponentState';
-import { useScopedHotkeys } from '@/ui/utilities/hotkey/hooks/useScopedHotkeys';
+import { useHotkeysOnFocusedElement } from '@/ui/utilities/hotkey/hooks/useHotkeysOnFocusedElement';
 import { AppHotkeyScope } from '@/ui/utilities/hotkey/types/AppHotkeyScope';
 import { useAvailableComponentInstanceIdOrThrow } from '@/ui/utilities/state/component-state/hooks/useAvailableComponentInstanceIdOrThrow';
 import { useComponentInstanceStateContext } from '@/ui/utilities/state/component-state/hooks/useComponentInstanceStateContext';
@@ -118,12 +119,13 @@ export const RecordShowRightDrawerOpenRecordButton = ({
     ],
   );
 
-  useScopedHotkeys(
-    ['ctrl+Enter,meta+Enter'],
-    handleOpenRecord,
-    AppHotkeyScope.CommandMenuOpen,
-    [handleOpenRecord],
-  );
+  useHotkeysOnFocusedElement({
+    keys: ['ctrl+Enter,meta+Enter'],
+    callback: handleOpenRecord,
+    focusId: SIDE_PANEL_FOCUS_ID,
+    scope: AppHotkeyScope.CommandMenuOpen,
+    dependencies: [handleOpenRecord],
+  });
 
   if (!isDefined(record)) {
     return null;
diff --git a/packages/twenty-front/src/modules/action-menu/types/ActionMenuDropdownHotKeyScope.ts b/packages/twenty-front/src/modules/action-menu/types/ActionMenuDropdownHotKeyScope.ts
deleted file mode 100644
index 9c0e2df42..000000000
--- a/packages/twenty-front/src/modules/action-menu/types/ActionMenuDropdownHotKeyScope.ts
+++ /dev/null
@@ -1,3 +0,0 @@
-export enum ActionMenuDropdownHotkeyScope {
-  ActionMenuDropdown = 'action-menu-dropdown',
-}
diff --git a/packages/twenty-front/src/modules/action-menu/types/CommandMenuActionMenuDropdownHotkeyScope.ts b/packages/twenty-front/src/modules/action-menu/types/CommandMenuActionMenuDropdownHotkeyScope.ts
deleted file mode 100644
index e4abf9ce6..000000000
--- a/packages/twenty-front/src/modules/action-menu/types/CommandMenuActionMenuDropdownHotkeyScope.ts
+++ /dev/null
@@ -1,3 +0,0 @@
-export enum CommandMenuActionMenuDropdownHotkeyScope {
-  CommandMenuActionMenuDropdown = 'command-menu-action-menu-dropdown',
-}
diff --git a/packages/twenty-front/src/modules/activities/files/components/AttachmentDropdown.tsx b/packages/twenty-front/src/modules/activities/files/components/AttachmentDropdown.tsx
index 0d29c1879..0d7955aa1 100644
--- a/packages/twenty-front/src/modules/activities/files/components/AttachmentDropdown.tsx
+++ b/packages/twenty-front/src/modules/activities/files/components/AttachmentDropdown.tsx
@@ -72,7 +72,6 @@ export const AttachmentDropdown = ({
           </DropdownMenuItemsContainer>
         </DropdownContent>
       }
-      dropdownHotkeyScope={{ scope: dropdownId }}
     />
   );
 };
diff --git a/packages/twenty-front/src/modules/activities/inline-cell/components/ActivityTargetsInlineCell.tsx b/packages/twenty-front/src/modules/activities/inline-cell/components/ActivityTargetsInlineCell.tsx
index 85c50725f..85594b86f 100644
--- a/packages/twenty-front/src/modules/activities/inline-cell/components/ActivityTargetsInlineCell.tsx
+++ b/packages/twenty-front/src/modules/activities/inline-cell/components/ActivityTargetsInlineCell.tsx
@@ -70,6 +70,7 @@ export const ActivityTargetsInlineCell = ({
               labelWidth: fieldDefinition?.labelWidth,
               editModeContent: (
                 <MultipleRecordPicker
+                  focusId={componentInstanceId}
                   componentInstanceId={componentInstanceId}
                   onClickOutside={() => {
                     closeInlineCell();
diff --git a/packages/twenty-front/src/modules/activities/inline-cell/hooks/useOpenActivityTargetCellEditMode.ts b/packages/twenty-front/src/modules/activities/inline-cell/hooks/useOpenActivityTargetCellEditMode.ts
index 201e94e6a..fd8cb2893 100644
--- a/packages/twenty-front/src/modules/activities/inline-cell/hooks/useOpenActivityTargetCellEditMode.ts
+++ b/packages/twenty-front/src/modules/activities/inline-cell/hooks/useOpenActivityTargetCellEditMode.ts
@@ -5,8 +5,9 @@ import { useMultipleRecordPickerPerformSearch } from '@/object-record/record-pic
 import { multipleRecordPickerPickableMorphItemsComponentState } from '@/object-record/record-picker/multiple-record-picker/states/multipleRecordPickerPickableMorphItemsComponentState';
 import { multipleRecordPickerSearchFilterComponentState } from '@/object-record/record-picker/multiple-record-picker/states/multipleRecordPickerSearchFilterComponentState';
 import { multipleRecordPickerSearchableObjectMetadataItemsComponentState } from '@/object-record/record-picker/multiple-record-picker/states/multipleRecordPickerSearchableObjectMetadataItemsComponentState';
-import { MultipleRecordPickerHotkeyScope } from '@/object-record/record-picker/multiple-record-picker/types/MultipleRecordPickerHotkeyScope';
-import { usePreviousHotkeyScope } from '@/ui/utilities/hotkey/hooks/usePreviousHotkeyScope';
+import { DropdownHotkeyScope } from '@/ui/layout/dropdown/constants/DropdownHotkeyScope';
+import { usePushFocusItemToFocusStack } from '@/ui/utilities/focus/hooks/usePushFocusItemToFocusStack';
+import { FocusComponentType } from '@/ui/utilities/focus/types/FocusComponentType';
 import { useRecoilCallback } from 'recoil';
 
 type OpenActivityTargetCellEditModeProps = {
@@ -19,7 +20,7 @@ export const useOpenActivityTargetCellEditMode = () => {
   const { performSearch: multipleRecordPickerPerformSearch } =
     useMultipleRecordPickerPerformSearch();
 
-  const { setHotkeyScopeAndMemorizePreviousScope } = usePreviousHotkeyScope();
+  const { pushFocusItemToFocusStack } = usePushFocusItemToFocusStack();
 
   const openActivityTargetCellEditMode = useRecoilCallback(
     ({ set, snapshot }) =>
@@ -84,11 +85,19 @@ export const useOpenActivityTargetCellEditMode = () => {
           ),
         });
 
-        setHotkeyScopeAndMemorizePreviousScope({
-          scope: MultipleRecordPickerHotkeyScope.MultipleRecordPicker,
+        pushFocusItemToFocusStack({
+          focusId: recordPickerInstanceId,
+          component: {
+            type: FocusComponentType.DROPDOWN,
+            instanceId: recordPickerInstanceId,
+          },
+          hotkeyScope: {
+            scope: DropdownHotkeyScope.Dropdown,
+          },
+          memoizeKey: recordPickerInstanceId,
         });
       },
-    [multipleRecordPickerPerformSearch, setHotkeyScopeAndMemorizePreviousScope],
+    [multipleRecordPickerPerformSearch, pushFocusItemToFocusStack],
   );
 
   return { openActivityTargetCellEditMode };
diff --git a/packages/twenty-front/src/modules/command-menu/components/CommandMenuContextChipGroups.tsx b/packages/twenty-front/src/modules/command-menu/components/CommandMenuContextChipGroups.tsx
index de32e94c4..2390a9557 100644
--- a/packages/twenty-front/src/modules/command-menu/components/CommandMenuContextChipGroups.tsx
+++ b/packages/twenty-front/src/modules/command-menu/components/CommandMenuContextChipGroups.tsx
@@ -3,7 +3,6 @@ import { Dropdown } from '@/ui/layout/dropdown/components/Dropdown';
 import { DropdownContent } from '@/ui/layout/dropdown/components/DropdownContent';
 import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer';
 import { useDropdownV2 } from '@/ui/layout/dropdown/hooks/useDropdownV2';
-import { AppHotkeyScope } from '@/ui/utilities/hotkey/types/AppHotkeyScope';
 import { isDefined } from 'twenty-shared/utils';
 import { MenuItem } from 'twenty-ui/navigation';
 import {
@@ -72,9 +71,6 @@ export const CommandMenuContextChipGroups = ({
               </DropdownMenuItemsContainer>
             </DropdownContent>
           }
-          dropdownHotkeyScope={{
-            scope: AppHotkeyScope.CommandMenu,
-          }}
           dropdownId={COMMAND_MENU_CONTEXT_CHIP_GROUPS_DROPDOWN_ID}
           dropdownPlacement="bottom-start"
         ></Dropdown>
diff --git a/packages/twenty-front/src/modules/command-menu/components/CommandMenuList.tsx b/packages/twenty-front/src/modules/command-menu/components/CommandMenuList.tsx
index 84cdefc83..b38e6934e 100644
--- a/packages/twenty-front/src/modules/command-menu/components/CommandMenuList.tsx
+++ b/packages/twenty-front/src/modules/command-menu/components/CommandMenuList.tsx
@@ -4,6 +4,7 @@ import { ActionGroupConfig } from '@/command-menu/components/CommandMenu';
 import { CommandMenuDefaultSelectionEffect } from '@/command-menu/components/CommandMenuDefaultSelectionEffect';
 import { COMMAND_MENU_SEARCH_BAR_HEIGHT } from '@/command-menu/constants/CommandMenuSearchBarHeight';
 import { COMMAND_MENU_SEARCH_BAR_PADDING } from '@/command-menu/constants/CommandMenuSearchBarPadding';
+import { SIDE_PANEL_FOCUS_ID } from '@/command-menu/constants/SidePanelFocusId';
 import { hasUserSelectedCommandState } from '@/command-menu/states/hasUserSelectedCommandState';
 import { SelectableList } from '@/ui/layout/selectable-list/components/SelectableList';
 import { AppHotkeyScope } from '@/ui/utilities/hotkey/types/AppHotkeyScope';
@@ -75,8 +76,9 @@ export const CommandMenuList = ({
         <StyledInnerList>
           <SelectableList
             selectableListInstanceId="command-menu-list"
-            hotkeyScope={AppHotkeyScope.CommandMenuOpen}
+            focusId={SIDE_PANEL_FOCUS_ID}
             selectableItemIdArray={selectableItemIds}
+            hotkeyScope={AppHotkeyScope.CommandMenuOpen}
             onSelect={() => {
               setHasUserSelectedCommand(true);
             }}
diff --git a/packages/twenty-front/src/modules/command-menu/constants/SidePanelFocusId.ts b/packages/twenty-front/src/modules/command-menu/constants/SidePanelFocusId.ts
new file mode 100644
index 000000000..111b98055
--- /dev/null
+++ b/packages/twenty-front/src/modules/command-menu/constants/SidePanelFocusId.ts
@@ -0,0 +1 @@
+export const SIDE_PANEL_FOCUS_ID = 'command-menu';
diff --git a/packages/twenty-front/src/modules/command-menu/hooks/useCommandMenu.ts b/packages/twenty-front/src/modules/command-menu/hooks/useCommandMenu.ts
index 288bc6b6b..1091e12a5 100644
--- a/packages/twenty-front/src/modules/command-menu/hooks/useCommandMenu.ts
+++ b/packages/twenty-front/src/modules/command-menu/hooks/useCommandMenu.ts
@@ -3,12 +3,13 @@ import { useRecoilCallback } from 'recoil';
 import { commandMenuSearchState } from '@/command-menu/states/commandMenuSearchState';
 
 import { COMMAND_MENU_COMPONENT_INSTANCE_ID } from '@/command-menu/constants/CommandMenuComponentInstanceId';
+import { SIDE_PANEL_FOCUS_ID } from '@/command-menu/constants/SidePanelFocusId';
 import { useNavigateCommandMenu } from '@/command-menu/hooks/useNavigateCommandMenu';
 import { isCommandMenuClosingState } from '@/command-menu/states/isCommandMenuClosingState';
 import { CommandMenuPages } from '@/command-menu/types/CommandMenuPages';
 import { useCloseAnyOpenDropdown } from '@/ui/layout/dropdown/hooks/useCloseAnyOpenDropdown';
 import { isDragSelectionStartEnabledState } from '@/ui/utilities/drag-select/states/internal/isDragSelectionStartEnabledState';
-import { usePreviousHotkeyScope } from '@/ui/utilities/hotkey/hooks/usePreviousHotkeyScope';
+import { useRemoveFocusItemFromFocusStack } from '@/ui/utilities/focus/hooks/useRemoveFocusItemFromFocusStack';
 import { useCallback } from 'react';
 import { IconDotsVertical } from 'twenty-ui/display';
 import { isCommandMenuOpenedState } from '../states/isCommandMenuOpenedState';
@@ -16,7 +17,8 @@ import { isCommandMenuOpenedState } from '../states/isCommandMenuOpenedState';
 export const useCommandMenu = () => {
   const { navigateCommandMenu } = useNavigateCommandMenu();
   const { closeAnyOpenDropdown } = useCloseAnyOpenDropdown();
-  const { goBackToPreviousHotkeyScope } = usePreviousHotkeyScope();
+
+  const { removeFocusItemFromFocusStack } = useRemoveFocusItemFromFocusStack();
 
   const closeCommandMenu = useRecoilCallback(
     ({ set, snapshot }) =>
@@ -30,10 +32,13 @@ export const useCommandMenu = () => {
           set(isCommandMenuClosingState, true);
           set(isDragSelectionStartEnabledState, true);
           closeAnyOpenDropdown();
-          goBackToPreviousHotkeyScope(COMMAND_MENU_COMPONENT_INSTANCE_ID);
+          removeFocusItemFromFocusStack({
+            focusId: SIDE_PANEL_FOCUS_ID,
+            memoizeKey: COMMAND_MENU_COMPONENT_INSTANCE_ID,
+          });
         }
       },
-    [closeAnyOpenDropdown, goBackToPreviousHotkeyScope],
+    [closeAnyOpenDropdown, removeFocusItemFromFocusStack],
   );
 
   const openCommandMenu = useCallback(() => {
diff --git a/packages/twenty-front/src/modules/command-menu/hooks/useNavigateCommandMenu.ts b/packages/twenty-front/src/modules/command-menu/hooks/useNavigateCommandMenu.ts
index 5d76ae1f2..fea324c5c 100644
--- a/packages/twenty-front/src/modules/command-menu/hooks/useNavigateCommandMenu.ts
+++ b/packages/twenty-front/src/modules/command-menu/hooks/useNavigateCommandMenu.ts
@@ -1,4 +1,5 @@
 import { COMMAND_MENU_COMPONENT_INSTANCE_ID } from '@/command-menu/constants/CommandMenuComponentInstanceId';
+import { SIDE_PANEL_FOCUS_ID } from '@/command-menu/constants/SidePanelFocusId';
 import { useCommandMenuCloseAnimationCompleteCleanup } from '@/command-menu/hooks/useCommandMenuCloseAnimationCompleteCleanup';
 import { useCopyContextStoreStates } from '@/command-menu/hooks/useCopyContextStoreAndActionMenuStates';
 import { commandMenuNavigationMorphItemByPageState } from '@/command-menu/states/commandMenuNavigationMorphItemsState';
@@ -13,7 +14,8 @@ import { CommandMenuHotkeyScope } from '@/command-menu/types/CommandMenuHotkeySc
 import { CommandMenuPages } from '@/command-menu/types/CommandMenuPages';
 import { MAIN_CONTEXT_STORE_INSTANCE_ID } from '@/context-store/constants/MainContextStoreInstanceId';
 import { isDragSelectionStartEnabledState } from '@/ui/utilities/drag-select/states/internal/isDragSelectionStartEnabledState';
-import { usePreviousHotkeyScope } from '@/ui/utilities/hotkey/hooks/usePreviousHotkeyScope';
+import { usePushFocusItemToFocusStack } from '@/ui/utilities/focus/hooks/usePushFocusItemToFocusStack';
+import { FocusComponentType } from '@/ui/utilities/focus/types/FocusComponentType';
 import { useRecoilCallback } from 'recoil';
 import { IconComponent } from 'twenty-ui/display';
 import { v4 } from 'uuid';
@@ -27,13 +29,13 @@ export type CommandMenuNavigationStackItem = {
 };
 
 export const useNavigateCommandMenu = () => {
-  const { setHotkeyScopeAndMemorizePreviousScope } = usePreviousHotkeyScope();
-
   const { copyContextStoreStates } = useCopyContextStoreStates();
 
   const { commandMenuCloseAnimationCompleteCleanup } =
     useCommandMenuCloseAnimationCompleteCleanup();
 
+  const { pushFocusItemToFocusStack } = usePushFocusItemToFocusStack();
+
   const openCommandMenu = useRecoilCallback(
     ({ snapshot, set }) =>
       () => {
@@ -53,10 +55,17 @@ export const useNavigateCommandMenu = () => {
           return;
         }
 
-        setHotkeyScopeAndMemorizePreviousScope({
-          scope: CommandMenuHotkeyScope.CommandMenuFocused,
-          customScopes: {
-            commandMenuOpen: true,
+        pushFocusItemToFocusStack({
+          focusId: SIDE_PANEL_FOCUS_ID,
+          component: {
+            type: FocusComponentType.SIDE_PANEL,
+            instanceId: COMMAND_MENU_COMPONENT_INSTANCE_ID,
+          },
+          hotkeyScope: {
+            scope: CommandMenuHotkeyScope.CommandMenuFocused,
+            customScopes: {
+              commandMenuOpen: true,
+            },
           },
           memoizeKey: COMMAND_MENU_COMPONENT_INSTANCE_ID,
         });
@@ -73,7 +82,7 @@ export const useNavigateCommandMenu = () => {
     [
       copyContextStoreStates,
       commandMenuCloseAnimationCompleteCleanup,
-      setHotkeyScopeAndMemorizePreviousScope,
+      pushFocusItemToFocusStack,
     ],
   );
 
diff --git a/packages/twenty-front/src/modules/favorites/components/FavoriteFolderNavigationDrawerItemDropdown.tsx b/packages/twenty-front/src/modules/favorites/components/FavoriteFolderNavigationDrawerItemDropdown.tsx
index 9ed862212..b99f5e638 100644
--- a/packages/twenty-front/src/modules/favorites/components/FavoriteFolderNavigationDrawerItemDropdown.tsx
+++ b/packages/twenty-front/src/modules/favorites/components/FavoriteFolderNavigationDrawerItemDropdown.tsx
@@ -1,4 +1,3 @@
-import { FavoriteFolderHotkeyScope } from '@/favorites/constants/FavoriteFolderRightIconDropdownHotkeyScope';
 import { Dropdown } from '@/ui/layout/dropdown/components/Dropdown';
 import { DropdownContent } from '@/ui/layout/dropdown/components/DropdownContent';
 import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer';
@@ -33,9 +32,6 @@ export const FavoriteFolderNavigationDrawerItemDropdown = ({
   return (
     <Dropdown
       dropdownId={`favorite-folder-edit-${folderId}`}
-      dropdownHotkeyScope={{
-        scope: FavoriteFolderHotkeyScope.FavoriteFolderRightIconDropdown,
-      }}
       data-select-disable
       clickableComponent={
         <LightIconButton Icon={IconDotsVertical} accent="tertiary" />
diff --git a/packages/twenty-front/src/modules/favorites/favorite-folder-picker/components/FavoriteFolderPicker.tsx b/packages/twenty-front/src/modules/favorites/favorite-folder-picker/components/FavoriteFolderPicker.tsx
index b633275d9..0f5c5bf14 100644
--- a/packages/twenty-front/src/modules/favorites/favorite-folder-picker/components/FavoriteFolderPicker.tsx
+++ b/packages/twenty-front/src/modules/favorites/favorite-folder-picker/components/FavoriteFolderPicker.tsx
@@ -9,7 +9,8 @@ import { ObjectRecord } from '@/object-record/types/ObjectRecord';
 import { DropdownContent } from '@/ui/layout/dropdown/components/DropdownContent';
 import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer';
 import { DropdownMenuSeparator } from '@/ui/layout/dropdown/components/DropdownMenuSeparator';
-import { useScopedHotkeys } from '@/ui/utilities/hotkey/hooks/useScopedHotkeys';
+import { DropdownHotkeyScope } from '@/ui/layout/dropdown/constants/DropdownHotkeyScope';
+import { useHotkeysOnFocusedElement } from '@/ui/utilities/hotkey/hooks/useHotkeysOnFocusedElement';
 import { useAvailableComponentInstanceIdOrThrow } from '@/ui/utilities/state/component-state/hooks/useAvailableComponentInstanceIdOrThrow';
 import { useRecoilComponentStateV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentStateV2';
 
@@ -57,22 +58,23 @@ export const FavoriteFolderPicker = ({
     !favoriteFoldersSearchFilter ||
     'no folder'.includes(favoriteFoldersSearchFilter.toLowerCase());
 
-  useScopedHotkeys(
-    Key.Escape,
-    () => {
+  useHotkeysOnFocusedElement({
+    keys: [Key.Escape],
+    callback: () => {
       if (isFavoriteFolderCreating) {
         setIsFavoriteFolderCreating(false);
         return;
       }
       onSubmit?.();
     },
-    instanceId,
-    [onSubmit, isFavoriteFolderCreating],
-  );
+    focusId: dropdownId,
+    scope: DropdownHotkeyScope.Dropdown,
+    dependencies: [onSubmit, isFavoriteFolderCreating],
+  });
 
-  useScopedHotkeys(
-    Key.Enter,
-    () => {
+  useHotkeysOnFocusedElement({
+    keys: [Key.Enter],
+    callback: () => {
       if (filteredFolders.length === 1 && !showNoFolderOption) {
         toggleFolderSelection(filteredFolders[0].id);
         onSubmit?.();
@@ -85,9 +87,15 @@ export const FavoriteFolderPicker = ({
         return;
       }
     },
-    instanceId,
-    [filteredFolders, showNoFolderOption, toggleFolderSelection, onSubmit],
-  );
+    focusId: instanceId,
+    scope: DropdownHotkeyScope.Dropdown,
+    dependencies: [
+      filteredFolders,
+      showNoFolderOption,
+      toggleFolderSelection,
+      onSubmit,
+    ],
+  });
 
   return (
     <DropdownContent>
diff --git a/packages/twenty-front/src/modules/object-record/advanced-filter/components/AdvancedFilterAddFilterRuleSelect.tsx b/packages/twenty-front/src/modules/object-record/advanced-filter/components/AdvancedFilterAddFilterRuleSelect.tsx
index 018d8cf3b..4328fa1b7 100644
--- a/packages/twenty-front/src/modules/object-record/advanced-filter/components/AdvancedFilterAddFilterRuleSelect.tsx
+++ b/packages/twenty-front/src/modules/object-record/advanced-filter/components/AdvancedFilterAddFilterRuleSelect.tsx
@@ -180,7 +180,6 @@ export const AdvancedFilterAddFilterRuleSelect = ({
           </DropdownMenuItemsContainer>
         </DropdownContent>
       }
-      dropdownHotkeyScope={{ scope: dropdownId }}
       dropdownOffset={{ y: 8, x: 0 }}
       dropdownPlacement="bottom-start"
     />
diff --git a/packages/twenty-front/src/modules/object-record/advanced-filter/components/AdvancedFilterDropdownFilterInput.tsx b/packages/twenty-front/src/modules/object-record/advanced-filter/components/AdvancedFilterDropdownFilterInput.tsx
index 14fb5c1a3..661a21991 100644
--- a/packages/twenty-front/src/modules/object-record/advanced-filter/components/AdvancedFilterDropdownFilterInput.tsx
+++ b/packages/twenty-front/src/modules/object-record/advanced-filter/components/AdvancedFilterDropdownFilterInput.tsx
@@ -22,7 +22,7 @@ import { useRecoilComponentValueV2 } from '@/ui/utilities/state/component-state/
 import { FieldMetadataType } from 'twenty-shared/types';
 
 type AdvancedFilterDropdownFilterInputProps = {
-  filterDropdownId?: string;
+  filterDropdownId: string;
   recordFilter: RecordFilter;
 };
 
@@ -57,12 +57,15 @@ export const AdvancedFilterDropdownFilterInput = ({
         <DropdownContent widthInPixels={GenericDropdownContentWidth.ExtraLarge}>
           <ObjectFilterDropdownSearchInput />
           <DropdownMenuSeparator />
-          <ObjectFilterDropdownRecordSelect recordFilterId={recordFilter.id} />
+          <ObjectFilterDropdownRecordSelect
+            recordFilterId={recordFilter.id}
+            dropdownId={filterDropdownId}
+          />
         </DropdownContent>
       )}
       {filterType === 'ACTOR' &&
         (isActorSourceCompositeFilter ? (
-          <ObjectFilterDropdownSourceSelect />
+          <ObjectFilterDropdownSourceSelect dropdownId={filterDropdownId} />
         ) : (
           <ObjectFilterDropdownTextInput />
         ))}
@@ -70,7 +73,7 @@ export const AdvancedFilterDropdownFilterInput = ({
         <DropdownContent widthInPixels={GenericDropdownContentWidth.ExtraLarge}>
           <ObjectFilterDropdownSearchInput />
           <DropdownMenuSeparator />
-          <ObjectFilterDropdownOptionSelect />
+          <ObjectFilterDropdownOptionSelect focusId={filterDropdownId} />
         </DropdownContent>
       )}
       {filterType === 'BOOLEAN' && <ObjectFilterDropdownBooleanSelect />}
diff --git a/packages/twenty-front/src/modules/object-record/advanced-filter/components/AdvancedFilterFieldSelectDropdownButton.tsx b/packages/twenty-front/src/modules/object-record/advanced-filter/components/AdvancedFilterFieldSelectDropdownButton.tsx
index c8d994105..32ec5ee29 100644
--- a/packages/twenty-front/src/modules/object-record/advanced-filter/components/AdvancedFilterFieldSelectDropdownButton.tsx
+++ b/packages/twenty-front/src/modules/object-record/advanced-filter/components/AdvancedFilterFieldSelectDropdownButton.tsx
@@ -34,7 +34,6 @@ export const AdvancedFilterFieldSelectDropdownButton = ({
             recordFilterId={recordFilterId}
           />
         }
-        dropdownHotkeyScope={{ scope: advancedFilterFieldSelectDropdownId }}
         dropdownOffset={DEFAULT_ADVANCED_FILTER_DROPDOWN_OFFSET}
         dropdownPlacement="bottom-start"
       />
diff --git a/packages/twenty-front/src/modules/object-record/advanced-filter/components/AdvancedFilterFieldSelectMenu.tsx b/packages/twenty-front/src/modules/object-record/advanced-filter/components/AdvancedFilterFieldSelectMenu.tsx
index b838da302..a61953b78 100644
--- a/packages/twenty-front/src/modules/object-record/advanced-filter/components/AdvancedFilterFieldSelectMenu.tsx
+++ b/packages/twenty-front/src/modules/object-record/advanced-filter/components/AdvancedFilterFieldSelectMenu.tsx
@@ -23,6 +23,7 @@ import { isCompositeFieldType } from '@/object-record/object-filter-dropdown/uti
 import { useFilterableFieldMetadataItemsInRecordIndexContext } from '@/object-record/record-filter/hooks/useFilterableFieldMetadataItemsInRecordIndexContext';
 import { DropdownContent } from '@/ui/layout/dropdown/components/DropdownContent';
 import { DropdownMenuSectionLabel } from '@/ui/layout/dropdown/components/DropdownMenuSectionLabel';
+import { DropdownHotkeyScope } from '@/ui/layout/dropdown/constants/DropdownHotkeyScope';
 import { GenericDropdownContentWidth } from '@/ui/layout/dropdown/constants/GenericDropdownContentWidth';
 import { useRecoilComponentStateV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentStateV2';
 import { useSetRecoilComponentStateV2 } from '@/ui/utilities/state/component-state/hooks/useSetRecoilComponentStateV2';
@@ -144,9 +145,10 @@ export const AdvancedFilterFieldSelectMenu = ({
     <DropdownContent widthInPixels={GenericDropdownContentWidth.ExtraLarge}>
       <AdvancedFilterFieldSelectSearchInput />
       <SelectableList
-        hotkeyScope={advancedFilterFieldSelectDropdownId}
+        focusId={advancedFilterFieldSelectDropdownId}
         selectableItemIdArray={selectableItemIdArray}
         selectableListInstanceId={advancedFilterFieldSelectDropdownId}
+        hotkeyScope={DropdownHotkeyScope.Dropdown}
       >
         {shouldShowVisibleFields && (
           <>
diff --git a/packages/twenty-front/src/modules/object-record/advanced-filter/components/AdvancedFilterRecordFilterGroupOptionsDropdown.tsx b/packages/twenty-front/src/modules/object-record/advanced-filter/components/AdvancedFilterRecordFilterGroupOptionsDropdown.tsx
index a7bfe78d7..44be3834c 100644
--- a/packages/twenty-front/src/modules/object-record/advanced-filter/components/AdvancedFilterRecordFilterGroupOptionsDropdown.tsx
+++ b/packages/twenty-front/src/modules/object-record/advanced-filter/components/AdvancedFilterRecordFilterGroupOptionsDropdown.tsx
@@ -65,7 +65,6 @@ export const AdvancedFilterRecordFilterGroupOptionsDropdown = ({
           </DropdownMenuItemsContainer>
         </DropdownContent>
       }
-      dropdownHotkeyScope={{ scope: dropdownId }}
       dropdownOffset={{ y: 2, x: 0 }}
       dropdownPlacement="bottom-start"
     />
diff --git a/packages/twenty-front/src/modules/object-record/advanced-filter/components/AdvancedFilterRecordFilterOperandSelectContent.tsx b/packages/twenty-front/src/modules/object-record/advanced-filter/components/AdvancedFilterRecordFilterOperandSelectContent.tsx
index 45c825ccc..2393cecdd 100644
--- a/packages/twenty-front/src/modules/object-record/advanced-filter/components/AdvancedFilterRecordFilterOperandSelectContent.tsx
+++ b/packages/twenty-front/src/modules/object-record/advanced-filter/components/AdvancedFilterRecordFilterOperandSelectContent.tsx
@@ -8,6 +8,7 @@ import { SelectControl } from '@/ui/input/components/SelectControl';
 import { Dropdown } from '@/ui/layout/dropdown/components/Dropdown';
 import { DropdownContent } from '@/ui/layout/dropdown/components/DropdownContent';
 import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer';
+import { DropdownHotkeyScope } from '@/ui/layout/dropdown/constants/DropdownHotkeyScope';
 import { GenericDropdownContentWidth } from '@/ui/layout/dropdown/constants/GenericDropdownContentWidth';
 import { useDropdown } from '@/ui/layout/dropdown/hooks/useDropdown';
 import { SelectableList } from '@/ui/layout/selectable-list/components/SelectableList';
@@ -63,11 +64,12 @@ export const AdvancedFilterRecordFilterOperandSelectContent = ({
         <DropdownContent widthInPixels={GenericDropdownContentWidth.Narrow}>
           <DropdownMenuItemsContainer>
             <SelectableList
-              hotkeyScope={dropdownId}
+              focusId={dropdownId}
               selectableItemIdArray={operandsForFilterType.map(
                 (operand) => operand,
               )}
               selectableListInstanceId={dropdownId}
+              hotkeyScope={DropdownHotkeyScope.Dropdown}
             >
               {operandsForFilterType.map((filterOperand, index) => (
                 <SelectableListItem
@@ -90,7 +92,6 @@ export const AdvancedFilterRecordFilterOperandSelectContent = ({
           </DropdownMenuItemsContainer>
         </DropdownContent>
       }
-      dropdownHotkeyScope={{ scope: dropdownId }}
       dropdownOffset={DEFAULT_ADVANCED_FILTER_DROPDOWN_OFFSET}
       dropdownPlacement="bottom-start"
     />
diff --git a/packages/twenty-front/src/modules/object-record/advanced-filter/components/AdvancedFilterRecordFilterOptionsDropdown.tsx b/packages/twenty-front/src/modules/object-record/advanced-filter/components/AdvancedFilterRecordFilterOptionsDropdown.tsx
index c2531ac20..cc730fc19 100644
--- a/packages/twenty-front/src/modules/object-record/advanced-filter/components/AdvancedFilterRecordFilterOptionsDropdown.tsx
+++ b/packages/twenty-front/src/modules/object-record/advanced-filter/components/AdvancedFilterRecordFilterOptionsDropdown.tsx
@@ -85,7 +85,6 @@ export const AdvancedFilterRecordFilterOptionsDropdown = ({
           </DropdownMenuItemsContainer>
         </DropdownContent>
       }
-      dropdownHotkeyScope={{ scope: dropdownId }}
       dropdownOffset={DEFAULT_ADVANCED_FILTER_DROPDOWN_OFFSET}
       dropdownPlacement="bottom-start"
     />
diff --git a/packages/twenty-front/src/modules/object-record/advanced-filter/components/AdvancedFilterSubFieldSelectMenu.tsx b/packages/twenty-front/src/modules/object-record/advanced-filter/components/AdvancedFilterSubFieldSelectMenu.tsx
index 613da95f5..6f65a0c42 100644
--- a/packages/twenty-front/src/modules/object-record/advanced-filter/components/AdvancedFilterSubFieldSelectMenu.tsx
+++ b/packages/twenty-front/src/modules/object-record/advanced-filter/components/AdvancedFilterSubFieldSelectMenu.tsx
@@ -18,6 +18,7 @@ import { CompositeFieldSubFieldName } from '@/settings/data-model/types/Composit
 import { DropdownContent } from '@/ui/layout/dropdown/components/DropdownContent';
 import { DropdownMenuHeader } from '@/ui/layout/dropdown/components/DropdownMenuHeader/DropdownMenuHeader';
 import { DropdownMenuHeaderLeftComponent } from '@/ui/layout/dropdown/components/DropdownMenuHeader/internal/DropdownMenuHeaderLeftComponent';
+import { DropdownHotkeyScope } from '@/ui/layout/dropdown/constants/DropdownHotkeyScope';
 import { GenericDropdownContentWidth } from '@/ui/layout/dropdown/constants/GenericDropdownContentWidth';
 import { SelectableList } from '@/ui/layout/selectable-list/components/SelectableList';
 import { SelectableListItem } from '@/ui/layout/selectable-list/components/SelectableListItem';
@@ -124,9 +125,10 @@ export const AdvancedFilterSubFieldSelectMenu = ({
       </DropdownMenuHeader>
       <DropdownMenuItemsContainer>
         <SelectableList
-          hotkeyScope={advancedFilterFieldSelectDropdownId}
+          focusId={advancedFilterFieldSelectDropdownId}
           selectableItemIdArray={selectableItemIdArray}
           selectableListInstanceId={advancedFilterFieldSelectDropdownId}
+          hotkeyScope={DropdownHotkeyScope.Dropdown}
         >
           {compositeFieldTypeIsFilterableByAnySubField && (
             <SelectableListItem
diff --git a/packages/twenty-front/src/modules/object-record/advanced-filter/components/AdvancedFilterValueInput.tsx b/packages/twenty-front/src/modules/object-record/advanced-filter/components/AdvancedFilterValueInput.tsx
index ab98f7dbd..01ba1af24 100644
--- a/packages/twenty-front/src/modules/object-record/advanced-filter/components/AdvancedFilterValueInput.tsx
+++ b/packages/twenty-front/src/modules/object-record/advanced-filter/components/AdvancedFilterValueInput.tsx
@@ -104,9 +104,11 @@ export const AdvancedFilterValueInput = ({
             />
           }
           dropdownComponents={
-            <AdvancedFilterDropdownFilterInput recordFilter={recordFilter} />
+            <AdvancedFilterDropdownFilterInput
+              recordFilter={recordFilter}
+              filterDropdownId={dropdownId}
+            />
           }
-          dropdownHotkeyScope={{ scope: dropdownId }}
           dropdownOffset={dropdownContentOffset}
           dropdownPlacement="bottom-start"
           onClose={handleFilterValueDropdownClose}
diff --git a/packages/twenty-front/src/modules/object-record/advanced-filter/hooks/useSelectFieldUsedInAdvancedFilterDropdown.ts b/packages/twenty-front/src/modules/object-record/advanced-filter/hooks/useSelectFieldUsedInAdvancedFilterDropdown.ts
index 1ed0f6ea9..a96c48490 100644
--- a/packages/twenty-front/src/modules/object-record/advanced-filter/hooks/useSelectFieldUsedInAdvancedFilterDropdown.ts
+++ b/packages/twenty-front/src/modules/object-record/advanced-filter/hooks/useSelectFieldUsedInAdvancedFilterDropdown.ts
@@ -13,10 +13,10 @@ import { RecordFilter } from '@/object-record/record-filter/types/RecordFilter';
 import { getDefaultSubFieldNameForCompositeFilterableFieldType } from '@/object-record/record-filter/utils/getDefaultSubFieldNameForCompositeFilterableFieldType';
 import { getRecordFilterOperands } from '@/object-record/record-filter/utils/getRecordFilterOperands';
 import { isCompositeTypeNonFilterableByAnySubField } from '@/object-record/record-filter/utils/isCompositeTypeNonFilterableByAnySubField';
-import { SingleRecordPickerHotkeyScope } from '@/object-record/record-picker/single-record-picker/types/SingleRecordPickerHotkeyScope';
 import { CompositeFieldSubFieldName } from '@/settings/data-model/types/CompositeFieldSubFieldName';
-
-import { useSetHotkeyScope } from '@/ui/utilities/hotkey/hooks/useSetHotkeyScope';
+import { DropdownHotkeyScope } from '@/ui/layout/dropdown/constants/DropdownHotkeyScope';
+import { usePushFocusItemToFocusStack } from '@/ui/utilities/focus/hooks/usePushFocusItemToFocusStack';
+import { FocusComponentType } from '@/ui/utilities/focus/types/FocusComponentType';
 import { useRecoilComponentValueV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentValueV2';
 import { useSetRecoilComponentStateV2 } from '@/ui/utilities/state/component-state/hooks/useSetRecoilComponentStateV2';
 import { isDefined } from 'twenty-shared/utils';
@@ -44,7 +44,7 @@ export const useSelectFieldUsedInAdvancedFilterDropdown = () => {
     currentRecordFiltersComponentState,
   );
 
-  const setHotkeyScope = useSetHotkeyScope();
+  const { pushFocusItemToFocusStack } = usePushFocusItemToFocusStack();
 
   const { getFieldMetadataItemById } = useGetFieldMetadataItemById();
 
@@ -76,7 +76,17 @@ export const useSelectFieldUsedInAdvancedFilterDropdown = () => {
       fieldMetadataItem.type === 'RELATION' ||
       fieldMetadataItem.type === 'SELECT'
     ) {
-      setHotkeyScope(SingleRecordPickerHotkeyScope.SingleRecordPicker);
+      pushFocusItemToFocusStack({
+        focusId: fieldMetadataItem.id,
+        component: {
+          type: FocusComponentType.DROPDOWN,
+          instanceId: fieldMetadataItem.id,
+        },
+        hotkeyScope: {
+          scope: DropdownHotkeyScope.Dropdown,
+        },
+        memoizeKey: fieldMetadataItem.id,
+      });
     }
 
     const filterType = getFilterTypeFromFieldType(fieldMetadataItem.type);
diff --git a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/components/ObjectFilterDropdownBooleanSelect.tsx b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/components/ObjectFilterDropdownBooleanSelect.tsx
index 31ddfdfc2..3c96536da 100644
--- a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/components/ObjectFilterDropdownBooleanSelect.tsx
+++ b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/components/ObjectFilterDropdownBooleanSelect.tsx
@@ -3,10 +3,10 @@ import styled from '@emotion/styled';
 
 import { useApplyObjectFilterDropdownFilterValue } from '@/object-record/object-filter-dropdown/hooks/useApplyObjectFilterDropdownFilterValue';
 import { useObjectFilterDropdownFilterValue } from '@/object-record/object-filter-dropdown/hooks/useObjectFilterDropdownFilterValue';
-import { SingleRecordPickerHotkeyScope } from '@/object-record/record-picker/single-record-picker/types/SingleRecordPickerHotkeyScope';
 import { BooleanDisplay } from '@/ui/field/display/components/BooleanDisplay';
 import { DropdownContent } from '@/ui/layout/dropdown/components/DropdownContent';
 import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer';
+import { DropdownHotkeyScope } from '@/ui/layout/dropdown/constants/DropdownHotkeyScope';
 import { GenericDropdownContentWidth } from '@/ui/layout/dropdown/constants/GenericDropdownContentWidth';
 import { useDropdown } from '@/ui/layout/dropdown/hooks/useDropdown';
 import { SelectableList } from '@/ui/layout/selectable-list/components/SelectableList';
@@ -57,7 +57,8 @@ export const ObjectFilterDropdownBooleanSelect = () => {
       <SelectableList
         selectableListInstanceId="boolean-select"
         selectableItemIdArray={options.map((option) => option.toString())}
-        hotkeyScope={SingleRecordPickerHotkeyScope.SingleRecordPicker}
+        focusId="boolean-select"
+        hotkeyScope={DropdownHotkeyScope.Dropdown}
       >
         <DropdownMenuItemsContainer hasMaxHeight>
           {options.map((option) => (
diff --git a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/components/ObjectFilterDropdownFilterInput.tsx b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/components/ObjectFilterDropdownFilterInput.tsx
index c7d7fe169..5df28eb2e 100644
--- a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/components/ObjectFilterDropdownFilterInput.tsx
+++ b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/components/ObjectFilterDropdownFilterInput.tsx
@@ -25,7 +25,7 @@ import { useRecoilComponentValueV2 } from '@/ui/utilities/state/component-state/
 import { isDefined } from 'twenty-shared/utils';
 
 type ObjectFilterDropdownFilterInputProps = {
-  filterDropdownId?: string;
+  filterDropdownId: string;
   recordFilterId?: string;
 };
 
@@ -113,7 +113,10 @@ export const ObjectFilterDropdownFilterInput = ({
           <>
             <ObjectFilterDropdownSearchInput />
             <DropdownMenuSeparator />
-            <ObjectFilterDropdownRecordSelect recordFilterId={recordFilterId} />
+            <ObjectFilterDropdownRecordSelect
+              recordFilterId={recordFilterId}
+              dropdownId={filterDropdownId}
+            />
           </>
         )}
         {filterType === 'ACTOR' && <ObjectFilterDropdownTextInput />}
@@ -123,7 +126,7 @@ export const ObjectFilterDropdownFilterInput = ({
           <>
             <ObjectFilterDropdownSearchInput />
             <DropdownMenuSeparator />
-            <ObjectFilterDropdownOptionSelect />
+            <ObjectFilterDropdownOptionSelect focusId={filterDropdownId} />
           </>
         )}
         {filterType === 'BOOLEAN' && <ObjectFilterDropdownBooleanSelect />}
diff --git a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/components/ObjectFilterDropdownOperandDropdown.tsx b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/components/ObjectFilterDropdownOperandDropdown.tsx
index f7187d1e7..73040aec7 100644
--- a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/components/ObjectFilterDropdownOperandDropdown.tsx
+++ b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/components/ObjectFilterDropdownOperandDropdown.tsx
@@ -3,7 +3,6 @@ import { DropdownMenuHeader } from '@/ui/layout/dropdown/components/DropdownMenu
 import { ObjectFilterDropdownOperandSelect } from '@/object-record/object-filter-dropdown/components/ObjectFilterDropdownOperandSelect';
 import { selectedOperandInDropdownComponentState } from '@/object-record/object-filter-dropdown/states/selectedOperandInDropdownComponentState';
 
-import { FiltersHotkeyScope } from '@/object-record/object-filter-dropdown/types/FiltersHotkeyScope';
 import { Dropdown } from '@/ui/layout/dropdown/components/Dropdown';
 import { ClickOutsideListenerContext } from '@/ui/utilities/pointer-event/contexts/ClickOutsideListenerContext';
 import { useRecoilComponentValueV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentValueV2';
@@ -47,9 +46,6 @@ export const ObjectFilterDropdownOperandDropdown = ({
           </StyledDropdownMenuHeader>
         }
         dropdownComponents={<ObjectFilterDropdownOperandSelect />}
-        dropdownHotkeyScope={{
-          scope: FiltersHotkeyScope.ObjectFilterDropdownOperandDropdown,
-        }}
         dropdownOffset={{ x: parseInt(theme.spacing(2), 10) }}
       />
     </ClickOutsideListenerContext.Provider>
diff --git a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/components/ObjectFilterDropdownOptionSelect.tsx b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/components/ObjectFilterDropdownOptionSelect.tsx
index 3c4166b2e..6c1584bb8 100644
--- a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/components/ObjectFilterDropdownOptionSelect.tsx
+++ b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/components/ObjectFilterDropdownOptionSelect.tsx
@@ -14,9 +14,9 @@ import { ObjectFilterDropdownComponentInstanceContext } from '@/object-record/ob
 import { fieldMetadataItemUsedInDropdownComponentSelector } from '@/object-record/object-filter-dropdown/states/fieldMetadataItemUsedInDropdownComponentSelector';
 import { objectFilterDropdownCurrentRecordFilterComponentState } from '@/object-record/object-filter-dropdown/states/objectFilterDropdownCurrentRecordFilterComponentState';
 import { objectFilterDropdownSearchInputComponentState } from '@/object-record/object-filter-dropdown/states/objectFilterDropdownSearchInputComponentState';
-import { SingleRecordPickerHotkeyScope } from '@/object-record/record-picker/single-record-picker/types/SingleRecordPickerHotkeyScope';
+import { DropdownHotkeyScope } from '@/ui/layout/dropdown/constants/DropdownHotkeyScope';
 import { selectedItemIdComponentState } from '@/ui/layout/selectable-list/states/selectedItemIdComponentState';
-import { useScopedHotkeys } from '@/ui/utilities/hotkey/hooks/useScopedHotkeys';
+import { useHotkeysOnFocusedElement } from '@/ui/utilities/hotkey/hooks/useHotkeysOnFocusedElement';
 import { useAvailableComponentInstanceIdOrThrow } from '@/ui/utilities/state/component-state/hooks/useAvailableComponentInstanceIdOrThrow';
 import { useRecoilComponentValueV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentValueV2';
 import { isNonEmptyString } from '@sniptt/guards';
@@ -30,7 +30,11 @@ type SelectOptionForFilter = FieldMetadataItemOption & {
   isSelected: boolean;
 };
 
-export const ObjectFilterDropdownOptionSelect = () => {
+export const ObjectFilterDropdownOptionSelect = ({
+  focusId,
+}: {
+  focusId: string;
+}) => {
   const fieldMetadataItemUsedInDropdown = useRecoilComponentValueV2(
     fieldMetadataItemUsedInDropdownComponentSelector,
   );
@@ -92,15 +96,16 @@ export const ObjectFilterDropdownOptionSelect = () => {
     }
   }, [selectedOptions, selectOptions]);
 
-  useScopedHotkeys(
-    [Key.Escape],
-    () => {
+  useHotkeysOnFocusedElement({
+    keys: [Key.Escape],
+    callback: () => {
       closeDropdown();
       resetSelectedItem();
     },
-    SingleRecordPickerHotkeyScope.SingleRecordPicker,
-    [closeDropdown, resetSelectedItem],
-  );
+    focusId,
+    scope: DropdownHotkeyScope.Dropdown,
+    dependencies: [closeDropdown, resetSelectedItem],
+  });
 
   const handleMultipleOptionSelectChange = (
     optionChanged: SelectOptionForFilter,
@@ -148,7 +153,8 @@ export const ObjectFilterDropdownOptionSelect = () => {
     <SelectableList
       selectableListInstanceId={componentInstanceId}
       selectableItemIdArray={objectRecordsIds}
-      hotkeyScope={SingleRecordPickerHotkeyScope.SingleRecordPicker}
+      focusId={focusId}
+      hotkeyScope={DropdownHotkeyScope.Dropdown}
     >
       <DropdownMenuItemsContainer hasMaxHeight>
         {showNoResult ? (
diff --git a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/components/ObjectFilterDropdownRecordSelect.tsx b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/components/ObjectFilterDropdownRecordSelect.tsx
index 46c7e4bcf..248d70b13 100644
--- a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/components/ObjectFilterDropdownRecordSelect.tsx
+++ b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/components/ObjectFilterDropdownRecordSelect.tsx
@@ -8,7 +8,6 @@ import { fieldMetadataItemUsedInDropdownComponentSelector } from '@/object-recor
 import { objectFilterDropdownSearchInputComponentState } from '@/object-record/object-filter-dropdown/states/objectFilterDropdownSearchInputComponentState';
 import { selectedOperandInDropdownComponentState } from '@/object-record/object-filter-dropdown/states/selectedOperandInDropdownComponentState';
 import { currentRecordFiltersComponentState } from '@/object-record/record-filter/states/currentRecordFiltersComponentState';
-import { SingleRecordPickerHotkeyScope } from '@/object-record/record-picker/single-record-picker/types/SingleRecordPickerHotkeyScope';
 import { MultipleSelectDropdown } from '@/object-record/select/components/MultipleSelectDropdown';
 import { useRecordsForSelect } from '@/object-record/select/hooks/useRecordsForSelect';
 import { SelectableItem } from '@/object-record/select/types/SelectableItem';
@@ -29,10 +28,12 @@ export const MAX_RECORDS_TO_DISPLAY = 3;
 
 type ObjectFilterDropdownRecordSelectProps = {
   recordFilterId?: string;
+  dropdownId: string;
 };
 
 export const ObjectFilterDropdownRecordSelect = ({
   recordFilterId,
+  dropdownId,
 }: ObjectFilterDropdownRecordSelectProps) => {
   const fieldMetadataItemUsedInFilterDropdown = useRecoilComponentValueV2(
     fieldMetadataItemUsedInDropdownComponentSelector,
@@ -220,7 +221,7 @@ export const ObjectFilterDropdownRecordSelect = ({
       )}
       <MultipleSelectDropdown
         selectableListId="object-filter-record-select-id"
-        hotkeyScope={SingleRecordPickerHotkeyScope.SingleRecordPicker}
+        focusId={dropdownId}
         itemsToSelect={recordsToSelect}
         filteredSelectedItems={filteredSelectedRecords}
         selectedItems={selectedRecords}
diff --git a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/components/ObjectFilterDropdownSourceSelect.tsx b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/components/ObjectFilterDropdownSourceSelect.tsx
index 70ad60f82..d13cac934 100644
--- a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/components/ObjectFilterDropdownSourceSelect.tsx
+++ b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/components/ObjectFilterDropdownSourceSelect.tsx
@@ -3,7 +3,6 @@ import { fieldMetadataItemUsedInDropdownComponentSelector } from '@/object-recor
 import { objectFilterDropdownCurrentRecordFilterComponentState } from '@/object-record/object-filter-dropdown/states/objectFilterDropdownCurrentRecordFilterComponentState';
 import { objectFilterDropdownSearchInputComponentState } from '@/object-record/object-filter-dropdown/states/objectFilterDropdownSearchInputComponentState';
 import { getActorSourceMultiSelectOptions } from '@/object-record/object-filter-dropdown/utils/getActorSourceMultiSelectOptions';
-import { SingleRecordPickerHotkeyScope } from '@/object-record/record-picker/single-record-picker/types/SingleRecordPickerHotkeyScope';
 import { MultipleSelectDropdown } from '@/object-record/select/components/MultipleSelectDropdown';
 import { SelectableItem } from '@/object-record/select/types/SelectableItem';
 import { DropdownContent } from '@/ui/layout/dropdown/components/DropdownContent';
@@ -15,7 +14,11 @@ import { isDefined } from 'twenty-shared/utils';
 export const EMPTY_FILTER_VALUE = '[]';
 export const MAX_ITEMS_TO_DISPLAY = 3;
 
-export const ObjectFilterDropdownSourceSelect = () => {
+export const ObjectFilterDropdownSourceSelect = ({
+  dropdownId,
+}: {
+  dropdownId: string;
+}) => {
   const objectFilterDropdownSearchInput = useRecoilComponentValueV2(
     objectFilterDropdownSearchInputComponentState,
   );
@@ -78,7 +81,7 @@ export const ObjectFilterDropdownSourceSelect = () => {
     <DropdownContent widthInPixels={GenericDropdownContentWidth.ExtraLarge}>
       <MultipleSelectDropdown
         selectableListId="object-filter-source-select-id"
-        hotkeyScope={SingleRecordPickerHotkeyScope.SingleRecordPicker}
+        focusId={dropdownId}
         itemsToSelect={sourceTypes.filter(
           (item) =>
             !filteredSelectedItems.some((selected) => selected.id === item.id),
diff --git a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/types/FiltersHotkeyScope.ts b/packages/twenty-front/src/modules/object-record/object-filter-dropdown/types/FiltersHotkeyScope.ts
deleted file mode 100644
index c1f3a4112..000000000
--- a/packages/twenty-front/src/modules/object-record/object-filter-dropdown/types/FiltersHotkeyScope.ts
+++ /dev/null
@@ -1,5 +0,0 @@
-export enum FiltersHotkeyScope {
-  ObjectFilterDropdownButton = 'filter-dropdown-button',
-  ObjectSortDropdownButton = 'sort-dropdown-button',
-  ObjectFilterDropdownOperandDropdown = 'filter-dropdown-operand-dropdown',
-}
diff --git a/packages/twenty-front/src/modules/object-record/object-options-dropdown/components/ObjectOptionsDropdown.tsx b/packages/twenty-front/src/modules/object-record/object-options-dropdown/components/ObjectOptionsDropdown.tsx
index 8bc64e672..ea7388cbc 100644
--- a/packages/twenty-front/src/modules/object-record/object-options-dropdown/components/ObjectOptionsDropdown.tsx
+++ b/packages/twenty-front/src/modules/object-record/object-options-dropdown/components/ObjectOptionsDropdown.tsx
@@ -7,7 +7,6 @@ import { ObjectOptionsDropdownContext } from '@/object-record/object-options-dro
 import { ObjectOptionsContentId } from '@/object-record/object-options-dropdown/types/ObjectOptionsContentId';
 import { RecordGroupReorderConfirmationModal } from '@/object-record/record-group/components/RecordGroupReorderConfirmationModal';
 import { useRecordGroupReorderConfirmationModal } from '@/object-record/record-group/hooks/useRecordGroupReorderConfirmationModal';
-import { TableOptionsHotkeyScope } from '@/object-record/record-table/types/TableOptionsHotkeyScope';
 import { Dropdown } from '@/ui/layout/dropdown/components/Dropdown';
 import { StyledHeaderDropdownButton } from '@/ui/layout/dropdown/components/StyledHeaderDropdownButton';
 import { useDropdown } from '@/ui/layout/dropdown/hooks/useDropdown';
@@ -40,7 +39,6 @@ export const ObjectOptionsDropdown = ({
     <>
       <Dropdown
         dropdownId={OBJECT_OPTIONS_DROPDOWN_ID}
-        dropdownHotkeyScope={{ scope: TableOptionsHotkeyScope.Dropdown }}
         dropdownOffset={{ y: DROPDOWN_OFFSET_Y }}
         clickableComponent={
           <StyledHeaderDropdownButton isUnfolded={isDropdownOpen}>
diff --git a/packages/twenty-front/src/modules/object-record/object-options-dropdown/components/ObjectOptionsDropdownLayoutContent.tsx b/packages/twenty-front/src/modules/object-record/object-options-dropdown/components/ObjectOptionsDropdownLayoutContent.tsx
index 950273d99..b9d6013eb 100644
--- a/packages/twenty-front/src/modules/object-record/object-options-dropdown/components/ObjectOptionsDropdownLayoutContent.tsx
+++ b/packages/twenty-front/src/modules/object-record/object-options-dropdown/components/ObjectOptionsDropdownLayoutContent.tsx
@@ -4,12 +4,12 @@ import { useOptionsDropdown } from '@/object-record/object-options-dropdown/hook
 import { useSetViewTypeFromLayoutOptionsMenu } from '@/object-record/object-options-dropdown/hooks/useSetViewTypeFromLayoutOptionsMenu';
 import { recordGroupFieldMetadataComponentState } from '@/object-record/record-group/states/recordGroupFieldMetadataComponentState';
 import { recordIndexOpenRecordInState } from '@/object-record/record-index/states/recordIndexOpenRecordInState';
-import { TableOptionsHotkeyScope } from '@/object-record/record-table/types/TableOptionsHotkeyScope';
 import { DropdownContent } from '@/ui/layout/dropdown/components/DropdownContent';
 import { DropdownMenuHeader } from '@/ui/layout/dropdown/components/DropdownMenuHeader/DropdownMenuHeader';
 import { DropdownMenuHeaderLeftComponent } from '@/ui/layout/dropdown/components/DropdownMenuHeader/internal/DropdownMenuHeaderLeftComponent';
 import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer';
 import { DropdownMenuSeparator } from '@/ui/layout/dropdown/components/DropdownMenuSeparator';
+import { DropdownHotkeyScope } from '@/ui/layout/dropdown/constants/DropdownHotkeyScope';
 import { useDropdown } from '@/ui/layout/dropdown/hooks/useDropdown';
 import { SelectableList } from '@/ui/layout/selectable-list/components/SelectableList';
 import { SelectableListItem } from '@/ui/layout/selectable-list/components/SelectableListItem';
@@ -108,8 +108,9 @@ export const ObjectOptionsDropdownLayoutContent = () => {
       {!!currentView && (
         <SelectableList
           selectableListInstanceId={OBJECT_OPTIONS_DROPDOWN_ID}
-          hotkeyScope={TableOptionsHotkeyScope.Dropdown}
+          focusId={OBJECT_OPTIONS_DROPDOWN_ID}
           selectableItemIdArray={selectableItemIdArray}
+          hotkeyScope={DropdownHotkeyScope.Dropdown}
         >
           <DropdownMenuItemsContainer scrollable={false}>
             <SelectableListItem
diff --git a/packages/twenty-front/src/modules/object-record/object-options-dropdown/components/ObjectOptionsDropdownLayoutOpenInContent.tsx b/packages/twenty-front/src/modules/object-record/object-options-dropdown/components/ObjectOptionsDropdownLayoutOpenInContent.tsx
index a53f6193f..5cebd3ef8 100644
--- a/packages/twenty-front/src/modules/object-record/object-options-dropdown/components/ObjectOptionsDropdownLayoutOpenInContent.tsx
+++ b/packages/twenty-front/src/modules/object-record/object-options-dropdown/components/ObjectOptionsDropdownLayoutOpenInContent.tsx
@@ -2,11 +2,11 @@ import { OBJECT_OPTIONS_DROPDOWN_ID } from '@/object-record/object-options-dropd
 import { useOptionsDropdown } from '@/object-record/object-options-dropdown/hooks/useOptionsDropdown';
 import { useUpdateObjectViewOptions } from '@/object-record/object-options-dropdown/hooks/useUpdateObjectViewOptions';
 import { recordIndexOpenRecordInState } from '@/object-record/record-index/states/recordIndexOpenRecordInState';
-import { TableOptionsHotkeyScope } from '@/object-record/record-table/types/TableOptionsHotkeyScope';
 import { DropdownContent } from '@/ui/layout/dropdown/components/DropdownContent';
 import { DropdownMenuHeader } from '@/ui/layout/dropdown/components/DropdownMenuHeader/DropdownMenuHeader';
 import { DropdownMenuHeaderLeftComponent } from '@/ui/layout/dropdown/components/DropdownMenuHeader/internal/DropdownMenuHeaderLeftComponent';
 import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer';
+import { DropdownHotkeyScope } from '@/ui/layout/dropdown/constants/DropdownHotkeyScope';
 import { SelectableList } from '@/ui/layout/selectable-list/components/SelectableList';
 import { SelectableListItem } from '@/ui/layout/selectable-list/components/SelectableListItem';
 import { selectedItemIdComponentState } from '@/ui/layout/selectable-list/states/selectedItemIdComponentState';
@@ -53,8 +53,9 @@ export const ObjectOptionsDropdownLayoutOpenInContent = () => {
       <DropdownMenuItemsContainer>
         <SelectableList
           selectableListInstanceId={OBJECT_OPTIONS_DROPDOWN_ID}
-          hotkeyScope={TableOptionsHotkeyScope.Dropdown}
+          focusId={OBJECT_OPTIONS_DROPDOWN_ID}
           selectableItemIdArray={selectableItemIdArray}
+          hotkeyScope={DropdownHotkeyScope.Dropdown}
         >
           <SelectableListItem
             itemId={ViewOpenRecordInType.SIDE_PANEL}
diff --git a/packages/twenty-front/src/modules/object-record/object-options-dropdown/components/ObjectOptionsDropdownMenuContent.tsx b/packages/twenty-front/src/modules/object-record/object-options-dropdown/components/ObjectOptionsDropdownMenuContent.tsx
index c67b79412..fe77f1cd8 100644
--- a/packages/twenty-front/src/modules/object-record/object-options-dropdown/components/ObjectOptionsDropdownMenuContent.tsx
+++ b/packages/twenty-front/src/modules/object-record/object-options-dropdown/components/ObjectOptionsDropdownMenuContent.tsx
@@ -1,20 +1,17 @@
-import { Key } from 'ts-key-enum';
-
 import { ObjectOptionsDropdownMenuViewName } from '@/object-record/object-options-dropdown/components/ObjectOptionsDropdownMenuViewName';
 import { OBJECT_OPTIONS_DROPDOWN_ID } from '@/object-record/object-options-dropdown/constants/ObjectOptionsDropdownId';
 import { useObjectOptionsForBoard } from '@/object-record/object-options-dropdown/hooks/useObjectOptionsForBoard';
 import { useOptionsDropdown } from '@/object-record/object-options-dropdown/hooks/useOptionsDropdown';
 import { recordGroupFieldMetadataComponentState } from '@/object-record/record-group/states/recordGroupFieldMetadataComponentState';
-import { TableOptionsHotkeyScope } from '@/object-record/record-table/types/TableOptionsHotkeyScope';
 import { SnackBarVariant } from '@/ui/feedback/snack-bar-manager/components/SnackBar';
 import { useSnackBar } from '@/ui/feedback/snack-bar-manager/hooks/useSnackBar';
 import { DropdownContent } from '@/ui/layout/dropdown/components/DropdownContent';
 import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer';
 import { DropdownMenuSeparator } from '@/ui/layout/dropdown/components/DropdownMenuSeparator';
+import { DropdownHotkeyScope } from '@/ui/layout/dropdown/constants/DropdownHotkeyScope';
 import { SelectableList } from '@/ui/layout/selectable-list/components/SelectableList';
 import { SelectableListItem } from '@/ui/layout/selectable-list/components/SelectableListItem';
 import { selectedItemIdComponentState } from '@/ui/layout/selectable-list/states/selectedItemIdComponentState';
-import { useScopedHotkeys } from '@/ui/utilities/hotkey/hooks/useScopedHotkeys';
 import { useRecoilComponentValueV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentValueV2';
 import { useSetRecoilComponentStateV2 } from '@/ui/utilities/state/component-state/hooks/useSetRecoilComponentStateV2';
 import { useGetCurrentViewOnly } from '@/views/hooks/useGetCurrentViewOnly';
@@ -48,14 +45,6 @@ export const ObjectOptionsDropdownMenuContent = () => {
     (isDefined(currentView?.viewGroups) && currentView.viewGroups.length > 0) ||
     currentView?.key !== 'INDEX';
 
-  useScopedHotkeys(
-    [Key.Escape],
-    () => {
-      closeDropdown();
-    },
-    TableOptionsHotkeyScope.Dropdown,
-  );
-
   const { visibleBoardFields } = useObjectOptionsForBoard({
     objectNameSingular: objectMetadataItem.nameSingular,
     recordBoardId: recordIndexId,
@@ -101,8 +90,9 @@ export const ObjectOptionsDropdownMenuContent = () => {
       <DropdownMenuSeparator />
       <SelectableList
         selectableListInstanceId={OBJECT_OPTIONS_DROPDOWN_ID}
-        hotkeyScope={TableOptionsHotkeyScope.Dropdown}
+        focusId={OBJECT_OPTIONS_DROPDOWN_ID}
         selectableItemIdArray={selectableItemIdArray}
+        hotkeyScope={DropdownHotkeyScope.Dropdown}
       >
         <DropdownMenuItemsContainer scrollable={false}>
           <SelectableListItem
diff --git a/packages/twenty-front/src/modules/object-record/object-options-dropdown/components/ObjectOptionsDropdownMenuViewName.tsx b/packages/twenty-front/src/modules/object-record/object-options-dropdown/components/ObjectOptionsDropdownMenuViewName.tsx
index 64c3717d2..8afd40547 100644
--- a/packages/twenty-front/src/modules/object-record/object-options-dropdown/components/ObjectOptionsDropdownMenuViewName.tsx
+++ b/packages/twenty-front/src/modules/object-record/object-options-dropdown/components/ObjectOptionsDropdownMenuViewName.tsx
@@ -4,12 +4,13 @@ import { useUpdateObjectViewOptions } from '@/object-record/object-options-dropd
 import { IconPicker } from '@/ui/input/components/IconPicker';
 import { TextInputV2 } from '@/ui/input/components/TextInputV2';
 import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer';
-import { useScopedHotkeys } from '@/ui/utilities/hotkey/hooks/useScopedHotkeys';
+import { DropdownHotkeyScope } from '@/ui/layout/dropdown/constants/DropdownHotkeyScope';
+import { useHotkeysOnFocusedElement } from '@/ui/utilities/hotkey/hooks/useHotkeysOnFocusedElement';
 import { useRecoilComponentStateV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentStateV2';
 import { useRecoilComponentValueV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentValueV2';
 import { useSetRecoilComponentStateV2 } from '@/ui/utilities/state/component-state/hooks/useSetRecoilComponentStateV2';
 import { View } from '@/views/types/View';
-import { ViewsHotkeyScope } from '@/views/types/ViewsHotkeyScope';
+import { VIEW_PICKER_DROPDOWN_ID } from '@/views/view-picker/constants/ViewPickerDropdownId';
 import { useUpdateViewFromCurrentState } from '@/views/view-picker/hooks/useUpdateViewFromCurrentState';
 import { viewPickerIsDirtyComponentState } from '@/views/view-picker/states/viewPickerIsDirtyComponentState';
 import { viewPickerIsPersistingComponentState } from '@/views/view-picker/states/viewPickerIsPersistingComponentState';
@@ -75,17 +76,19 @@ export const ObjectOptionsDropdownMenuViewName = ({
   const { updateViewFromCurrentState } = useUpdateViewFromCurrentState();
   const [viewName, setViewName] = useState(currentView?.name);
 
-  useScopedHotkeys(
-    Key.Enter,
-    async () => {
+  useHotkeysOnFocusedElement({
+    keys: [Key.Enter],
+    callback: async () => {
       if (viewPickerIsPersisting) {
         return;
       }
 
       await updateViewFromCurrentState();
     },
-    ViewsHotkeyScope.ListDropdown,
-  );
+    focusId: VIEW_PICKER_DROPDOWN_ID,
+    scope: DropdownHotkeyScope.Dropdown,
+    dependencies: [viewPickerIsPersisting, updateViewFromCurrentState],
+  });
 
   const handleIconChange = ({ iconKey }: { iconKey: string }) => {
     setViewPickerIsDirty(true);
diff --git a/packages/twenty-front/src/modules/object-record/object-options-dropdown/components/ObjectOptionsDropdownRecordGroupSortContent.tsx b/packages/twenty-front/src/modules/object-record/object-options-dropdown/components/ObjectOptionsDropdownRecordGroupSortContent.tsx
index 6d926e896..9f1004ab8 100644
--- a/packages/twenty-front/src/modules/object-record/object-options-dropdown/components/ObjectOptionsDropdownRecordGroupSortContent.tsx
+++ b/packages/twenty-front/src/modules/object-record/object-options-dropdown/components/ObjectOptionsDropdownRecordGroupSortContent.tsx
@@ -5,11 +5,11 @@ import { useOptionsDropdown } from '@/object-record/object-options-dropdown/hook
 import { hiddenRecordGroupIdsComponentSelector } from '@/object-record/record-group/states/selectors/hiddenRecordGroupIdsComponentSelector';
 import { RecordGroupSort } from '@/object-record/record-group/types/RecordGroupSort';
 import { recordIndexRecordGroupSortComponentState } from '@/object-record/record-index/states/recordIndexRecordGroupSortComponentState';
-import { TableOptionsHotkeyScope } from '@/object-record/record-table/types/TableOptionsHotkeyScope';
 import { DropdownContent } from '@/ui/layout/dropdown/components/DropdownContent';
 import { DropdownMenuHeader } from '@/ui/layout/dropdown/components/DropdownMenuHeader/DropdownMenuHeader';
 import { DropdownMenuHeaderLeftComponent } from '@/ui/layout/dropdown/components/DropdownMenuHeader/internal/DropdownMenuHeaderLeftComponent';
 import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer';
+import { DropdownHotkeyScope } from '@/ui/layout/dropdown/constants/DropdownHotkeyScope';
 import { SelectableList } from '@/ui/layout/selectable-list/components/SelectableList';
 import { SelectableListItem } from '@/ui/layout/selectable-list/components/SelectableListItem';
 import { selectedItemIdComponentState } from '@/ui/layout/selectable-list/states/selectedItemIdComponentState';
@@ -73,8 +73,9 @@ export const ObjectOptionsDropdownRecordGroupSortContent = () => {
       <DropdownMenuItemsContainer>
         <SelectableList
           selectableListInstanceId={OBJECT_OPTIONS_DROPDOWN_ID}
-          hotkeyScope={TableOptionsHotkeyScope.Dropdown}
+          focusId={OBJECT_OPTIONS_DROPDOWN_ID}
           selectableItemIdArray={selectableItemIdArray}
+          hotkeyScope={DropdownHotkeyScope.Dropdown}
         >
           <SelectableListItem
             itemId={RecordGroupSort.Manual}
diff --git a/packages/twenty-front/src/modules/object-record/object-options-dropdown/components/ObjectOptionsDropdownRecordGroupsContent.tsx b/packages/twenty-front/src/modules/object-record/object-options-dropdown/components/ObjectOptionsDropdownRecordGroupsContent.tsx
index 31aeb8ba1..89bc57433 100644
--- a/packages/twenty-front/src/modules/object-record/object-options-dropdown/components/ObjectOptionsDropdownRecordGroupsContent.tsx
+++ b/packages/twenty-front/src/modules/object-record/object-options-dropdown/components/ObjectOptionsDropdownRecordGroupsContent.tsx
@@ -9,12 +9,12 @@ import { hiddenRecordGroupIdsComponentSelector } from '@/object-record/record-gr
 import { visibleRecordGroupIdsComponentFamilySelector } from '@/object-record/record-group/states/selectors/visibleRecordGroupIdsComponentFamilySelector';
 import { recordIndexRecordGroupHideComponentFamilyState } from '@/object-record/record-index/states/recordIndexRecordGroupHideComponentFamilyState';
 import { recordIndexRecordGroupSortComponentState } from '@/object-record/record-index/states/recordIndexRecordGroupSortComponentState';
-import { TableOptionsHotkeyScope } from '@/object-record/record-table/types/TableOptionsHotkeyScope';
 import { DropdownContent } from '@/ui/layout/dropdown/components/DropdownContent';
 import { DropdownMenuHeader } from '@/ui/layout/dropdown/components/DropdownMenuHeader/DropdownMenuHeader';
 import { DropdownMenuHeaderLeftComponent } from '@/ui/layout/dropdown/components/DropdownMenuHeader/internal/DropdownMenuHeaderLeftComponent';
 import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer';
 import { DropdownMenuSeparator } from '@/ui/layout/dropdown/components/DropdownMenuSeparator';
+import { DropdownHotkeyScope } from '@/ui/layout/dropdown/constants/DropdownHotkeyScope';
 import { SelectableList } from '@/ui/layout/selectable-list/components/SelectableList';
 import { SelectableListItem } from '@/ui/layout/selectable-list/components/SelectableListItem';
 import { selectedItemIdComponentState } from '@/ui/layout/selectable-list/states/selectedItemIdComponentState';
@@ -94,6 +94,8 @@ export const ObjectOptionsDropdownRecordGroupsContent = () => {
     'HideEmptyGroups',
   ];
 
+  const hiddenGroupsSelectableListId = `${OBJECT_OPTIONS_DROPDOWN_ID}-hidden-groups`;
+
   return (
     <DropdownContent>
       <DropdownMenuHeader
@@ -109,8 +111,9 @@ export const ObjectOptionsDropdownRecordGroupsContent = () => {
       <DropdownMenuItemsContainer>
         <SelectableList
           selectableListInstanceId={OBJECT_OPTIONS_DROPDOWN_ID}
-          hotkeyScope={TableOptionsHotkeyScope.Dropdown}
+          focusId={OBJECT_OPTIONS_DROPDOWN_ID}
           selectableItemIdArray={selectableItemIdArray}
+          hotkeyScope={DropdownHotkeyScope.Dropdown}
         >
           {currentView?.key !== 'INDEX' && (
             <>
@@ -175,9 +178,10 @@ export const ObjectOptionsDropdownRecordGroupsContent = () => {
           <DropdownMenuSeparator />
           <DropdownMenuItemsContainer scrollable={false}>
             <SelectableList
-              selectableListInstanceId={`${OBJECT_OPTIONS_DROPDOWN_ID}-hidden-groups`}
-              hotkeyScope={TableOptionsHotkeyScope.Dropdown}
+              selectableListInstanceId={hiddenGroupsSelectableListId}
+              focusId={hiddenGroupsSelectableListId}
               selectableItemIdArray={['HiddenGroups']}
+              hotkeyScope={DropdownHotkeyScope.Dropdown}
             >
               <SelectableListItem
                 itemId="HiddenGroups"
diff --git a/packages/twenty-front/src/modules/object-record/object-sort-dropdown/components/ObjectSortDropdownButton.tsx b/packages/twenty-front/src/modules/object-record/object-sort-dropdown/components/ObjectSortDropdownButton.tsx
index 308ebf29f..aac85f400 100644
--- a/packages/twenty-front/src/modules/object-record/object-sort-dropdown/components/ObjectSortDropdownButton.tsx
+++ b/packages/twenty-front/src/modules/object-record/object-sort-dropdown/components/ObjectSortDropdownButton.tsx
@@ -6,7 +6,6 @@ import { OBJECT_SORT_DROPDOWN_ID } from '@/object-record/object-sort-dropdown/co
 import { useCloseSortDropdown } from '@/object-record/object-sort-dropdown/hooks/useCloseSortDropdown';
 import { useResetRecordSortDropdownSearchInput } from '@/object-record/object-sort-dropdown/hooks/useResetRecordSortDropdownSearchInput';
 import { useResetSortDropdown } from '@/object-record/object-sort-dropdown/hooks/useResetSortDropdown';
-import { useToggleSortDropdown } from '@/object-record/object-sort-dropdown/hooks/useToggleSortDropdown';
 import { isRecordSortDirectionDropdownMenuUnfoldedComponentState } from '@/object-record/object-sort-dropdown/states/isRecordSortDirectionDropdownMenuUnfoldedComponentState';
 import { objectSortDropdownSearchInputComponentState } from '@/object-record/object-sort-dropdown/states/objectSortDropdownSearchInputComponentState';
 import { selectedRecordSortDirectionComponentState } from '@/object-record/object-sort-dropdown/states/selectedRecordSortDirectionComponentState';
@@ -25,6 +24,7 @@ import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/Drop
 import { DropdownMenuSectionLabel } from '@/ui/layout/dropdown/components/DropdownMenuSectionLabel';
 import { DropdownMenuSeparator } from '@/ui/layout/dropdown/components/DropdownMenuSeparator';
 import { StyledHeaderDropdownButton } from '@/ui/layout/dropdown/components/StyledHeaderDropdownButton';
+import { DropdownHotkeyScope } from '@/ui/layout/dropdown/constants/DropdownHotkeyScope';
 import { GenericDropdownContentWidth } from '@/ui/layout/dropdown/constants/GenericDropdownContentWidth';
 import { useDropdown } from '@/ui/layout/dropdown/hooks/useDropdown';
 import { SelectableList } from '@/ui/layout/selectable-list/components/SelectableList';
@@ -86,11 +86,7 @@ export type ObjectSortDropdownButtonProps = {
   hotkeyScope: HotkeyScope;
 };
 
-export const ObjectSortDropdownButton = ({
-  hotkeyScope,
-}: ObjectSortDropdownButtonProps) => {
-  const { toggleSortDropdown } = useToggleSortDropdown();
-
+export const ObjectSortDropdownButton = () => {
   const { resetRecordSortDropdownSearchInput } =
     useResetRecordSortDropdownSearchInput();
 
@@ -162,15 +158,16 @@ export const ObjectSortDropdownButton = ({
   const shouldShowSeparator =
     visibleFieldMetadataItems.length > 0 && hiddenFieldMetadataItems.length > 0;
 
-  const handleButtonClick = () => {
-    toggleSortDropdown();
-  };
-
   const handleDropdownButtonClose = () => {
     resetRecordSortDropdownSearchInput();
     resetSortDropdown();
   };
 
+  const handleDropdownOpen = () => {
+    resetSortDropdown();
+    setSelectedItemId(selectableItemIdArray[0]);
+  };
+
   const { closeSortDropdown } = useCloseSortDropdown();
 
   const { upsertRecordSort } = useUpsertRecordSort();
@@ -224,16 +221,10 @@ export const ObjectSortDropdownButton = ({
   return (
     <Dropdown
       dropdownId={OBJECT_SORT_DROPDOWN_ID}
-      dropdownHotkeyScope={hotkeyScope}
       dropdownOffset={{ y: 8 }}
+      onOpen={handleDropdownOpen}
       clickableComponent={
-        <StyledHeaderDropdownButton
-          onClick={() => {
-            handleButtonClick();
-            setSelectedItemId(selectableItemIdArray[0]);
-          }}
-          isUnfolded={isDropdownOpen}
-        >
+        <StyledHeaderDropdownButton isUnfolded={isDropdownOpen}>
           <Trans>Sort</Trans>
         </StyledHeaderDropdownButton>
       }
@@ -241,8 +232,9 @@ export const ObjectSortDropdownButton = ({
         <DropdownContent widthInPixels={GenericDropdownContentWidth.ExtraLarge}>
           <SelectableList
             selectableListInstanceId={OBJECT_SORT_DROPDOWN_ID}
-            hotkeyScope={hotkeyScope.scope}
             selectableItemIdArray={selectableItemIdArray}
+            focusId={OBJECT_SORT_DROPDOWN_ID}
+            hotkeyScope={DropdownHotkeyScope.Dropdown}
           >
             {isRecordSortDirectionMenuUnfolded && (
               <StyledSelectedSortDirectionContainer>
diff --git a/packages/twenty-front/src/modules/object-record/record-board/record-board-card/components/RecordBoardCard.tsx b/packages/twenty-front/src/modules/object-record/record-board/record-board-card/components/RecordBoardCard.tsx
index 90c530ce2..b6741472c 100644
--- a/packages/twenty-front/src/modules/object-record/record-board/record-board-card/components/RecordBoardCard.tsx
+++ b/packages/twenty-front/src/modules/object-record/record-board/record-board-card/components/RecordBoardCard.tsx
@@ -9,7 +9,6 @@ import { isRecordBoardCardSelectedComponentFamilyState } from '@/object-record/r
 import { isRecordBoardCompactModeActiveComponentState } from '@/object-record/record-board/states/isRecordBoardCompactModeActiveComponentState';
 import { recordBoardVisibleFieldDefinitionsComponentSelector } from '@/object-record/record-board/states/selectors/recordBoardVisibleFieldDefinitionsComponentSelector';
 
-import { ActionMenuDropdownHotkeyScope } from '@/action-menu/types/ActionMenuDropdownHotKeyScope';
 import { useActiveRecordBoardCard } from '@/object-record/record-board/hooks/useActiveRecordBoardCard';
 import { useFocusedRecordBoardCard } from '@/object-record/record-board/hooks/useFocusedRecordBoardCard';
 import { RecordBoardCardBody } from '@/object-record/record-board/record-board-card/components/RecordBoardCardBody';
@@ -155,7 +154,8 @@ export const RecordBoardCard = () => {
       y: event.clientY,
     });
     openDropdown(actionMenuDropdownId, {
-      scope: ActionMenuDropdownHotkeyScope.ActionMenuDropdown,
+      enableGlobalHotkeysWithModifiers: true,
+      enableGlobalHotkeysConflictingWithKeyboard: false,
     });
   };
 
diff --git a/packages/twenty-front/src/modules/object-record/record-board/record-board-column/components/RecordBoardColumnHeaderAggregateDropdown.tsx b/packages/twenty-front/src/modules/object-record/record-board/record-board-column/components/RecordBoardColumnHeaderAggregateDropdown.tsx
index 627b6866e..c113730f9 100644
--- a/packages/twenty-front/src/modules/object-record/record-board/record-board-column/components/RecordBoardColumnHeaderAggregateDropdown.tsx
+++ b/packages/twenty-front/src/modules/object-record/record-board/record-board-column/components/RecordBoardColumnHeaderAggregateDropdown.tsx
@@ -5,7 +5,6 @@ import { RecordBoardColumnHeaderAggregateDropdownComponentInstanceContext } from
 import { RecordBoardColumnHeaderAggregateDropdownButton } from '@/object-record/record-board/record-board-column/components/RecordBoardColumnHeaderAggregateDropdownButton';
 import { AggregateDropdownContent } from '@/object-record/record-board/record-board-column/components/RecordBoardColumnHeaderAggregateDropdownContent';
 import { RecordBoardColumnHeaderAggregateDropdownContext } from '@/object-record/record-board/record-board-column/components/RecordBoardColumnHeaderAggregateDropdownContext';
-import { RecordBoardColumnHotkeyScope } from '@/object-record/record-board/types/BoardColumnHotkeyScope';
 import { RecordBoardColumnHeaderAggregateContentId } from '@/object-record/record-board/types/RecordBoardColumnHeaderAggregateContentId';
 import { Dropdown } from '@/ui/layout/dropdown/components/Dropdown';
 import styled from '@emotion/styled';
@@ -42,9 +41,6 @@ export const RecordBoardColumnHeaderAggregateDropdown = ({
         <Dropdown
           onClose={handleResetContent}
           dropdownId={dropdownId}
-          dropdownHotkeyScope={{
-            scope: RecordBoardColumnHotkeyScope.ColumnHeader,
-          }}
           dropdownOffset={{ y: DROPDOWN_OFFSET_Y }}
           clickableComponent={
             <RecordBoardColumnHeaderAggregateDropdownButton
diff --git a/packages/twenty-front/src/modules/object-record/record-field/form-types/components/FormMultiSelectFieldInput.tsx b/packages/twenty-front/src/modules/object-record/record-field/form-types/components/FormMultiSelectFieldInput.tsx
index 9a549fe10..947cb63ff 100644
--- a/packages/twenty-front/src/modules/object-record/record-field/form-types/components/FormMultiSelectFieldInput.tsx
+++ b/packages/twenty-front/src/modules/object-record/record-field/form-types/components/FormMultiSelectFieldInput.tsx
@@ -11,6 +11,7 @@ import { FieldMultiSelectValue } from '@/object-record/record-field/types/FieldM
 import { MultiSelectDisplay } from '@/ui/field/display/components/MultiSelectDisplay';
 import { MultiSelectInput } from '@/ui/field/input/components/MultiSelectInput';
 import { InputLabel } from '@/ui/input/components/InputLabel';
+import { GenericDropdownContentWidth } from '@/ui/layout/dropdown/constants/GenericDropdownContentWidth';
 import { OverlayContainer } from '@/ui/layout/overlay/components/OverlayContainer';
 import { usePreviousHotkeyScope } from '@/ui/utilities/hotkey/hooks/usePreviousHotkeyScope';
 import { isStandaloneVariableString } from '@/workflow/utils/isStandaloneVariableString';
@@ -21,7 +22,6 @@ import { isDefined } from 'twenty-shared/utils';
 import { VisibilityHidden } from 'twenty-ui/accessibility';
 import { IconChevronDown } from 'twenty-ui/display';
 import { SelectOption } from 'twenty-ui/input';
-import { GenericDropdownContentWidth } from '@/ui/layout/dropdown/constants/GenericDropdownContentWidth';
 
 type FormMultiSelectFieldInputProps = {
   label?: string;
@@ -256,7 +256,7 @@ export const FormMultiSelectFieldInput = ({
                   selectableListComponentInstanceId={
                     SELECT_FIELD_INPUT_SELECTABLE_LIST_COMPONENT_INSTANCE_ID
                   }
-                  hotkeyScope={hotkeyScope}
+                  focusId={hotkeyScope}
                   options={options}
                   onCancel={onCancel}
                   onOptionSelected={onOptionSelected}
diff --git a/packages/twenty-front/src/modules/object-record/record-field/form-types/components/FormSingleRecordPicker.tsx b/packages/twenty-front/src/modules/object-record/record-field/form-types/components/FormSingleRecordPicker.tsx
index 3ceb98779..3b8bb9a42 100644
--- a/packages/twenty-front/src/modules/object-record/record-field/form-types/components/FormSingleRecordPicker.tsx
+++ b/packages/twenty-front/src/modules/object-record/record-field/form-types/components/FormSingleRecordPicker.tsx
@@ -10,6 +10,7 @@ import { singleRecordPickerSelectedIdComponentState } from '@/object-record/reco
 import { SingleRecordPickerRecord } from '@/object-record/record-picker/single-record-picker/types/SingleRecordPickerRecord';
 import { InputLabel } from '@/ui/input/components/InputLabel';
 import { Dropdown } from '@/ui/layout/dropdown/components/Dropdown';
+import { GenericDropdownContentWidth } from '@/ui/layout/dropdown/constants/GenericDropdownContentWidth';
 import { useDropdown } from '@/ui/layout/dropdown/hooks/useDropdown';
 import { useSetRecoilComponentStateV2 } from '@/ui/utilities/state/component-state/hooks/useSetRecoilComponentStateV2';
 import { isStandaloneVariableString } from '@/workflow/utils/isStandaloneVariableString';
@@ -18,7 +19,6 @@ import styled from '@emotion/styled';
 import { useCallback, useId } from 'react';
 import { isDefined, isValidUuid } from 'twenty-shared/utils';
 import { IconChevronDown, IconForbid } from 'twenty-ui/display';
-import { GenericDropdownContentWidth } from '@/ui/layout/dropdown/constants/GenericDropdownContentWidth';
 
 const StyledFormSelectContainer = styled(FormFieldInputInnerContainer)<{
   readonly?: boolean;
@@ -189,6 +189,7 @@ export const FormSingleRecordPicker = ({
             }
             dropdownComponents={
               <SingleRecordPicker
+                focusId={dropdownId}
                 componentInstanceId={dropdownId}
                 EmptyIcon={IconForbid}
                 emptyLabel={'No ' + objectNameSingular}
@@ -199,7 +200,6 @@ export const FormSingleRecordPicker = ({
                 dropdownWidth={GenericDropdownContentWidth.ExtraLarge}
               />
             }
-            dropdownHotkeyScope={{ scope: dropdownId }}
           />
         )}
         {isDefined(VariablePicker) && !disabled && (
diff --git a/packages/twenty-front/src/modules/object-record/record-field/hooks/useOpenFieldInputEditMode.ts b/packages/twenty-front/src/modules/object-record/record-field/hooks/useOpenFieldInputEditMode.ts
index 889b6185f..bdd6a10d6 100644
--- a/packages/twenty-front/src/modules/object-record/record-field/hooks/useOpenFieldInputEditMode.ts
+++ b/packages/twenty-front/src/modules/object-record/record-field/hooks/useOpenFieldInputEditMode.ts
@@ -7,6 +7,7 @@ import { getActivityTargetObjectRecords } from '@/activities/utils/getActivityTa
 import { objectMetadataItemsState } from '@/object-metadata/states/objectMetadataItemsState';
 import { useOpenRelationFromManyFieldInput } from '@/object-record/record-field/meta-types/input/hooks/useOpenRelationFromManyFieldInput';
 import { useOpenRelationToOneFieldInput } from '@/object-record/record-field/meta-types/input/hooks/useOpenRelationToOneFieldInput';
+import { getRelationFromManyFieldInputInstanceId } from '@/object-record/record-field/meta-types/input/utils/getRelationFromManyFieldInputInstanceId';
 import { FieldDefinition } from '@/object-record/record-field/types/FieldDefinition';
 import {
   FieldMetadata,
@@ -15,11 +16,13 @@ import {
 } from '@/object-record/record-field/types/FieldMetadata';
 import { isFieldRelationFromManyObjects } from '@/object-record/record-field/types/guards/isFieldRelationFromManyObjects';
 import { isFieldRelationToOneObject } from '@/object-record/record-field/types/guards/isFieldRelationToOneObject';
+import { getFieldInputInstanceId } from '@/object-record/record-field/utils/getFieldInputInstanceId';
 import { INLINE_CELL_HOTKEY_SCOPE_MEMOIZE_KEY } from '@/object-record/record-inline-cell/constants/InlineCellHotkeyScopeMemoizeKey';
 import { recordStoreFamilyState } from '@/object-record/record-store/states/recordStoreFamilyState';
 import { recordStoreFamilySelector } from '@/object-record/record-store/states/selectors/recordStoreFamilySelector';
 import { DEFAULT_CELL_SCOPE } from '@/object-record/record-table/record-table-cell/hooks/useOpenRecordTableCellV2';
-import { usePreviousHotkeyScope } from '@/ui/utilities/hotkey/hooks/usePreviousHotkeyScope';
+import { usePushFocusItemToFocusStack } from '@/ui/utilities/focus/hooks/usePushFocusItemToFocusStack';
+import { FocusComponentType } from '@/ui/utilities/focus/types/FocusComponentType';
 import { useRecoilCallback } from 'recoil';
 import { isDefined } from 'twenty-shared/utils';
 
@@ -31,7 +34,7 @@ export const useOpenFieldInputEditMode = () => {
   const { openActivityTargetCellEditMode } =
     useOpenActivityTargetCellEditMode();
 
-  const { setHotkeyScopeAndMemorizePreviousScope } = usePreviousHotkeyScope();
+  const { pushFocusItemToFocusStack } = usePushFocusItemToFocusStack();
 
   const openFieldInput = useRecoilCallback(
     ({ snapshot }) =>
@@ -72,7 +75,10 @@ export const useOpenFieldInputEditMode = () => {
           });
 
           openActivityTargetCellEditMode({
-            recordPickerInstanceId: `relation-from-many-field-input-${recordId}`,
+            recordPickerInstanceId: getRelationFromManyFieldInputInstanceId({
+              recordId,
+              fieldName: fieldDefinition.metadata.fieldName,
+            }),
             activityTargetObjectRecords,
           });
           return;
@@ -103,9 +109,22 @@ export const useOpenFieldInputEditMode = () => {
           }
         }
 
-        setHotkeyScopeAndMemorizePreviousScope({
-          scope: DEFAULT_CELL_SCOPE.scope,
-          customScopes: DEFAULT_CELL_SCOPE.customScopes,
+        pushFocusItemToFocusStack({
+          focusId: getFieldInputInstanceId(
+            recordId,
+            fieldDefinition.metadata.fieldName,
+          ),
+          component: {
+            type: FocusComponentType.OPEN_FIELD_INPUT,
+            instanceId: getFieldInputInstanceId(
+              recordId,
+              fieldDefinition.metadata.fieldName,
+            ),
+          },
+          hotkeyScope: {
+            scope: DEFAULT_CELL_SCOPE.scope,
+            customScopes: DEFAULT_CELL_SCOPE.customScopes,
+          },
           memoizeKey: INLINE_CELL_HOTKEY_SCOPE_MEMOIZE_KEY,
         });
       },
@@ -113,7 +132,7 @@ export const useOpenFieldInputEditMode = () => {
       openActivityTargetCellEditMode,
       openRelationFromManyFieldInput,
       openRelationToOneFieldInput,
-      setHotkeyScopeAndMemorizePreviousScope,
+      pushFocusItemToFocusStack,
     ],
   );
 
diff --git a/packages/twenty-front/src/modules/object-record/record-field/meta-types/hooks/useMultiSelectField.ts b/packages/twenty-front/src/modules/object-record/record-field/meta-types/hooks/useMultiSelectField.ts
index b07cdfbfc..19e580c87 100644
--- a/packages/twenty-front/src/modules/object-record/record-field/meta-types/hooks/useMultiSelectField.ts
+++ b/packages/twenty-front/src/modules/object-record/record-field/meta-types/hooks/useMultiSelectField.ts
@@ -39,6 +39,7 @@ export const useMultiSelectField = () => {
   const draftValue = useRecoilValue(getDraftValueSelector());
 
   return {
+    recordId,
     fieldDefinition,
     persistField,
     fieldValues: fieldMultiSelectValues,
diff --git a/packages/twenty-front/src/modules/object-record/record-field/meta-types/hooks/useSelectField.ts b/packages/twenty-front/src/modules/object-record/record-field/meta-types/hooks/useSelectField.ts
index 1f31ad69a..90008beda 100644
--- a/packages/twenty-front/src/modules/object-record/record-field/meta-types/hooks/useSelectField.ts
+++ b/packages/twenty-front/src/modules/object-record/record-field/meta-types/hooks/useSelectField.ts
@@ -34,6 +34,7 @@ export const useSelectField = () => {
   const draftValue = useRecoilValue(getDraftValueSelector());
 
   return {
+    recordId,
     fieldDefinition,
     persistField,
     fieldValue: fieldSelectValue,
diff --git a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/MultiSelectFieldInput.tsx b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/MultiSelectFieldInput.tsx
index b21ac8379..d79830c99 100644
--- a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/MultiSelectFieldInput.tsx
+++ b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/MultiSelectFieldInput.tsx
@@ -1,6 +1,6 @@
 import { useMultiSelectField } from '@/object-record/record-field/meta-types/hooks/useMultiSelectField';
 import { SELECT_FIELD_INPUT_SELECTABLE_LIST_COMPONENT_INSTANCE_ID } from '@/object-record/record-field/meta-types/input/constants/SelectFieldInputSelectableListComponentInstanceId';
-import { DEFAULT_CELL_SCOPE } from '@/object-record/record-table/record-table-cell/hooks/useOpenRecordTableCellV2';
+import { getFieldInputInstanceId } from '@/object-record/record-field/utils/getFieldInputInstanceId';
 import { MultiSelectInput } from '@/ui/field/input/components/MultiSelectInput';
 
 type MultiSelectFieldInputProps = {
@@ -10,14 +10,18 @@ type MultiSelectFieldInputProps = {
 export const MultiSelectFieldInput = ({
   onCancel,
 }: MultiSelectFieldInputProps) => {
-  const { persistField, fieldDefinition, fieldValues } = useMultiSelectField();
+  const { persistField, fieldDefinition, fieldValues, recordId } =
+    useMultiSelectField();
 
   return (
     <MultiSelectInput
       selectableListComponentInstanceId={
         SELECT_FIELD_INPUT_SELECTABLE_LIST_COMPONENT_INSTANCE_ID
       }
-      hotkeyScope={DEFAULT_CELL_SCOPE.scope}
+      focusId={getFieldInputInstanceId(
+        recordId,
+        fieldDefinition.metadata.fieldName,
+      )}
       options={fieldDefinition.metadata.options}
       onCancel={onCancel}
       onOptionSelected={persistField}
diff --git a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/RelationFromManyFieldInput.tsx b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/RelationFromManyFieldInput.tsx
index ee489f663..93b84a8cc 100644
--- a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/RelationFromManyFieldInput.tsx
+++ b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/RelationFromManyFieldInput.tsx
@@ -10,6 +10,7 @@ import { FieldContext } from '@/object-record/record-field/contexts/FieldContext
 import { useRelationField } from '@/object-record/record-field/meta-types/hooks/useRelationField';
 import { useAddNewRecordAndOpenRightDrawer } from '@/object-record/record-field/meta-types/input/hooks/useAddNewRecordAndOpenRightDrawer';
 import { useUpdateRelationFromManyFieldInput } from '@/object-record/record-field/meta-types/input/hooks/useUpdateRelationFromManyFieldInput';
+import { getRelationFromManyFieldInputInstanceId } from '@/object-record/record-field/meta-types/input/utils/getRelationFromManyFieldInputInstanceId';
 import { recordFieldInputLayoutDirectionComponentState } from '@/object-record/record-field/states/recordFieldInputLayoutDirectionComponentState';
 import { FieldDefinition } from '@/object-record/record-field/types/FieldDefinition';
 import { FieldInputEvent } from '@/object-record/record-field/types/FieldInputEvent';
@@ -25,7 +26,10 @@ export const RelationFromManyFieldInput = ({
   onSubmit,
 }: RelationFromManyFieldInputProps) => {
   const { fieldDefinition, recordId } = useContext(FieldContext);
-  const recordPickerInstanceId = `relation-from-many-field-input-${recordId}`;
+  const recordPickerInstanceId = getRelationFromManyFieldInputInstanceId({
+    recordId,
+    fieldName: fieldDefinition.metadata.fieldName,
+  });
 
   const { updateRelation } = useUpdateRelationFromManyFieldInput();
   const fieldName = fieldDefinition.metadata.fieldName;
@@ -84,6 +88,7 @@ export const RelationFromManyFieldInput = ({
 
   return (
     <MultipleRecordPicker
+      focusId={recordPickerInstanceId}
       componentInstanceId={recordPickerInstanceId}
       onSubmit={handleSubmit}
       onChange={(morphItem) => {
diff --git a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/RelationToOneFieldInput.tsx b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/RelationToOneFieldInput.tsx
index cc0cbd261..7c6d1e09b 100644
--- a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/RelationToOneFieldInput.tsx
+++ b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/RelationToOneFieldInput.tsx
@@ -3,6 +3,7 @@ import { useRelationField } from '../../hooks/useRelationField';
 
 import { useObjectMetadataItem } from '@/object-metadata/hooks/useObjectMetadataItem';
 import { useAddNewRecordAndOpenRightDrawer } from '@/object-record/record-field/meta-types/input/hooks/useAddNewRecordAndOpenRightDrawer';
+import { getRelationToOneFieldInputInstanceId } from '@/object-record/record-field/meta-types/input/utils/getRelationToOneFieldInputInstanceId';
 import { recordFieldInputLayoutDirectionComponentState } from '@/object-record/record-field/states/recordFieldInputLayoutDirectionComponentState';
 import { recordFieldInputLayoutDirectionLoadingComponentState } from '@/object-record/record-field/states/recordFieldInputLayoutDirectionLoadingComponentState';
 import { FieldInputEvent } from '@/object-record/record-field/types/FieldInputEvent';
@@ -25,7 +26,10 @@ export const RelationToOneFieldInput = ({
 
   const persistField = usePersistField();
 
-  const recordPickerInstanceId = `relation-to-one-field-input-${recordId}-${fieldDefinition.metadata.fieldName}`;
+  const recordPickerInstanceId = getRelationToOneFieldInputInstanceId({
+    recordId,
+    fieldName: fieldDefinition.metadata.fieldName,
+  });
 
   const handleRecordSelected = (
     selectedRecord: SingleRecordPickerRecord | null | undefined,
@@ -64,6 +68,7 @@ export const RelationToOneFieldInput = ({
 
   return (
     <SingleRecordPicker
+      focusId={recordPickerInstanceId}
       componentInstanceId={recordPickerInstanceId}
       EmptyIcon={IconForbid}
       emptyLabel={'No ' + fieldDefinition.label}
diff --git a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/SelectFieldInput.tsx b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/SelectFieldInput.tsx
index 596e31a55..83b467d88 100644
--- a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/SelectFieldInput.tsx
+++ b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/SelectFieldInput.tsx
@@ -2,6 +2,7 @@ import { useClearField } from '@/object-record/record-field/hooks/useClearField'
 import { useSelectField } from '@/object-record/record-field/meta-types/hooks/useSelectField';
 import { SELECT_FIELD_INPUT_SELECTABLE_LIST_COMPONENT_INSTANCE_ID } from '@/object-record/record-field/meta-types/input/constants/SelectFieldInputSelectableListComponentInstanceId';
 import { FieldInputEvent } from '@/object-record/record-field/types/FieldInputEvent';
+import { getFieldInputInstanceId } from '@/object-record/record-field/utils/getFieldInputInstanceId';
 import { DEFAULT_CELL_SCOPE } from '@/object-record/record-table/record-table-cell/hooks/useOpenRecordTableCellV2';
 import { SelectInput } from '@/ui/field/input/components/SelectInput';
 import { useSelectableList } from '@/ui/layout/selectable-list/hooks/useSelectableList';
@@ -20,7 +21,8 @@ export const SelectFieldInput = ({
   onSubmit,
   onCancel,
 }: SelectFieldInputProps) => {
-  const { persistField, fieldDefinition, fieldValue } = useSelectField();
+  const { persistField, fieldDefinition, fieldValue, recordId } =
+    useSelectField();
 
   const [filteredOptions, setFilteredOptions] = useState<SelectOption[]>([]);
 
@@ -65,7 +67,10 @@ export const SelectFieldInput = ({
         SELECT_FIELD_INPUT_SELECTABLE_LIST_COMPONENT_INSTANCE_ID
       }
       selectableItemIdArray={optionIds}
-      hotkeyScope={DEFAULT_CELL_SCOPE.scope}
+      focusId={getFieldInputInstanceId(
+        recordId,
+        fieldDefinition.metadata.fieldName,
+      )}
       onEnter={(itemId) => {
         const option = filteredOptions.find(
           (option) => option.value === itemId,
diff --git a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/__stories__/RelationFromManyFieldInput.stories.tsx b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/__stories__/RelationFromManyFieldInput.stories.tsx
index 6dac1f107..701bb4039 100644
--- a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/__stories__/RelationFromManyFieldInput.stories.tsx
+++ b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/__stories__/RelationFromManyFieldInput.stories.tsx
@@ -18,9 +18,10 @@ import {
 import { CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSingular';
 import { FieldContext } from '@/object-record/record-field/contexts/FieldContext';
 import { useOpenFieldInputEditMode } from '@/object-record/record-field/hooks/useOpenFieldInputEditMode';
+import { getRelationFromManyFieldInputInstanceId } from '@/object-record/record-field/meta-types/input/utils/getRelationFromManyFieldInputInstanceId';
 import { RecordFieldComponentInstanceContext } from '@/object-record/record-field/states/contexts/RecordFieldComponentInstanceContext';
-import { MultipleRecordPickerHotkeyScope } from '@/object-record/record-picker/multiple-record-picker/types/MultipleRecordPickerHotkeyScope';
 import { recordStoreFamilySelector } from '@/object-record/record-store/states/selectors/recordStoreFamilySelector';
+import { DropdownHotkeyScope } from '@/ui/layout/dropdown/constants/DropdownHotkeyScope';
 import { FieldMetadataType } from 'twenty-shared/types';
 import { RelationType } from '~/generated-metadata/graphql';
 
@@ -71,7 +72,7 @@ const RelationManyFieldInputWithContext = () => {
   useEffect(() => {
     setRecordStoreFieldValue([]);
 
-    setHotKeyScope(MultipleRecordPickerHotkeyScope.MultipleRecordPicker);
+    setHotKeyScope(DropdownHotkeyScope.Dropdown);
     openFieldInput({
       fieldDefinition,
       recordId: 'recordId',
@@ -87,7 +88,10 @@ const RelationManyFieldInputWithContext = () => {
     <div>
       <RecordFieldComponentInstanceContext.Provider
         value={{
-          instanceId: 'relation-from-many-field-record-id-people',
+          instanceId: getRelationFromManyFieldInputInstanceId({
+            recordId: 'recordId',
+            fieldName: 'people',
+          }),
         }}
       >
         <FieldContext.Provider
diff --git a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/__stories__/RelationToOneFieldInput.stories.tsx b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/__stories__/RelationToOneFieldInput.stories.tsx
index aa7d47097..3b3573db4 100644
--- a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/__stories__/RelationToOneFieldInput.stories.tsx
+++ b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/components/__stories__/RelationToOneFieldInput.stories.tsx
@@ -5,7 +5,6 @@ import { useSetRecoilState } from 'recoil';
 
 import { currentWorkspaceMemberState } from '@/auth/states/currentWorkspaceMemberState';
 import { currentWorkspaceState } from '@/auth/states/currentWorkspaceState';
-import { useSetHotkeyScope } from '@/ui/utilities/hotkey/hooks/useSetHotkeyScope';
 import { ComponentWithRecoilScopeDecorator } from '~/testing/decorators/ComponentWithRecoilScopeDecorator';
 import { ObjectMetadataItemsDecorator } from '~/testing/decorators/ObjectMetadataItemsDecorator';
 import { SnackBarDecorator } from '~/testing/decorators/SnackBarDecorator';
@@ -17,9 +16,12 @@ import {
 
 import { CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSingular';
 import { FieldContext } from '@/object-record/record-field/contexts/FieldContext';
+import { getRelationToOneFieldInputInstanceId } from '@/object-record/record-field/meta-types/input/utils/getRelationToOneFieldInputInstanceId';
 import { RecordFieldComponentInstanceContext } from '@/object-record/record-field/states/contexts/RecordFieldComponentInstanceContext';
 import { recordFieldInputLayoutDirectionLoadingComponentState } from '@/object-record/record-field/states/recordFieldInputLayoutDirectionLoadingComponentState';
-import { SingleRecordPickerHotkeyScope } from '@/object-record/record-picker/single-record-picker/types/SingleRecordPickerHotkeyScope';
+import { DropdownHotkeyScope } from '@/ui/layout/dropdown/constants/DropdownHotkeyScope';
+import { usePushFocusItemToFocusStack } from '@/ui/utilities/focus/hooks/usePushFocusItemToFocusStack';
+import { FocusComponentType } from '@/ui/utilities/focus/types/FocusComponentType';
 import { useSetRecoilComponentStateV2 } from '@/ui/utilities/state/component-state/hooks/useSetRecoilComponentStateV2';
 import { FieldMetadataType } from 'twenty-shared/types';
 import { getCanvasElementForDropdownTesting } from 'twenty-ui/testing';
@@ -62,11 +64,30 @@ const RelationToOneFieldInputWithContext = ({
   onSubmit,
   onCancel,
 }: RelationToOneFieldInputWithContextProps) => {
-  const setHotKeyScope = useSetHotkeyScope();
+  const { pushFocusItemToFocusStack } = usePushFocusItemToFocusStack();
 
   useEffect(() => {
-    setHotKeyScope(SingleRecordPickerHotkeyScope.SingleRecordPicker);
-  }, [setHotKeyScope]);
+    pushFocusItemToFocusStack({
+      focusId: getRelationToOneFieldInputInstanceId({
+        recordId: '123',
+        fieldName: 'Relation',
+      }),
+      component: {
+        type: FocusComponentType.DROPDOWN,
+        instanceId: getRelationToOneFieldInputInstanceId({
+          recordId: '123',
+          fieldName: 'Relation',
+        }),
+      },
+      hotkeyScope: {
+        scope: DropdownHotkeyScope.Dropdown,
+      },
+      memoizeKey: getRelationToOneFieldInputInstanceId({
+        recordId: '123',
+        fieldName: 'Relation',
+      }),
+    });
+  }, [pushFocusItemToFocusStack]);
 
   return (
     <div>
diff --git a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/hooks/useOpenRelationFromManyFieldInput.tsx b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/hooks/useOpenRelationFromManyFieldInput.tsx
index 0f17035ef..10504aa69 100644
--- a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/hooks/useOpenRelationFromManyFieldInput.tsx
+++ b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/hooks/useOpenRelationFromManyFieldInput.tsx
@@ -1,4 +1,5 @@
 import { objectMetadataItemsState } from '@/object-metadata/states/objectMetadataItemsState';
+import { getRelationFromManyFieldInputInstanceId } from '@/object-record/record-field/meta-types/input/utils/getRelationFromManyFieldInputInstanceId';
 import {
   FieldRelationFromManyValue,
   FieldRelationValue,
@@ -6,17 +7,18 @@ import {
 import { useMultipleRecordPickerPerformSearch } from '@/object-record/record-picker/multiple-record-picker/hooks/useMultipleRecordPickerPerformSearch';
 import { multipleRecordPickerPickableMorphItemsComponentState } from '@/object-record/record-picker/multiple-record-picker/states/multipleRecordPickerPickableMorphItemsComponentState';
 import { multipleRecordPickerSearchableObjectMetadataItemsComponentState } from '@/object-record/record-picker/multiple-record-picker/states/multipleRecordPickerSearchableObjectMetadataItemsComponentState';
-import { MultipleRecordPickerHotkeyScope } from '@/object-record/record-picker/multiple-record-picker/types/MultipleRecordPickerHotkeyScope';
 import { RecordPickerPickableMorphItem } from '@/object-record/record-picker/types/RecordPickerPickableMorphItem';
 import { recordStoreFamilyState } from '@/object-record/record-store/states/recordStoreFamilyState';
 import { recordStoreFamilySelector } from '@/object-record/record-store/states/selectors/recordStoreFamilySelector';
-import { usePreviousHotkeyScope } from '@/ui/utilities/hotkey/hooks/usePreviousHotkeyScope';
+import { DropdownHotkeyScope } from '@/ui/layout/dropdown/constants/DropdownHotkeyScope';
+import { usePushFocusItemToFocusStack } from '@/ui/utilities/focus/hooks/usePushFocusItemToFocusStack';
+import { FocusComponentType } from '@/ui/utilities/focus/types/FocusComponentType';
 import { useRecoilCallback } from 'recoil';
 
 export const useOpenRelationFromManyFieldInput = () => {
   const { performSearch } = useMultipleRecordPickerPerformSearch();
 
-  const { setHotkeyScopeAndMemorizePreviousScope } = usePreviousHotkeyScope();
+  const { pushFocusItemToFocusStack } = usePushFocusItemToFocusStack();
 
   const openRelationFromManyFieldInput = useRecoilCallback(
     ({ set, snapshot }) =>
@@ -29,7 +31,10 @@ export const useOpenRelationFromManyFieldInput = () => {
         objectNameSingular: string;
         recordId: string;
       }) => {
-        const recordPickerInstanceId = `relation-from-many-field-input-${recordId}`;
+        const recordPickerInstanceId = getRelationFromManyFieldInputInstanceId({
+          recordId,
+          fieldName,
+        });
 
         const fieldValue = snapshot
           .getLoadable<FieldRelationValue<FieldRelationFromManyValue>>(
@@ -88,11 +93,19 @@ export const useOpenRelationFromManyFieldInput = () => {
           forcePickableMorphItems: pickableMorphItems,
         });
 
-        setHotkeyScopeAndMemorizePreviousScope({
-          scope: MultipleRecordPickerHotkeyScope.MultipleRecordPicker,
+        pushFocusItemToFocusStack({
+          focusId: recordPickerInstanceId,
+          component: {
+            type: FocusComponentType.DROPDOWN,
+            instanceId: recordPickerInstanceId,
+          },
+          hotkeyScope: {
+            scope: DropdownHotkeyScope.Dropdown,
+          },
+          memoizeKey: recordPickerInstanceId,
         });
       },
-    [performSearch, setHotkeyScopeAndMemorizePreviousScope],
+    [performSearch, pushFocusItemToFocusStack],
   );
 
   return { openRelationFromManyFieldInput };
diff --git a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/hooks/useOpenRelationToOneFieldInput.tsx b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/hooks/useOpenRelationToOneFieldInput.tsx
index 2428cdc62..b163f83c8 100644
--- a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/hooks/useOpenRelationToOneFieldInput.tsx
+++ b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/hooks/useOpenRelationToOneFieldInput.tsx
@@ -1,21 +1,26 @@
+import { getRelationToOneFieldInputInstanceId } from '@/object-record/record-field/meta-types/input/utils/getRelationToOneFieldInputInstanceId';
 import {
   FieldRelationToOneValue,
   FieldRelationValue,
 } from '@/object-record/record-field/types/FieldMetadata';
 import { singleRecordPickerSelectedIdComponentState } from '@/object-record/record-picker/single-record-picker/states/singleRecordPickerSelectedIdComponentState';
-import { SingleRecordPickerHotkeyScope } from '@/object-record/record-picker/single-record-picker/types/SingleRecordPickerHotkeyScope';
 import { recordStoreFamilySelector } from '@/object-record/record-store/states/selectors/recordStoreFamilySelector';
-import { usePreviousHotkeyScope } from '@/ui/utilities/hotkey/hooks/usePreviousHotkeyScope';
+import { DropdownHotkeyScope } from '@/ui/layout/dropdown/constants/DropdownHotkeyScope';
+import { usePushFocusItemToFocusStack } from '@/ui/utilities/focus/hooks/usePushFocusItemToFocusStack';
+import { FocusComponentType } from '@/ui/utilities/focus/types/FocusComponentType';
 import { useRecoilCallback } from 'recoil';
 import { isDefined } from 'twenty-shared/utils';
 
 export const useOpenRelationToOneFieldInput = () => {
-  const { setHotkeyScopeAndMemorizePreviousScope } = usePreviousHotkeyScope();
+  const { pushFocusItemToFocusStack } = usePushFocusItemToFocusStack();
 
   const openRelationToOneFieldInput = useRecoilCallback(
     ({ set, snapshot }) =>
       ({ fieldName, recordId }: { fieldName: string; recordId: string }) => {
-        const recordPickerInstanceId = `relation-to-one-field-input-${recordId}-${fieldName}`;
+        const recordPickerInstanceId = getRelationToOneFieldInputInstanceId({
+          recordId,
+          fieldName,
+        });
         const fieldValue = snapshot
           .getLoadable<FieldRelationValue<FieldRelationToOneValue>>(
             recordStoreFamilySelector({
@@ -34,11 +39,18 @@ export const useOpenRelationToOneFieldInput = () => {
           );
         }
 
-        setHotkeyScopeAndMemorizePreviousScope({
-          scope: SingleRecordPickerHotkeyScope.SingleRecordPicker,
+        pushFocusItemToFocusStack({
+          focusId: recordPickerInstanceId,
+          component: {
+            type: FocusComponentType.OPEN_FIELD_INPUT,
+            instanceId: recordPickerInstanceId,
+          },
+          // TODO: Remove this once we've fully migrated away from hotkey scopes
+          hotkeyScope: { scope: DropdownHotkeyScope.Dropdown },
+          memoizeKey: recordPickerInstanceId,
         });
       },
-    [setHotkeyScopeAndMemorizePreviousScope],
+    [pushFocusItemToFocusStack],
   );
 
   return { openRelationToOneFieldInput };
diff --git a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/types/RelationPickerHotkeyScope.ts b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/types/RelationPickerHotkeyScope.ts
deleted file mode 100644
index eb728eb85..000000000
--- a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/types/RelationPickerHotkeyScope.ts
+++ /dev/null
@@ -1,3 +0,0 @@
-export enum RelationPickerHotkeyScope {
-  AddNew = 'add-new',
-}
diff --git a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/utils/getRelationFromManyFieldInputInstanceId.ts b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/utils/getRelationFromManyFieldInputInstanceId.ts
new file mode 100644
index 000000000..1f90109e1
--- /dev/null
+++ b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/utils/getRelationFromManyFieldInputInstanceId.ts
@@ -0,0 +1,9 @@
+export const getRelationFromManyFieldInputInstanceId = ({
+  recordId,
+  fieldName,
+}: {
+  recordId: string;
+  fieldName: string;
+}): string => {
+  return `relation-from-many-field-input-${recordId}-${fieldName}`;
+};
diff --git a/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/utils/getRelationToOneFieldInputInstanceId.ts b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/utils/getRelationToOneFieldInputInstanceId.ts
new file mode 100644
index 000000000..2e629f625
--- /dev/null
+++ b/packages/twenty-front/src/modules/object-record/record-field/meta-types/input/utils/getRelationToOneFieldInputInstanceId.ts
@@ -0,0 +1,9 @@
+export const getRelationToOneFieldInputInstanceId = ({
+  recordId,
+  fieldName,
+}: {
+  recordId: string;
+  fieldName: string;
+}): string => {
+  return `relation-to-one-field-input-${recordId}-${fieldName}`;
+};
diff --git a/packages/twenty-front/src/modules/object-record/record-field/utils/getFieldInputInstanceId.ts b/packages/twenty-front/src/modules/object-record/record-field/utils/getFieldInputInstanceId.ts
new file mode 100644
index 000000000..3a5f0bba9
--- /dev/null
+++ b/packages/twenty-front/src/modules/object-record/record-field/utils/getFieldInputInstanceId.ts
@@ -0,0 +1,6 @@
+export const getFieldInputInstanceId = (
+  recordId: string,
+  fieldName: string,
+) => {
+  return `${recordId}-${fieldName}`;
+};
diff --git a/packages/twenty-front/src/modules/object-record/record-picker/multiple-record-picker/components/MultipleRecordPicker.tsx b/packages/twenty-front/src/modules/object-record/record-picker/multiple-record-picker/components/MultipleRecordPicker.tsx
index d8a121c70..c2cb1b64a 100644
--- a/packages/twenty-front/src/modules/object-record/record-picker/multiple-record-picker/components/MultipleRecordPicker.tsx
+++ b/packages/twenty-front/src/modules/object-record/record-picker/multiple-record-picker/components/MultipleRecordPicker.tsx
@@ -4,7 +4,6 @@ import { MultipleRecordPickerSearchInput } from '@/object-record/record-picker/m
 import { MultipleRecordPickerComponentInstanceContext } from '@/object-record/record-picker/multiple-record-picker/states/contexts/MultipleRecordPickerComponentInstanceContext';
 import { multipleRecordPickerPickableMorphItemsComponentState } from '@/object-record/record-picker/multiple-record-picker/states/multipleRecordPickerPickableMorphItemsComponentState';
 import { multipleRecordPickerSearchFilterComponentState } from '@/object-record/record-picker/multiple-record-picker/states/multipleRecordPickerSearchFilterComponentState';
-import { MultipleRecordPickerHotkeyScope } from '@/object-record/record-picker/multiple-record-picker/types/MultipleRecordPickerHotkeyScope';
 import { getMultipleRecordPickerSelectableListId } from '@/object-record/record-picker/multiple-record-picker/utils/getMultipleRecordPickerSelectableListId';
 import { RecordPickerLayoutDirection } from '@/object-record/record-picker/types/RecordPickerLayoutDirection';
 import { RecordPickerPickableMorphItem } from '@/object-record/record-picker/types/RecordPickerPickableMorphItem';
@@ -12,10 +11,11 @@ import { useHasObjectReadOnlyPermission } from '@/settings/roles/hooks/useHasObj
 import { CreateNewButton } from '@/ui/input/relation-picker/components/CreateNewButton';
 import { DropdownContent } from '@/ui/layout/dropdown/components/DropdownContent';
 import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer';
+import { DropdownHotkeyScope } from '@/ui/layout/dropdown/constants/DropdownHotkeyScope';
 import { SelectableListItem } from '@/ui/layout/selectable-list/components/SelectableListItem';
 import { useSelectableList } from '@/ui/layout/selectable-list/hooks/useSelectableList';
+import { useHotkeysOnFocusedElement } from '@/ui/utilities/hotkey/hooks/useHotkeysOnFocusedElement';
 import { usePreviousHotkeyScope } from '@/ui/utilities/hotkey/hooks/usePreviousHotkeyScope';
-import { useScopedHotkeys } from '@/ui/utilities/hotkey/hooks/useScopedHotkeys';
 import { useRecoilComponentCallbackStateV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentCallbackStateV2';
 import styled from '@emotion/styled';
 import { useRef } from 'react';
@@ -36,6 +36,7 @@ type MultipleRecordPickerProps = {
   layoutDirection?: RecordPickerLayoutDirection;
   componentInstanceId: string;
   onClickOutside: () => void;
+  focusId: string;
 };
 
 export const MultipleRecordPicker = ({
@@ -45,6 +46,7 @@ export const MultipleRecordPicker = ({
   onClickOutside,
   layoutDirection = 'search-bar-on-bottom',
   componentInstanceId,
+  focusId,
 }: MultipleRecordPickerProps) => {
   const { goBackToPreviousHotkeyScope } = usePreviousHotkeyScope();
 
@@ -94,14 +96,15 @@ export const MultipleRecordPicker = ({
     resetState();
   };
 
-  useScopedHotkeys(
-    Key.Escape,
-    () => {
+  useHotkeysOnFocusedElement({
+    keys: [Key.Escape],
+    callback: () => {
       handleSubmit();
     },
-    MultipleRecordPickerHotkeyScope.MultipleRecordPicker,
-    [handleSubmit],
-  );
+    focusId,
+    scope: DropdownHotkeyScope.Dropdown,
+    dependencies: [handleSubmit],
+  });
 
   const containerRef = useRef<HTMLDivElement>(null);
 
@@ -140,13 +143,19 @@ export const MultipleRecordPicker = ({
         {layoutDirection === 'search-bar-on-bottom' && (
           <>
             {createNewButtonSection}
-            <MultipleRecordPickerItemsDisplay onChange={onChange} />
+            <MultipleRecordPickerItemsDisplay
+              onChange={onChange}
+              focusId={focusId}
+            />
           </>
         )}
         <MultipleRecordPickerSearchInput />
         {layoutDirection === 'search-bar-on-top' && (
           <>
-            <MultipleRecordPickerItemsDisplay onChange={onChange} />
+            <MultipleRecordPickerItemsDisplay
+              onChange={onChange}
+              focusId={focusId}
+            />
             {createNewButtonSection}
           </>
         )}
diff --git a/packages/twenty-front/src/modules/object-record/record-picker/multiple-record-picker/components/MultipleRecordPickerItemsDisplay.tsx b/packages/twenty-front/src/modules/object-record/record-picker/multiple-record-picker/components/MultipleRecordPickerItemsDisplay.tsx
index 5649382a9..de5a6b6ae 100644
--- a/packages/twenty-front/src/modules/object-record/record-picker/multiple-record-picker/components/MultipleRecordPickerItemsDisplay.tsx
+++ b/packages/twenty-front/src/modules/object-record/record-picker/multiple-record-picker/components/MultipleRecordPickerItemsDisplay.tsx
@@ -10,8 +10,10 @@ import { useRecoilComponentValueV2 } from '@/ui/utilities/state/component-state/
 
 export const MultipleRecordPickerItemsDisplay = ({
   onChange,
+  focusId,
 }: {
   onChange?: (morphItem: RecordPickerPickableMorphItem) => void;
+  focusId: string;
 }) => {
   const componentInstanceId = useAvailableComponentInstanceIdOrThrow(
     MultipleRecordPickerComponentInstanceContext,
@@ -33,7 +35,7 @@ export const MultipleRecordPickerItemsDisplay = ({
       {isLoading && itemsLength === 0 ? (
         <DropdownMenuSkeletonItem />
       ) : (
-        <MultipleRecordPickerMenuItems onChange={onChange} />
+        <MultipleRecordPickerMenuItems onChange={onChange} focusId={focusId} />
       )}
       <DropdownMenuSeparator />
     </>
diff --git a/packages/twenty-front/src/modules/object-record/record-picker/multiple-record-picker/components/MultipleRecordPickerMenuItems.tsx b/packages/twenty-front/src/modules/object-record/record-picker/multiple-record-picker/components/MultipleRecordPickerMenuItems.tsx
index 4e0c0cd89..ede0533e3 100644
--- a/packages/twenty-front/src/modules/object-record/record-picker/multiple-record-picker/components/MultipleRecordPickerMenuItems.tsx
+++ b/packages/twenty-front/src/modules/object-record/record-picker/multiple-record-picker/components/MultipleRecordPickerMenuItems.tsx
@@ -6,10 +6,10 @@ import { MultipleRecordPickerMenuItem } from '@/object-record/record-picker/mult
 import { MultipleRecordPickerComponentInstanceContext } from '@/object-record/record-picker/multiple-record-picker/states/contexts/MultipleRecordPickerComponentInstanceContext';
 import { multipleRecordPickerPickableMorphItemsComponentState } from '@/object-record/record-picker/multiple-record-picker/states/multipleRecordPickerPickableMorphItemsComponentState';
 import { multipleRecordPickerPickableRecordIdsMatchingSearchComponentSelector } from '@/object-record/record-picker/multiple-record-picker/states/selectors/multipleRecordPickerPickableRecordIdsMatchingSearchComponentSelector';
-import { MultipleRecordPickerHotkeyScope } from '@/object-record/record-picker/multiple-record-picker/types/MultipleRecordPickerHotkeyScope';
 import { getMultipleRecordPickerSelectableListId } from '@/object-record/record-picker/multiple-record-picker/utils/getMultipleRecordPickerSelectableListId';
 import { RecordPickerPickableMorphItem } from '@/object-record/record-picker/types/RecordPickerPickableMorphItem';
 import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer';
+import { DropdownHotkeyScope } from '@/ui/layout/dropdown/constants/DropdownHotkeyScope';
 import { SelectableList } from '@/ui/layout/selectable-list/components/SelectableList';
 import { SelectableListItem } from '@/ui/layout/selectable-list/components/SelectableListItem';
 import { useSelectableList } from '@/ui/layout/selectable-list/hooks/useSelectableList';
@@ -25,10 +25,12 @@ export const StyledSelectableItem = styled(SelectableListItem)`
 
 type MultipleRecordPickerMenuItemsProps = {
   onChange?: (morphItem: RecordPickerPickableMorphItem) => void;
+  focusId: string;
 };
 
 export const MultipleRecordPickerMenuItems = ({
   onChange,
+  focusId,
 }: MultipleRecordPickerMenuItemsProps) => {
   const componentInstanceId = useAvailableComponentInstanceIdOrThrow(
     MultipleRecordPickerComponentInstanceContext,
@@ -85,7 +87,8 @@ export const MultipleRecordPickerMenuItems = ({
         <SelectableList
           selectableListInstanceId={selectableListComponentInstanceId}
           selectableItemIdArray={pickableRecordIds}
-          hotkeyScope={MultipleRecordPickerHotkeyScope.MultipleRecordPicker}
+          focusId={focusId}
+          hotkeyScope={DropdownHotkeyScope.Dropdown}
         >
           {pickableRecordIds.map((recordId) => {
             return (
diff --git a/packages/twenty-front/src/modules/object-record/record-picker/multiple-record-picker/types/MultipleRecordPickerHotkeyScope.ts b/packages/twenty-front/src/modules/object-record/record-picker/multiple-record-picker/types/MultipleRecordPickerHotkeyScope.ts
deleted file mode 100644
index c00ad72e4..000000000
--- a/packages/twenty-front/src/modules/object-record/record-picker/multiple-record-picker/types/MultipleRecordPickerHotkeyScope.ts
+++ /dev/null
@@ -1,3 +0,0 @@
-export enum MultipleRecordPickerHotkeyScope {
-  MultipleRecordPicker = 'multiple-record-picker',
-}
diff --git a/packages/twenty-front/src/modules/object-record/record-picker/single-record-picker/components/SingleRecordPicker.tsx b/packages/twenty-front/src/modules/object-record/record-picker/single-record-picker/components/SingleRecordPicker.tsx
index 649088830..ce16d779c 100644
--- a/packages/twenty-front/src/modules/object-record/record-picker/single-record-picker/components/SingleRecordPicker.tsx
+++ b/packages/twenty-front/src/modules/object-record/record-picker/single-record-picker/components/SingleRecordPicker.tsx
@@ -28,6 +28,7 @@ export const SingleRecordPicker = ({
   componentInstanceId,
   layoutDirection,
   dropdownWidth,
+  focusId,
 }: SingleRecordPickerProps) => {
   const containerRef = useRef<HTMLDivElement>(null);
 
@@ -71,6 +72,7 @@ export const SingleRecordPicker = ({
     >
       <DropdownContent ref={containerRef} widthInPixels={dropdownWidth}>
         <SingleRecordPickerMenuItemsWithSearch
+          focusId={focusId}
           {...{
             EmptyIcon,
             emptyLabel,
diff --git a/packages/twenty-front/src/modules/object-record/record-picker/single-record-picker/components/SingleRecordPickerMenuItems.tsx b/packages/twenty-front/src/modules/object-record/record-picker/single-record-picker/components/SingleRecordPickerMenuItems.tsx
index 9d073ac26..fbda69791 100644
--- a/packages/twenty-front/src/modules/object-record/record-picker/single-record-picker/components/SingleRecordPickerMenuItems.tsx
+++ b/packages/twenty-front/src/modules/object-record/record-picker/single-record-picker/components/SingleRecordPickerMenuItems.tsx
@@ -4,16 +4,16 @@ import { Key } from 'ts-key-enum';
 import { DropdownMenuSkeletonItem } from '@/ui/input/relation-picker/components/skeletons/DropdownMenuSkeletonItem';
 import { SelectableList } from '@/ui/layout/selectable-list/components/SelectableList';
 import { useSelectableList } from '@/ui/layout/selectable-list/hooks/useSelectableList';
-import { useScopedHotkeys } from '@/ui/utilities/hotkey/hooks/useScopedHotkeys';
 
 import { SingleRecordPickerMenuItem } from '@/object-record/record-picker/single-record-picker/components/SingleRecordPickerMenuItem';
 import { SingleRecordPickerComponentInstanceContext } from '@/object-record/record-picker/single-record-picker/states/contexts/SingleRecordPickerComponentInstanceContext';
 import { singleRecordPickerSelectedIdComponentState } from '@/object-record/record-picker/single-record-picker/states/singleRecordPickerSelectedIdComponentState';
-import { SingleRecordPickerHotkeyScope } from '@/object-record/record-picker/single-record-picker/types/SingleRecordPickerHotkeyScope';
 import { SingleRecordPickerRecord } from '@/object-record/record-picker/single-record-picker/types/SingleRecordPickerRecord';
 import { getSingleRecordPickerSelectableListId } from '@/object-record/record-picker/single-record-picker/utils/getSingleRecordPickerSelectableListId';
+import { DropdownHotkeyScope } from '@/ui/layout/dropdown/constants/DropdownHotkeyScope';
 import { SelectableListItem } from '@/ui/layout/selectable-list/components/SelectableListItem';
 import { isSelectedItemIdComponentFamilySelector } from '@/ui/layout/selectable-list/states/selectors/isSelectedItemIdComponentFamilySelector';
+import { useHotkeysOnFocusedElement } from '@/ui/utilities/hotkey/hooks/useHotkeysOnFocusedElement';
 import { useAvailableComponentInstanceIdOrThrow } from '@/ui/utilities/state/component-state/hooks/useAvailableComponentInstanceIdOrThrow';
 import { useRecoilComponentFamilyValueV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentFamilyValueV2';
 import { useRecoilComponentStateV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentStateV2';
@@ -29,7 +29,7 @@ export type SingleRecordPickerMenuItemsProps = {
   onCancel?: () => void;
   onRecordSelected: (entity?: SingleRecordPickerRecord) => void;
   selectedRecord?: SingleRecordPickerRecord;
-  hotkeyScope?: string;
+  focusId: string;
 };
 
 export const SingleRecordPickerMenuItems = ({
@@ -40,7 +40,7 @@ export const SingleRecordPickerMenuItems = ({
   onCancel,
   onRecordSelected,
   selectedRecord,
-  hotkeyScope = SingleRecordPickerHotkeyScope.SingleRecordPicker,
+  focusId,
 }: SingleRecordPickerMenuItemsProps) => {
   const selectNone = emptyLabel
     ? {
@@ -77,15 +77,16 @@ export const SingleRecordPickerMenuItems = ({
     'select-none',
   );
 
-  useScopedHotkeys(
-    [Key.Escape],
-    () => {
+  useHotkeysOnFocusedElement({
+    keys: Key.Escape,
+    callback: () => {
       resetSelectedItem();
       onCancel?.();
     },
-    hotkeyScope,
-    [onCancel, resetSelectedItem],
-  );
+    focusId,
+    scope: DropdownHotkeyScope.Dropdown,
+    dependencies: [onCancel, resetSelectedItem],
+  });
 
   const selectableItemIds = recordsInDropdown.map((entity) => entity.id);
   const [selectedRecordId, setSelectedRecordId] = useRecoilComponentStateV2(
@@ -96,7 +97,8 @@ export const SingleRecordPickerMenuItems = ({
     <SelectableList
       selectableListInstanceId={selectableListComponentInstanceId}
       selectableItemIdArray={selectableItemIds}
-      hotkeyScope={hotkeyScope}
+      hotkeyScope={DropdownHotkeyScope.Dropdown}
+      focusId={focusId}
     >
       {loading ? (
         <DropdownMenuSkeletonItem />
diff --git a/packages/twenty-front/src/modules/object-record/record-picker/single-record-picker/components/SingleRecordPickerMenuItemsWithSearch.tsx b/packages/twenty-front/src/modules/object-record/record-picker/single-record-picker/components/SingleRecordPickerMenuItemsWithSearch.tsx
index 2e22f4b5e..2c5d4d438 100644
--- a/packages/twenty-front/src/modules/object-record/record-picker/single-record-picker/components/SingleRecordPickerMenuItemsWithSearch.tsx
+++ b/packages/twenty-front/src/modules/object-record/record-picker/single-record-picker/components/SingleRecordPickerMenuItemsWithSearch.tsx
@@ -26,6 +26,7 @@ export type SingleRecordPickerMenuItemsWithSearchProps = {
   objectNameSingular: string;
   recordPickerInstanceId?: string;
   layoutDirection?: RecordPickerLayoutDirection;
+  focusId: string;
 } & Pick<
   SingleRecordPickerMenuItemsProps,
   | 'EmptyIcon'
@@ -44,6 +45,7 @@ export const SingleRecordPickerMenuItemsWithSearch = ({
   onRecordSelected,
   objectNameSingular,
   layoutDirection = 'search-bar-on-top',
+  focusId,
 }: SingleRecordPickerMenuItemsWithSearchProps) => {
   const { handleSearchFilterChange } = useSingleRecordPickerSearch();
 
@@ -96,9 +98,11 @@ export const SingleRecordPickerMenuItemsWithSearch = ({
               <DropdownMenuSeparator />
             </>
           )}
+
           <DropdownMenuItemsContainer hasMaxHeight>
             {searchHasNoResults && <RecordPickerNoRecordFoundMenuItem />}
             <SingleRecordPickerMenuItems
+              focusId={focusId}
               recordsToSelect={records.recordsToSelect}
               loading={records.loading}
               selectedRecord={records.selectedRecords?.[0]}
@@ -123,6 +127,7 @@ export const SingleRecordPickerMenuItemsWithSearch = ({
           <DropdownMenuSeparator />
           <DropdownMenuItemsContainer hasMaxHeight>
             <SingleRecordPickerMenuItems
+              focusId={focusId}
               recordsToSelect={records.recordsToSelect}
               loading={records.loading}
               selectedRecord={records.selectedRecords?.[0]}
diff --git a/packages/twenty-front/src/modules/object-record/record-picker/single-record-picker/types/SingleRecordPickerHotkeyScope.ts b/packages/twenty-front/src/modules/object-record/record-picker/single-record-picker/types/SingleRecordPickerHotkeyScope.ts
deleted file mode 100644
index 2f85b0eb2..000000000
--- a/packages/twenty-front/src/modules/object-record/record-picker/single-record-picker/types/SingleRecordPickerHotkeyScope.ts
+++ /dev/null
@@ -1,3 +0,0 @@
-export enum SingleRecordPickerHotkeyScope {
-  SingleRecordPicker = 'single-record-picker',
-}
diff --git a/packages/twenty-front/src/modules/object-record/record-show/record-detail-section/components/RecordDetailRelationRecordsListItem.tsx b/packages/twenty-front/src/modules/object-record/record-show/record-detail-section/components/RecordDetailRelationRecordsListItem.tsx
index bb772e259..173e5ebd7 100644
--- a/packages/twenty-front/src/modules/object-record/record-show/record-detail-section/components/RecordDetailRelationRecordsListItem.tsx
+++ b/packages/twenty-front/src/modules/object-record/record-show/record-detail-section/components/RecordDetailRelationRecordsListItem.tsx
@@ -285,7 +285,6 @@ export const RecordDetailRelationRecordsListItem = ({
                   </DropdownMenuItemsContainer>
                 </DropdownContent>
               }
-              dropdownHotkeyScope={{ scope: dropdownScopeId }}
             />
           </DropdownScope>
         )}
diff --git a/packages/twenty-front/src/modules/object-record/record-show/record-detail-section/components/RecordDetailRelationSectionDropdown.tsx b/packages/twenty-front/src/modules/object-record/record-show/record-detail-section/components/RecordDetailRelationSectionDropdown.tsx
index f6841d6df..2cc0fb26f 100644
--- a/packages/twenty-front/src/modules/object-record/record-show/record-detail-section/components/RecordDetailRelationSectionDropdown.tsx
+++ b/packages/twenty-front/src/modules/object-record/record-show/record-detail-section/components/RecordDetailRelationSectionDropdown.tsx
@@ -216,10 +216,10 @@ export const RecordDetailRelationSectionDropdown = ({
             accent="tertiary"
           />
         }
-        dropdownHotkeyScope={{ scope: dropdownId }}
         dropdownComponents={
           isToOneObject ? (
             <SingleRecordPicker
+              focusId={dropdownId}
               componentInstanceId={dropdownId}
               EmptyIcon={IconForbid}
               onRecordSelected={handleRelationPickerEntitySelected}
@@ -235,6 +235,7 @@ export const RecordDetailRelationSectionDropdown = ({
             />
           ) : (
             <MultipleRecordPicker
+              focusId={dropdownId}
               componentInstanceId={dropdownId}
               onCreate={() => {
                 closeDropdown();
diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/hooks/internal/useCloseRecordTableCellInGroup.ts b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/hooks/internal/useCloseRecordTableCellInGroup.ts
index f045bea06..14c309e6a 100644
--- a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/hooks/internal/useCloseRecordTableCellInGroup.ts
+++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/hooks/internal/useCloseRecordTableCellInGroup.ts
@@ -8,6 +8,7 @@ import { useClickOutsideListener } from '@/ui/utilities/pointer-event/hooks/useC
 import { useRecordTableContextOrThrow } from '@/object-record/record-table/contexts/RecordTableContext';
 import { useCloseCurrentTableCellInEditMode } from '@/object-record/record-table/hooks/internal/useCloseCurrentTableCellInEditMode';
 import { TableHotkeyScope } from '@/object-record/record-table/types/TableHotkeyScope';
+import { useResetFocusStack } from '@/ui/utilities/focus/hooks/useResetFocusStack';
 
 export const useCloseRecordTableCellInGroup = () => {
   const { recordTableId } = useRecordTableContextOrThrow();
@@ -22,11 +23,17 @@ export const useCloseRecordTableCellInGroup = () => {
   const closeCurrentTableCellInEditMode =
     useCloseCurrentTableCellInEditMode(recordTableId);
 
+  const { resetFocusStack } = useResetFocusStack();
+
   const closeTableCellInGroup = useRecoilCallback(
     () => () => {
       toggleClickOutside(true);
       setDragSelectionStartEnabled(true);
       closeCurrentTableCellInEditMode();
+
+      // TODO: Remove this once we've fully migrated away from hotkey scopes
+      resetFocusStack();
+
       setHotkeyScope(TableHotkeyScope.TableFocus, {
         goto: true,
         keyboardShortcutMenu: true,
@@ -35,6 +42,7 @@ export const useCloseRecordTableCellInGroup = () => {
     },
     [
       closeCurrentTableCellInEditMode,
+      resetFocusStack,
       setDragSelectionStartEnabled,
       setHotkeyScope,
       toggleClickOutside,
diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/hooks/internal/useCloseRecordTableCellNoGroup.ts b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/hooks/internal/useCloseRecordTableCellNoGroup.ts
index 38a583bb2..3ab03ab6e 100644
--- a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/hooks/internal/useCloseRecordTableCellNoGroup.ts
+++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/hooks/internal/useCloseRecordTableCellNoGroup.ts
@@ -6,6 +6,7 @@ import { useClickOutsideListener } from '@/ui/utilities/pointer-event/hooks/useC
 import { useRecordTableContextOrThrow } from '@/object-record/record-table/contexts/RecordTableContext';
 import { useCloseCurrentTableCellInEditMode } from '@/object-record/record-table/hooks/internal/useCloseCurrentTableCellInEditMode';
 import { TableHotkeyScope } from '@/object-record/record-table/types/TableHotkeyScope';
+import { useResetFocusStack } from '@/ui/utilities/focus/hooks/useResetFocusStack';
 import { useCallback } from 'react';
 
 export const useCloseRecordTableCellNoGroup = () => {
@@ -22,10 +23,16 @@ export const useCloseRecordTableCellNoGroup = () => {
   const closeCurrentTableCellInEditMode =
     useCloseCurrentTableCellInEditMode(recordTableId);
 
+  const { resetFocusStack } = useResetFocusStack();
+
   const closeTableCellNoGroup = useCallback(() => {
     toggleClickOutside(true);
     setDragSelectionStartEnabled(true);
     closeCurrentTableCellInEditMode();
+
+    // TODO: Remove this once we've fully migrated away from hotkey scopes
+    resetFocusStack();
+
     setHotkeyScope(TableHotkeyScope.TableFocus, {
       goto: true,
       keyboardShortcutMenu: true,
@@ -33,6 +40,7 @@ export const useCloseRecordTableCellNoGroup = () => {
     });
   }, [
     closeCurrentTableCellInEditMode,
+    resetFocusStack,
     setDragSelectionStartEnabled,
     setHotkeyScope,
     toggleClickOutside,
diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/hooks/useTriggerActionMenuDropdown.ts b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/hooks/useTriggerActionMenuDropdown.ts
index 0e3eff0fc..2604d1ae2 100644
--- a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/hooks/useTriggerActionMenuDropdown.ts
+++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/hooks/useTriggerActionMenuDropdown.ts
@@ -2,7 +2,6 @@ import { useRecoilCallback } from 'recoil';
 
 import { ActionMenuComponentInstanceContext } from '@/action-menu/states/contexts/ActionMenuComponentInstanceContext';
 import { recordIndexActionMenuDropdownPositionComponentState } from '@/action-menu/states/recordIndexActionMenuDropdownPositionComponentState';
-import { ActionMenuDropdownHotkeyScope } from '@/action-menu/types/ActionMenuDropdownHotKeyScope';
 import { getActionMenuDropdownIdFromActionMenuId } from '@/action-menu/utils/getActionMenuDropdownIdFromActionMenuId';
 import { useCommandMenu } from '@/command-menu/hooks/useCommandMenu';
 import { isRowSelectedComponentFamilyState } from '@/object-record/record-table/record-table-row/states/isRowSelectedComponentFamilyState';
@@ -58,9 +57,7 @@ export const useTriggerActionMenuDropdown = ({
 
         closeCommandMenu();
 
-        openDropdown({
-          scope: ActionMenuDropdownHotkeyScope.ActionMenuDropdown,
-        });
+        openDropdown();
       },
     [
       recordIndexActionMenuDropdownPositionState,
diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-footer/components/RecordTableColumnAggregateFooterWithDropdown.tsx b/packages/twenty-front/src/modules/object-record/record-table/record-table-footer/components/RecordTableColumnAggregateFooterWithDropdown.tsx
index 341394998..0b50d7771 100644
--- a/packages/twenty-front/src/modules/object-record/record-table/record-table-footer/components/RecordTableColumnAggregateFooterWithDropdown.tsx
+++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-footer/components/RecordTableColumnAggregateFooterWithDropdown.tsx
@@ -76,7 +76,6 @@ export const RecordTableColumnFooterWithDropdown = ({
       }
       dropdownOffset={{ x: -1 }}
       dropdownPlacement="bottom-start"
-      dropdownHotkeyScope={{ scope: dropdownId }}
     />
   );
 };
diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-header/components/RecordTableColumnHeadWithDropdown.tsx b/packages/twenty-front/src/modules/object-record/record-table/record-table-header/components/RecordTableColumnHeadWithDropdown.tsx
index 4587ac49d..2ed464b85 100644
--- a/packages/twenty-front/src/modules/object-record/record-table/record-table-header/components/RecordTableColumnHeadWithDropdown.tsx
+++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-header/components/RecordTableColumnHeadWithDropdown.tsx
@@ -35,7 +35,6 @@ export const RecordTableColumnHeadWithDropdown = ({
       dropdownComponents={<RecordTableColumnHeadDropdownMenu column={column} />}
       dropdownOffset={{ x: -1 }}
       dropdownPlacement="bottom-start"
-      dropdownHotkeyScope={{ scope: column.fieldMetadataId + '-header' }}
     />
   );
 };
diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-header/components/RecordTableHeaderLastColumn.tsx b/packages/twenty-front/src/modules/object-record/record-table/record-table-header/components/RecordTableHeaderLastColumn.tsx
index 1aeff4928..4f229c000 100644
--- a/packages/twenty-front/src/modules/object-record/record-table/record-table-header/components/RecordTableHeaderLastColumn.tsx
+++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-header/components/RecordTableHeaderLastColumn.tsx
@@ -50,9 +50,6 @@ const StyledDropdownContainer = styled.div`
   cursor: pointer;
 `;
 
-const HIDDEN_TABLE_COLUMN_DROPDOWN_HOTKEY_SCOPE_ID =
-  'hidden-table-columns-dropdown-hotkey-scope-id';
-
 export const RecordTableHeaderLastColumn = () => {
   const theme = useTheme();
 
@@ -89,9 +86,6 @@ export const RecordTableHeaderLastColumn = () => {
           }
           dropdownComponents={<RecordTableHeaderPlusButtonContent />}
           dropdownPlacement="bottom-start"
-          dropdownHotkeyScope={{
-            scope: HIDDEN_TABLE_COLUMN_DROPDOWN_HOTKEY_SCOPE_ID,
-          }}
         />
       </StyledDropdownContainer>
     </StyledPlusIconHeaderCell>
diff --git a/packages/twenty-front/src/modules/object-record/select/components/MultipleSelectDropdown.tsx b/packages/twenty-front/src/modules/object-record/select/components/MultipleSelectDropdown.tsx
index fee9f0d69..680eea2af 100644
--- a/packages/twenty-front/src/modules/object-record/select/components/MultipleSelectDropdown.tsx
+++ b/packages/twenty-front/src/modules/object-record/select/components/MultipleSelectDropdown.tsx
@@ -3,19 +3,20 @@ import { Key } from 'ts-key-enum';
 import { SelectableItem } from '@/object-record/select/types/SelectableItem';
 import { DropdownMenuSkeletonItem } from '@/ui/input/relation-picker/components/skeletons/DropdownMenuSkeletonItem';
 import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer';
+import { DropdownHotkeyScope } from '@/ui/layout/dropdown/constants/DropdownHotkeyScope';
 import { useDropdown } from '@/ui/layout/dropdown/hooks/useDropdown';
 import { SelectableList } from '@/ui/layout/selectable-list/components/SelectableList';
 import { SelectableListItem } from '@/ui/layout/selectable-list/components/SelectableListItem';
 import { useSelectableList } from '@/ui/layout/selectable-list/hooks/useSelectableList';
 import { selectedItemIdComponentState } from '@/ui/layout/selectable-list/states/selectedItemIdComponentState';
-import { useScopedHotkeys } from '@/ui/utilities/hotkey/hooks/useScopedHotkeys';
+import { useHotkeysOnFocusedElement } from '@/ui/utilities/hotkey/hooks/useHotkeysOnFocusedElement';
 import { useRecoilComponentValueV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentValueV2';
 import { Avatar } from 'twenty-ui/display';
 import { MenuItem, MenuItemMultiSelectAvatar } from 'twenty-ui/navigation';
 
 export const MultipleSelectDropdown = ({
   selectableListId,
-  hotkeyScope,
+  focusId,
   itemsToSelect,
   loadingItems,
   filteredSelectedItems,
@@ -23,7 +24,7 @@ export const MultipleSelectDropdown = ({
   searchFilter,
 }: {
   selectableListId: string;
-  hotkeyScope: string;
+  focusId: string;
   itemsToSelect: SelectableItem[];
   filteredSelectedItems: SelectableItem[];
   selectedItems: SelectableItem[];
@@ -61,15 +62,16 @@ export const MultipleSelectDropdown = ({
     ...(itemsToSelect ?? []),
   ];
 
-  useScopedHotkeys(
-    [Key.Escape],
-    () => {
+  useHotkeysOnFocusedElement({
+    keys: [Key.Escape],
+    callback: () => {
       closeDropdown();
       resetSelectedItem();
     },
-    hotkeyScope,
-    [closeDropdown, resetSelectedItem],
-  );
+    focusId,
+    scope: DropdownHotkeyScope.Dropdown,
+    dependencies: [closeDropdown, resetSelectedItem],
+  });
 
   const showNoResult =
     itemsToSelect?.length === 0 &&
@@ -83,7 +85,8 @@ export const MultipleSelectDropdown = ({
     <SelectableList
       selectableListInstanceId={selectableListId}
       selectableItemIdArray={selectableItemIds}
-      hotkeyScope={hotkeyScope}
+      focusId={focusId}
+      hotkeyScope={DropdownHotkeyScope.Dropdown}
     >
       <DropdownMenuItemsContainer hasMaxHeight>
         {itemsInDropdown?.map((item) => {
diff --git a/packages/twenty-front/src/modules/settings/accounts/components/SettingsAccountsRowDropdownMenu.tsx b/packages/twenty-front/src/modules/settings/accounts/components/SettingsAccountsRowDropdownMenu.tsx
index 63363d65e..231ae4761 100644
--- a/packages/twenty-front/src/modules/settings/accounts/components/SettingsAccountsRowDropdownMenu.tsx
+++ b/packages/twenty-front/src/modules/settings/accounts/components/SettingsAccountsRowDropdownMenu.tsx
@@ -51,7 +51,6 @@ export const SettingsAccountsRowDropdownMenu = ({
       <Dropdown
         dropdownId={dropdownId}
         dropdownPlacement="right-start"
-        dropdownHotkeyScope={{ scope: dropdownId }}
         clickableComponent={
           <LightIconButton Icon={IconDotsVertical} accent="tertiary" />
         }
diff --git a/packages/twenty-front/src/modules/settings/admin-panel/config-variables/components/ConfigVariableDatabaseInput.tsx b/packages/twenty-front/src/modules/settings/admin-panel/config-variables/components/ConfigVariableDatabaseInput.tsx
index 727d7be52..172ac4f05 100644
--- a/packages/twenty-front/src/modules/settings/admin-panel/config-variables/components/ConfigVariableDatabaseInput.tsx
+++ b/packages/twenty-front/src/modules/settings/admin-panel/config-variables/components/ConfigVariableDatabaseInput.tsx
@@ -2,7 +2,6 @@ import { Select } from '@/ui/input/components/Select';
 import { SelectControl } from '@/ui/input/components/SelectControl';
 import { TextArea } from '@/ui/input/components/TextArea';
 import { TextInputV2 } from '@/ui/input/components/TextInputV2';
-import { SelectHotkeyScope } from '@/ui/input/types/SelectHotkeyScope';
 import { Dropdown } from '@/ui/layout/dropdown/components/Dropdown';
 import { DropdownContent } from '@/ui/layout/dropdown/components/DropdownContent';
 import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer';
@@ -96,7 +95,6 @@ export const ConfigVariableDatabaseInput = ({
           {options && Array.isArray(options) ? (
             <Dropdown
               dropdownId="config-variable-array-dropdown"
-              dropdownHotkeyScope={{ scope: SelectHotkeyScope.Select }}
               dropdownPlacement="bottom-start"
               dropdownOffset={{
                 y: 8,
diff --git a/packages/twenty-front/src/modules/settings/admin-panel/config-variables/components/ConfigVariableFilterDropdown.tsx b/packages/twenty-front/src/modules/settings/admin-panel/config-variables/components/ConfigVariableFilterDropdown.tsx
index a48c0de9a..d7d5db6a4 100644
--- a/packages/twenty-front/src/modules/settings/admin-panel/config-variables/components/ConfigVariableFilterDropdown.tsx
+++ b/packages/twenty-front/src/modules/settings/admin-panel/config-variables/components/ConfigVariableFilterDropdown.tsx
@@ -46,7 +46,6 @@ export const ConfigVariableFilterDropdown = ({
         />
       }
       dropdownId="env-var-options-dropdown"
-      dropdownHotkeyScope={{ scope: 'env-var-options' }}
       dropdownOffset={{ x: 0, y: 10 }}
       dropdownComponents={
         <ConfigVariableOptionsDropdownContent
diff --git a/packages/twenty-front/src/modules/settings/data-model/components/SettingsDataModelNewFieldBreadcrumbDropDown.tsx b/packages/twenty-front/src/modules/settings/data-model/components/SettingsDataModelNewFieldBreadcrumbDropDown.tsx
index 6fca1a47a..8f35f8c88 100644
--- a/packages/twenty-front/src/modules/settings/data-model/components/SettingsDataModelNewFieldBreadcrumbDropDown.tsx
+++ b/packages/twenty-front/src/modules/settings/data-model/components/SettingsDataModelNewFieldBreadcrumbDropDown.tsx
@@ -130,7 +130,6 @@ export const SettingsDataModelNewFieldBreadcrumbDropDown = () => {
             </DropdownMenuItemsContainer>
           </DropdownContent>
         }
-        dropdownHotkeyScope={{ scope: dropdownId }}
       />
     </StyledContainer>
   );
diff --git a/packages/twenty-front/src/modules/settings/data-model/fields/forms/select/components/SettingsDataModelFieldSelectFormOptionRow.tsx b/packages/twenty-front/src/modules/settings/data-model/fields/forms/select/components/SettingsDataModelFieldSelectFormOptionRow.tsx
index 146f0fa37..714ca901b 100644
--- a/packages/twenty-front/src/modules/settings/data-model/fields/forms/select/components/SettingsDataModelFieldSelectFormOptionRow.tsx
+++ b/packages/twenty-front/src/modules/settings/data-model/fields/forms/select/components/SettingsDataModelFieldSelectFormOptionRow.tsx
@@ -117,7 +117,6 @@ export const SettingsDataModelFieldSelectFormOptionRow = ({
       <Dropdown
         dropdownId={SELECT_COLOR_DROPDOWN_ID}
         dropdownPlacement="bottom-start"
-        dropdownHotkeyScope={{ scope: SELECT_COLOR_DROPDOWN_ID }}
         clickableComponent={<StyledColorSample colorName={option.color} />}
         dropdownComponents={
           <DropdownContent>
@@ -160,7 +159,6 @@ export const SettingsDataModelFieldSelectFormOptionRow = ({
       <Dropdown
         dropdownId={SELECT_ACTIONS_DROPDOWN_ID}
         dropdownPlacement="right-start"
-        dropdownHotkeyScope={{ scope: SELECT_ACTIONS_DROPDOWN_ID }}
         clickableComponent={
           <StyledLightIconButton accent="tertiary" Icon={IconDotsVertical} />
         }
diff --git a/packages/twenty-front/src/modules/settings/data-model/object-details/components/SettingsObjectFieldActiveActionDropdown.tsx b/packages/twenty-front/src/modules/settings/data-model/object-details/components/SettingsObjectFieldActiveActionDropdown.tsx
index 376663d13..a460c0f00 100644
--- a/packages/twenty-front/src/modules/settings/data-model/object-details/components/SettingsObjectFieldActiveActionDropdown.tsx
+++ b/packages/twenty-front/src/modules/settings/data-model/object-details/components/SettingsObjectFieldActiveActionDropdown.tsx
@@ -82,7 +82,6 @@ export const SettingsObjectFieldActiveActionDropdown = ({
           </DropdownMenuItemsContainer>
         </DropdownContent>
       }
-      dropdownHotkeyScope={{ scope: dropdownId }}
     />
   );
 };
diff --git a/packages/twenty-front/src/modules/settings/data-model/object-details/components/SettingsObjectFieldDisabledActionDropdown.tsx b/packages/twenty-front/src/modules/settings/data-model/object-details/components/SettingsObjectFieldDisabledActionDropdown.tsx
index c507daff3..da0613378 100644
--- a/packages/twenty-front/src/modules/settings/data-model/object-details/components/SettingsObjectFieldDisabledActionDropdown.tsx
+++ b/packages/twenty-front/src/modules/settings/data-model/object-details/components/SettingsObjectFieldDisabledActionDropdown.tsx
@@ -86,9 +86,6 @@ export const SettingsObjectFieldInactiveActionDropdown = ({
           </DropdownMenuItemsContainer>
         </DropdownContent>
       }
-      dropdownHotkeyScope={{
-        scope: dropdownId,
-      }}
     />
   );
 };
diff --git a/packages/twenty-front/src/modules/settings/data-model/objects/components/SettingsObjectInactiveMenuDropDown.tsx b/packages/twenty-front/src/modules/settings/data-model/objects/components/SettingsObjectInactiveMenuDropDown.tsx
index 6a18699f9..81b92061e 100644
--- a/packages/twenty-front/src/modules/settings/data-model/objects/components/SettingsObjectInactiveMenuDropDown.tsx
+++ b/packages/twenty-front/src/modules/settings/data-model/objects/components/SettingsObjectInactiveMenuDropDown.tsx
@@ -63,7 +63,6 @@ export const SettingsObjectInactiveMenuDropDown = ({
           </DropdownMenuItemsContainer>
         </DropdownContent>
       }
-      dropdownHotkeyScope={{ scope: dropdownId }}
     />
   );
 };
diff --git a/packages/twenty-front/src/modules/settings/integrations/database-connection/components/SettingsIntegrationDatabaseConnectionSummaryCard.tsx b/packages/twenty-front/src/modules/settings/integrations/database-connection/components/SettingsIntegrationDatabaseConnectionSummaryCard.tsx
index a9e78f48a..d5313b833 100644
--- a/packages/twenty-front/src/modules/settings/integrations/database-connection/components/SettingsIntegrationDatabaseConnectionSummaryCard.tsx
+++ b/packages/twenty-front/src/modules/settings/integrations/database-connection/components/SettingsIntegrationDatabaseConnectionSummaryCard.tsx
@@ -54,7 +54,6 @@ export const SettingsIntegrationDatabaseConnectionSummaryCard = ({
           />
           <Dropdown
             dropdownId={dropdownId}
-            dropdownHotkeyScope={{ scope: dropdownId }}
             clickableComponent={
               <LightIconButton Icon={IconDotsVertical} accent="tertiary" />
             }
diff --git a/packages/twenty-front/src/modules/settings/roles/role-assignment/components/SettingsRoleAssignment.tsx b/packages/twenty-front/src/modules/settings/roles/role-assignment/components/SettingsRoleAssignment.tsx
index 4d4317fc7..c6239ab75 100644
--- a/packages/twenty-front/src/modules/settings/roles/role-assignment/components/SettingsRoleAssignment.tsx
+++ b/packages/twenty-front/src/modules/settings/roles/role-assignment/components/SettingsRoleAssignment.tsx
@@ -238,7 +238,6 @@ export const SettingsRoleAssignment = ({
         <StyledAssignToMemberContainer>
           <Dropdown
             dropdownId="role-member-select"
-            dropdownHotkeyScope={{ scope: 'roleAssignment' }}
             dropdownOffset={{ x: 0, y: 4 }}
             clickableComponent={
               <>
diff --git a/packages/twenty-front/src/modules/settings/security/components/SSO/SettingsSecuritySSORowDropdownMenu.tsx b/packages/twenty-front/src/modules/settings/security/components/SSO/SettingsSecuritySSORowDropdownMenu.tsx
index 6c0dd4cbb..4cc25e55a 100644
--- a/packages/twenty-front/src/modules/settings/security/components/SSO/SettingsSecuritySSORowDropdownMenu.tsx
+++ b/packages/twenty-front/src/modules/settings/security/components/SSO/SettingsSecuritySSORowDropdownMenu.tsx
@@ -69,7 +69,6 @@ export const SettingsSecuritySSORowDropdownMenu = ({
     <Dropdown
       dropdownId={dropdownId}
       dropdownPlacement="right-start"
-      dropdownHotkeyScope={{ scope: dropdownId }}
       clickableComponent={
         <LightIconButton Icon={IconDotsVertical} accent="tertiary" />
       }
diff --git a/packages/twenty-front/src/modules/settings/security/components/approvedAccessDomains/SettingsSecurityApprovedAccessDomainRowDropdownMenu.tsx b/packages/twenty-front/src/modules/settings/security/components/approvedAccessDomains/SettingsSecurityApprovedAccessDomainRowDropdownMenu.tsx
index 80efa075f..12bab789a 100644
--- a/packages/twenty-front/src/modules/settings/security/components/approvedAccessDomains/SettingsSecurityApprovedAccessDomainRowDropdownMenu.tsx
+++ b/packages/twenty-front/src/modules/settings/security/components/approvedAccessDomains/SettingsSecurityApprovedAccessDomainRowDropdownMenu.tsx
@@ -58,7 +58,6 @@ export const SettingsSecurityApprovedAccessDomainRowDropdownMenu = ({
     <Dropdown
       dropdownId={dropdownId}
       dropdownPlacement="right-start"
-      dropdownHotkeyScope={{ scope: dropdownId }}
       clickableComponent={
         <LightIconButton Icon={IconDotsVertical} accent="tertiary" />
       }
diff --git a/packages/twenty-front/src/modules/settings/serverless-functions/components/tabs/SettingsServerlessFunctionTabEnvironmentVariableTableRow.tsx b/packages/twenty-front/src/modules/settings/serverless-functions/components/tabs/SettingsServerlessFunctionTabEnvironmentVariableTableRow.tsx
index bebc8c0b4..a907c341d 100644
--- a/packages/twenty-front/src/modules/settings/serverless-functions/components/tabs/SettingsServerlessFunctionTabEnvironmentVariableTableRow.tsx
+++ b/packages/twenty-front/src/modules/settings/serverless-functions/components/tabs/SettingsServerlessFunctionTabEnvironmentVariableTableRow.tsx
@@ -131,7 +131,6 @@ export const SettingsServerlessFunctionTabEnvironmentVariableTableRow = ({
               </DropdownMenuItemsContainer>
             </DropdownContent>
           }
-          dropdownHotkeyScope={{ scope: dropDownId }}
         />
       </TableCell>
     </StyledTableRow>
diff --git a/packages/twenty-front/src/modules/spreadsheet-import/components/MatchColumnToFieldSelect.tsx b/packages/twenty-front/src/modules/spreadsheet-import/components/MatchColumnToFieldSelect.tsx
index c29bbbf69..f460a067f 100644
--- a/packages/twenty-front/src/modules/spreadsheet-import/components/MatchColumnToFieldSelect.tsx
+++ b/packages/twenty-front/src/modules/spreadsheet-import/components/MatchColumnToFieldSelect.tsx
@@ -123,9 +123,6 @@ export const MatchColumnToFieldSelect = ({
   return (
     <Dropdown
       dropdownId={dropdownId}
-      dropdownHotkeyScope={{
-        scope: dropdownId,
-      }}
       dropdownPlacement="bottom-start"
       clickableComponent={
         <StyledMenuItem
diff --git a/packages/twenty-front/src/modules/spreadsheet-import/steps/components/MatchColumnsStep/components/SubMatchingSelectRowRightDropdown.tsx b/packages/twenty-front/src/modules/spreadsheet-import/steps/components/MatchColumnsStep/components/SubMatchingSelectRowRightDropdown.tsx
index c28195cf1..ee6b8265e 100644
--- a/packages/twenty-front/src/modules/spreadsheet-import/steps/components/MatchColumnsStep/components/SubMatchingSelectRowRightDropdown.tsx
+++ b/packages/twenty-front/src/modules/spreadsheet-import/steps/components/MatchColumnsStep/components/SubMatchingSelectRowRightDropdown.tsx
@@ -52,7 +52,6 @@ export const SubMatchingSelectRowRightDropdown = <T extends string>({
   return (
     <StyledDropdownContainer>
       <Dropdown
-        dropdownHotkeyScope={{ scope: dropdownId }}
         dropdownId={dropdownId}
         dropdownPlacement="bottom-start"
         clickableComponent={
diff --git a/packages/twenty-front/src/modules/support/components/SupportDropdown.tsx b/packages/twenty-front/src/modules/support/components/SupportDropdown.tsx
index b7cfcca62..3474a1cae 100644
--- a/packages/twenty-front/src/modules/support/components/SupportDropdown.tsx
+++ b/packages/twenty-front/src/modules/support/components/SupportDropdown.tsx
@@ -44,7 +44,6 @@ export const SupportDropdown = () => {
           </DropdownMenuItemsContainer>
         </DropdownContent>
       }
-      dropdownHotkeyScope={{ scope: dropdownId }}
     />
   );
 };
diff --git a/packages/twenty-front/src/modules/ui/field/input/components/MultiSelectInput.tsx b/packages/twenty-front/src/modules/ui/field/input/components/MultiSelectInput.tsx
index ad6a8331b..dbd54b65a 100644
--- a/packages/twenty-front/src/modules/ui/field/input/components/MultiSelectInput.tsx
+++ b/packages/twenty-front/src/modules/ui/field/input/components/MultiSelectInput.tsx
@@ -2,15 +2,17 @@ import { useRef, useState } from 'react';
 import { Key } from 'ts-key-enum';
 
 import { FieldMultiSelectValue } from '@/object-record/record-field/types/FieldMetadata';
+import { DEFAULT_CELL_SCOPE } from '@/object-record/record-table/record-table-cell/hooks/useOpenRecordTableCellV2';
 import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer';
 import { DropdownMenuSearchInput } from '@/ui/layout/dropdown/components/DropdownMenuSearchInput';
 import { DropdownMenuSeparator } from '@/ui/layout/dropdown/components/DropdownMenuSeparator';
 import { SelectableList } from '@/ui/layout/selectable-list/components/SelectableList';
 
 import { DropdownContent } from '@/ui/layout/dropdown/components/DropdownContent';
+import { SelectableListItem } from '@/ui/layout/selectable-list/components/SelectableListItem';
 import { useSelectableList } from '@/ui/layout/selectable-list/hooks/useSelectableList';
 import { selectedItemIdComponentState } from '@/ui/layout/selectable-list/states/selectedItemIdComponentState';
-import { useScopedHotkeys } from '@/ui/utilities/hotkey/hooks/useScopedHotkeys';
+import { useHotkeysOnFocusedElement } from '@/ui/utilities/hotkey/hooks/useHotkeysOnFocusedElement';
 import { useListenClickOutside } from '@/ui/utilities/pointer-event/hooks/useListenClickOutside';
 import { useRecoilComponentValueV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentValueV2';
 import { isDefined } from 'twenty-shared/utils';
@@ -21,7 +23,7 @@ import { turnIntoEmptyStringIfWhitespacesOnly } from '~/utils/string/turnIntoEmp
 type MultiSelectInputProps = {
   selectableListComponentInstanceId: string;
   values: FieldMultiSelectValue;
-  hotkeyScope: string;
+  focusId: string;
   onCancel?: () => void;
   options: SelectOption[];
   onOptionSelected: (value: FieldMultiSelectValue) => void;
@@ -32,7 +34,7 @@ export const MultiSelectInput = ({
   selectableListComponentInstanceId,
   values,
   options,
-  hotkeyScope,
+  focusId,
   onCancel,
   onOptionSelected,
   dropdownWidth,
@@ -69,15 +71,16 @@ export const MultiSelectInput = ({
     }
   };
 
-  useScopedHotkeys(
-    Key.Escape,
-    () => {
+  useHotkeysOnFocusedElement({
+    keys: Key.Escape,
+    callback: () => {
       onCancel?.();
       resetSelectedItem();
     },
-    hotkeyScope,
-    [onCancel, resetSelectedItem],
-  );
+    focusId,
+    scope: DEFAULT_CELL_SCOPE.scope,
+    dependencies: [onCancel, resetSelectedItem],
+  });
 
   useListenClickOutside({
     refs: [containerRef],
@@ -102,7 +105,8 @@ export const MultiSelectInput = ({
     <SelectableList
       selectableListInstanceId={selectableListComponentInstanceId}
       selectableItemIdArray={optionIds}
-      hotkeyScope={hotkeyScope}
+      focusId={focusId}
+      hotkeyScope={DEFAULT_CELL_SCOPE.scope}
     >
       <DropdownContent
         ref={containerRef}
@@ -122,17 +126,25 @@ export const MultiSelectInput = ({
         <DropdownMenuItemsContainer hasMaxHeight>
           {filteredOptionsInDropDown.map((option) => {
             return (
-              <MenuItemMultiSelectTag
+              <SelectableListItem
                 key={option.value}
-                selected={values?.includes(option.value) || false}
-                text={option.label}
-                color={option.color ?? 'transparent'}
-                Icon={option.Icon ?? undefined}
-                onClick={() =>
-                  onOptionSelected(formatNewSelectedOptions(option.value))
-                }
-                isKeySelected={selectedItemId === option.value}
-              />
+                itemId={option.value}
+                onEnter={() => {
+                  onOptionSelected(formatNewSelectedOptions(option.value));
+                }}
+              >
+                <MenuItemMultiSelectTag
+                  key={option.value}
+                  selected={values?.includes(option.value) || false}
+                  text={option.label}
+                  color={option.color ?? 'transparent'}
+                  Icon={option.Icon ?? undefined}
+                  onClick={() =>
+                    onOptionSelected(formatNewSelectedOptions(option.value))
+                  }
+                  isKeySelected={selectedItemId === option.value}
+                />
+              </SelectableListItem>
             );
           })}
         </DropdownMenuItemsContainer>
diff --git a/packages/twenty-front/src/modules/ui/field/input/components/SelectInput.tsx b/packages/twenty-front/src/modules/ui/field/input/components/SelectInput.tsx
index 5df67cd96..9def688f6 100644
--- a/packages/twenty-front/src/modules/ui/field/input/components/SelectInput.tsx
+++ b/packages/twenty-front/src/modules/ui/field/input/components/SelectInput.tsx
@@ -1,3 +1,4 @@
+import { DEFAULT_CELL_SCOPE } from '@/object-record/record-table/record-table-cell/hooks/useOpenRecordTableCellV2';
 import { SelectInput as SelectBaseInput } from '@/ui/input/components/SelectInput';
 import { SelectableList } from '@/ui/layout/selectable-list/components/SelectableList';
 import { SelectOption } from 'twenty-ui/input';
@@ -5,7 +6,7 @@ import { SelectOption } from 'twenty-ui/input';
 type SelectInputProps = {
   selectableListComponentInstanceId: string;
   selectableItemIdArray: string[];
-  hotkeyScope: string;
+  focusId: string;
   onEnter: (itemId: string) => void;
   onOptionSelected: (selectedOption: SelectOption) => void;
   options: SelectOption[];
@@ -19,7 +20,7 @@ type SelectInputProps = {
 export const SelectInput = ({
   selectableListComponentInstanceId,
   selectableItemIdArray,
-  hotkeyScope,
+  focusId,
   onOptionSelected,
   options,
   onCancel,
@@ -32,7 +33,8 @@ export const SelectInput = ({
     <SelectableList
       selectableListInstanceId={selectableListComponentInstanceId}
       selectableItemIdArray={selectableItemIdArray}
-      hotkeyScope={hotkeyScope}
+      focusId={focusId}
+      hotkeyScope={DEFAULT_CELL_SCOPE.scope}
     >
       <SelectBaseInput
         onOptionSelected={onOptionSelected}
@@ -42,7 +44,7 @@ export const SelectInput = ({
         onFilterChange={onFilterChange}
         onClear={onClear}
         clearLabel={clearLabel}
-        hotkeyScope={hotkeyScope}
+        focusId={focusId}
       />
     </SelectableList>
   );
diff --git a/packages/twenty-front/src/modules/ui/input/components/IconPicker.tsx b/packages/twenty-front/src/modules/ui/input/components/IconPicker.tsx
index f0e6388c7..6863797a8 100644
--- a/packages/twenty-front/src/modules/ui/input/components/IconPicker.tsx
+++ b/packages/twenty-front/src/modules/ui/input/components/IconPicker.tsx
@@ -12,6 +12,7 @@ import { arrayToChunks } from '~/utils/array/arrayToChunks';
 
 import { ICON_PICKER_DROPDOWN_CONTENT_WIDTH } from '@/ui/input/components/constants/IconPickerDropdownContentWidth';
 import { DropdownContent } from '@/ui/layout/dropdown/components/DropdownContent';
+import { DropdownHotkeyScope } from '@/ui/layout/dropdown/constants/DropdownHotkeyScope';
 import { useSelectableListListenToEnterHotkeyOnItem } from '@/ui/layout/selectable-list/hooks/useSelectableListListenToEnterHotkeyOnItem';
 import { selectedItemIdComponentState } from '@/ui/layout/selectable-list/states/selectedItemIdComponentState';
 import { useRecoilComponentValueV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentValueV2';
@@ -71,9 +72,10 @@ const IconPickerIcon = ({
   );
 
   useSelectableListListenToEnterHotkeyOnItem({
-    hotkeyScope: IconPickerHotkeyScope.IconPicker,
+    focusId: iconKey,
     itemId: iconKey,
     onEnter: onClick,
+    hotkeyScope: DropdownHotkeyScope.Dropdown,
   });
 
   return (
@@ -184,7 +186,6 @@ export const IconPicker = ({
     <div className={className}>
       <Dropdown
         dropdownId={dropdownId}
-        dropdownHotkeyScope={{ scope: IconPickerHotkeyScope.IconPicker }}
         clickableComponent={
           <IconButton
             ariaLabel={`Click to select icon ${
@@ -203,7 +204,8 @@ export const IconPicker = ({
             <SelectableList
               selectableListInstanceId="icon-list"
               selectableItemIdMatrix={iconKeys2d}
-              hotkeyScope={IconPickerHotkeyScope.IconPicker}
+              focusId={dropdownId}
+              hotkeyScope={DropdownHotkeyScope.Dropdown}
             >
               <DropdownMenuSearchInput
                 placeholder={t`Search icon`}
diff --git a/packages/twenty-front/src/modules/ui/input/components/Select.tsx b/packages/twenty-front/src/modules/ui/input/components/Select.tsx
index da2c923fe..cba56f301 100644
--- a/packages/twenty-front/src/modules/ui/input/components/Select.tsx
+++ b/packages/twenty-front/src/modules/ui/input/components/Select.tsx
@@ -9,6 +9,7 @@ import { useDropdown } from '@/ui/layout/dropdown/hooks/useDropdown';
 
 import { SelectControl } from '@/ui/input/components/SelectControl';
 import { DropdownContent } from '@/ui/layout/dropdown/components/DropdownContent';
+import { DropdownHotkeyScope } from '@/ui/layout/dropdown/constants/DropdownHotkeyScope';
 import { GenericDropdownContentWidth } from '@/ui/layout/dropdown/constants/GenericDropdownContentWidth';
 import { DropdownOffset } from '@/ui/layout/dropdown/types/DropdownOffset';
 import { SelectableList } from '@/ui/layout/selectable-list/components/SelectableList';
@@ -19,7 +20,6 @@ import { isDefined } from 'twenty-shared/utils';
 import { IconComponent } from 'twenty-ui/display';
 import { SelectOption } from 'twenty-ui/input';
 import { MenuItem, MenuItemSelect } from 'twenty-ui/navigation';
-import { SelectHotkeyScope } from '../types/SelectHotkeyScope';
 
 export type SelectSizeVariant = 'small' | 'default';
 
@@ -166,9 +166,10 @@ export const Select = <Value extends SelectValue>({
               {!!filteredOptions.length && (
                 <DropdownMenuItemsContainer hasMaxHeight>
                   <SelectableList
-                    hotkeyScope={SelectHotkeyScope.Select}
                     selectableListInstanceId={dropdownId}
+                    focusId={dropdownId}
                     selectableItemIdArray={selectableItemIdArray}
+                    hotkeyScope={DropdownHotkeyScope.Dropdown}
                   >
                     {filteredOptions.map((option) => (
                       <SelectableListItem
@@ -211,7 +212,6 @@ export const Select = <Value extends SelectValue>({
               )}
             </DropdownContent>
           }
-          dropdownHotkeyScope={{ scope: SelectHotkeyScope.Select }}
         />
       )}
     </StyledContainer>
diff --git a/packages/twenty-front/src/modules/ui/input/components/SelectInput.tsx b/packages/twenty-front/src/modules/ui/input/components/SelectInput.tsx
index 6735d4ff2..d1b138a53 100644
--- a/packages/twenty-front/src/modules/ui/input/components/SelectInput.tsx
+++ b/packages/twenty-front/src/modules/ui/input/components/SelectInput.tsx
@@ -2,10 +2,13 @@ import { DropdownContent } from '@/ui/layout/dropdown/components/DropdownContent
 import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer';
 import { DropdownMenuSearchInput } from '@/ui/layout/dropdown/components/DropdownMenuSearchInput';
 import { DropdownMenuSeparator } from '@/ui/layout/dropdown/components/DropdownMenuSeparator';
-import { useScopedHotkeys } from '@/ui/utilities/hotkey/hooks/useScopedHotkeys';
+import { SelectableListItem } from '@/ui/layout/selectable-list/components/SelectableListItem';
+import { SelectableListComponentInstanceContext } from '@/ui/layout/selectable-list/states/contexts/SelectableListComponentInstanceContext';
+import { selectedItemIdComponentState } from '@/ui/layout/selectable-list/states/selectedItemIdComponentState';
 import { useListenClickOutside } from '@/ui/utilities/pointer-event/hooks/useListenClickOutside';
+import { useAvailableComponentInstanceIdOrThrow } from '@/ui/utilities/state/component-state/hooks/useAvailableComponentInstanceIdOrThrow';
+import { useRecoilComponentValueV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentValueV2';
 import { useEffect, useMemo, useRef, useState } from 'react';
-import { Key } from 'ts-key-enum';
 import { isDefined } from 'twenty-shared/utils';
 import { TagColor } from 'twenty-ui/components';
 import { SelectOption } from 'twenty-ui/input';
@@ -19,7 +22,7 @@ interface SelectInputProps {
   onFilterChange?: (filteredOptions: SelectOption[]) => void;
   onClear?: () => void;
   clearLabel?: string;
-  hotkeyScope: string;
+  focusId: string;
 }
 
 export const SelectInput = ({
@@ -30,10 +33,19 @@ export const SelectInput = ({
   onCancel,
   defaultOption,
   onFilterChange,
-  hotkeyScope,
 }: SelectInputProps) => {
   const containerRef = useRef<HTMLDivElement>(null);
 
+  // Get the SelectableList instance id from context
+  const selectableListInstanceId = useAvailableComponentInstanceIdOrThrow(
+    SelectableListComponentInstanceContext,
+  );
+
+  const selectedItemId = useRecoilComponentValueV2(
+    selectedItemIdComponentState,
+    selectableListInstanceId,
+  );
+
   const [searchFilter, setSearchFilter] = useState('');
   const [selectedOption, setSelectedOption] = useState<
     SelectOption | undefined
@@ -61,6 +73,11 @@ export const SelectInput = ({
     onOptionSelected(option);
   };
 
+  const handleClearOption = () => {
+    setSelectedOption(undefined);
+    onClear?.();
+  };
+
   useEffect(() => {
     onFilterChange?.(optionsInDropDown);
   }, [onFilterChange, optionsInDropDown]);
@@ -81,20 +98,6 @@ export const SelectInput = ({
     listenerId: 'select-input',
   });
 
-  useScopedHotkeys(
-    Key.Enter,
-    () => {
-      const selectedOption = optionsInDropDown.find((option) =>
-        option.label.toLowerCase().includes(searchFilter.toLowerCase()),
-      );
-      if (isDefined(selectedOption)) {
-        handleOptionChange(selectedOption);
-      }
-    },
-    hotkeyScope,
-    [searchFilter, optionsInDropDown],
-  );
-
   return (
     <DropdownContent ref={containerRef} selectDisabled>
       <DropdownMenuSearchInput
@@ -105,27 +108,37 @@ export const SelectInput = ({
       <DropdownMenuSeparator />
       <DropdownMenuItemsContainer hasMaxHeight>
         {onClear && clearLabel && (
-          <MenuItemSelectTag
-            key={`No ${clearLabel}`}
-            text={`No ${clearLabel}`}
-            color="transparent"
-            variant={'outline'}
-            onClick={() => {
-              setSelectedOption(undefined);
-              onClear();
-            }}
-          />
+          <SelectableListItem
+            itemId={`No ${clearLabel}`}
+            onEnter={handleClearOption}
+          >
+            <MenuItemSelectTag
+              key={`No ${clearLabel}`}
+              text={`No ${clearLabel}`}
+              color="transparent"
+              variant={'outline'}
+              onClick={handleClearOption}
+              isKeySelected={selectedItemId === `No ${clearLabel}`}
+            />
+          </SelectableListItem>
         )}
         {optionsInDropDown.map((option) => {
           return (
-            <MenuItemSelectTag
+            <SelectableListItem
               key={option.value}
-              focused={selectedOption?.value === option.value}
-              text={option.label}
-              color={(option.color as TagColor) ?? 'transparent'}
-              onClick={() => handleOptionChange(option)}
-              LeftIcon={option.Icon}
-            />
+              itemId={option.value}
+              onEnter={() => handleOptionChange(option)}
+            >
+              <MenuItemSelectTag
+                key={option.value}
+                selected={selectedOption?.value === option.value}
+                text={option.label}
+                color={(option.color as TagColor) ?? 'transparent'}
+                onClick={() => handleOptionChange(option)}
+                LeftIcon={option.Icon}
+                isKeySelected={selectedItemId === option.value}
+              />
+            </SelectableListItem>
           );
         })}
       </DropdownMenuItemsContainer>
diff --git a/packages/twenty-front/src/modules/ui/input/components/internal/currency/components/CurrencyPickerDropdownButton.tsx b/packages/twenty-front/src/modules/ui/input/components/internal/currency/components/CurrencyPickerDropdownButton.tsx
index fa998caac..ae6715624 100644
--- a/packages/twenty-front/src/modules/ui/input/components/internal/currency/components/CurrencyPickerDropdownButton.tsx
+++ b/packages/twenty-front/src/modules/ui/input/components/internal/currency/components/CurrencyPickerDropdownButton.tsx
@@ -70,7 +70,6 @@ export const CurrencyPickerDropdownButton = ({
   return (
     <Dropdown
       dropdownId="currency-picker-dropdown-id"
-      dropdownHotkeyScope={{ scope: CurrencyPickerHotkeyScope.CurrencyPicker }}
       clickableComponent={
         <StyledDropdownButtonContainer>
           <StyledIconContainer>
diff --git a/packages/twenty-front/src/modules/ui/input/components/internal/phone/components/PhoneCountryPickerDropdownButton.tsx b/packages/twenty-front/src/modules/ui/input/components/internal/phone/components/PhoneCountryPickerDropdownButton.tsx
index e5195cdf6..46f6bad3d 100644
--- a/packages/twenty-front/src/modules/ui/input/components/internal/phone/components/PhoneCountryPickerDropdownButton.tsx
+++ b/packages/twenty-front/src/modules/ui/input/components/internal/phone/components/PhoneCountryPickerDropdownButton.tsx
@@ -6,8 +6,6 @@ import { useTheme } from '@emotion/react';
 import styled from '@emotion/styled';
 import { useEffect, useState } from 'react';
 
-import { CountryPickerHotkeyScope } from '../types/CountryPickerHotkeyScope';
-
 import { PhoneCountryPickerDropdownSelect } from './PhoneCountryPickerDropdownSelect';
 
 import 'react-phone-number-input/style.css';
@@ -98,7 +96,6 @@ export const PhoneCountryPickerDropdownButton = ({
   return (
     <Dropdown
       dropdownId="country-picker-dropdown-id"
-      dropdownHotkeyScope={{ scope: CountryPickerHotkeyScope.CountryPicker }}
       clickableComponent={
         <StyledDropdownButtonContainer isUnfolded={isDropdownOpen}>
           <StyledIconContainer>
diff --git a/packages/twenty-front/src/modules/ui/input/types/SelectHotkeyScope.ts b/packages/twenty-front/src/modules/ui/input/types/SelectHotkeyScope.ts
deleted file mode 100644
index 2a2152df0..000000000
--- a/packages/twenty-front/src/modules/ui/input/types/SelectHotkeyScope.ts
+++ /dev/null
@@ -1,3 +0,0 @@
-export enum SelectHotkeyScope {
-  Select = 'select',
-}
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 82579d934..05456e07f 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
@@ -4,11 +4,10 @@ import { DROPDOWN_RESIZE_MIN_HEIGHT } from '@/ui/layout/dropdown/constants/Dropd
 import { DROPDOWN_RESIZE_MIN_WIDTH } from '@/ui/layout/dropdown/constants/DropdownResizeMinWidth';
 import { DropdownComponentInstanceContext } from '@/ui/layout/dropdown/contexts/DropdownComponeInstanceContext';
 import { DropdownScope } from '@/ui/layout/dropdown/scopes/DropdownScope';
-import { dropdownHotkeyComponentState } from '@/ui/layout/dropdown/states/dropdownHotkeyComponentState';
 import { dropdownMaxHeightComponentState } from '@/ui/layout/dropdown/states/internal/dropdownMaxHeightComponentState';
 import { dropdownMaxWidthComponentState } from '@/ui/layout/dropdown/states/internal/dropdownMaxWidthComponentState';
 import { DropdownOffset } from '@/ui/layout/dropdown/types/DropdownOffset';
-import { HotkeyScope } from '@/ui/utilities/hotkey/types/HotkeyScope';
+import { GlobalHotkeysConfig } from '@/ui/utilities/hotkey/types/GlobalHotkeysConfig';
 import { useSetRecoilComponentStateV2 } from '@/ui/utilities/state/component-state/hooks/useSetRecoilComponentStateV2';
 import styled from '@emotion/styled';
 import {
@@ -47,9 +46,8 @@ export type DropdownProps = {
   dropdownComponents: ReactNode;
   hotkey?: {
     key: Keys;
-    scope: string;
   };
-  dropdownHotkeyScope: HotkeyScope;
+  globalHotkeysConfig?: Partial<GlobalHotkeysConfig>;
   dropdownId: string;
   dropdownPlacement?: Placement;
   dropdownOffset?: DropdownOffset;
@@ -66,7 +64,7 @@ export const Dropdown = ({
   dropdownComponents,
   hotkey,
   dropdownId,
-  dropdownHotkeyScope,
+  globalHotkeysConfig,
   dropdownPlacement = 'bottom-end',
   dropdownStrategy = 'absolute',
   dropdownOffset,
@@ -145,21 +143,14 @@ export const Dropdown = ({
   });
 
   const handleClickableComponentClick = useRecoilCallback(
-    ({ set }) =>
-      async (event: MouseEvent) => {
-        event.stopPropagation();
-        event.preventDefault();
+    () => async (event: MouseEvent) => {
+      event.stopPropagation();
+      event.preventDefault();
 
-        // TODO: refactor this when we have finished dropdown refactor with state and V1 + V2
-        set(
-          dropdownHotkeyComponentState({ scopeId: dropdownId }),
-          dropdownHotkeyScope,
-        );
-
-        toggleDropdown(dropdownHotkeyScope);
-        onClickOutside?.();
-      },
-    [dropdownId, dropdownHotkeyScope, onClickOutside, toggleDropdown],
+      toggleDropdown(globalHotkeysConfig);
+      onClickOutside?.();
+    },
+    [globalHotkeysConfig, onClickOutside, toggleDropdown],
   );
 
   return (
@@ -190,10 +181,9 @@ export const Dropdown = ({
               dropdownId={dropdownId}
               dropdownPlacement={placement}
               floatingUiRefs={refs}
-              hotkeyScope={dropdownHotkeyScope}
               hotkey={hotkey}
               onClickOutside={onClickOutside}
-              onHotkeyTriggered={toggleDropdown}
+              onHotkeyTriggered={onOpen}
               excludedClickOutsideIds={excludedClickOutsideIds}
               isDropdownInModal={isDropdownInModal}
             />
diff --git a/packages/twenty-front/src/modules/ui/layout/dropdown/components/DropdownMenuInnerSelect.tsx b/packages/twenty-front/src/modules/ui/layout/dropdown/components/DropdownMenuInnerSelect.tsx
index 37f707a78..433e7de5b 100644
--- a/packages/twenty-front/src/modules/ui/layout/dropdown/components/DropdownMenuInnerSelect.tsx
+++ b/packages/twenty-front/src/modules/ui/layout/dropdown/components/DropdownMenuInnerSelect.tsx
@@ -1,7 +1,6 @@
 import { Dropdown } from '@/ui/layout/dropdown/components/Dropdown';
 import { DropdownContent } from '@/ui/layout/dropdown/components/DropdownContent';
 import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer';
-import { DropdownMenuHotkeyScope } from '@/ui/layout/dropdown/constants/DropdownMenuHotkeyScope';
 import { useDropdown } from '@/ui/layout/dropdown/hooks/useDropdown';
 import { useTheme } from '@emotion/react';
 
@@ -72,12 +71,9 @@ export const DropdownMenuInnerSelect = ({
           </DropdownMenuItemsContainer>
         </DropdownContent>
       }
-      dropdownHotkeyScope={{
-        scope: DropdownMenuHotkeyScope.InnerSelect,
-        customScopes: {
-          commandMenu: false,
-          commandMenuOpen: false,
-        },
+      globalHotkeysConfig={{
+        enableGlobalHotkeysWithModifiers: false,
+        enableGlobalHotkeysConflictingWithKeyboard: false,
       }}
       dropdownId={dropdownId}
       dropdownOffset={{
diff --git a/packages/twenty-front/src/modules/ui/layout/dropdown/components/__stories__/Dropdown.stories.tsx b/packages/twenty-front/src/modules/ui/layout/dropdown/components/__stories__/Dropdown.stories.tsx
index 155917cb1..cec0b9c4e 100644
--- a/packages/twenty-front/src/modules/ui/layout/dropdown/components/__stories__/Dropdown.stories.tsx
+++ b/packages/twenty-front/src/modules/ui/layout/dropdown/components/__stories__/Dropdown.stories.tsx
@@ -39,13 +39,11 @@ const meta: Meta<typeof Dropdown> = {
   decorators: [ComponentDecorator, (Story) => <Story />],
   args: {
     clickableComponent: <Button title="Open Dropdown" />,
-    dropdownHotkeyScope: { scope: 'testDropdownMenu' },
     dropdownOffset: { x: 0, y: 8 },
     dropdownId: 'test-dropdown-id',
   },
   argTypes: {
     clickableComponent: { control: false },
-    dropdownHotkeyScope: { control: false },
     dropdownOffset: { control: false },
     dropdownComponents: { control: false },
   },
@@ -352,7 +350,6 @@ const ModalWithDropdown = () => {
                   title="Open Dropdown in Modal"
                 />
               }
-              dropdownHotkeyScope={{ scope: 'modal-dropdown' }}
               dropdownOffset={{ x: 0, y: 8 }}
               dropdownId="modal-dropdown-test"
               isDropdownInModal={true}
diff --git a/packages/twenty-front/src/modules/ui/layout/dropdown/components/__stories__/DropdownMenuHeader.stories.tsx b/packages/twenty-front/src/modules/ui/layout/dropdown/components/__stories__/DropdownMenuHeader.stories.tsx
index c439d8465..76aff3e57 100644
--- a/packages/twenty-front/src/modules/ui/layout/dropdown/components/__stories__/DropdownMenuHeader.stories.tsx
+++ b/packages/twenty-front/src/modules/ui/layout/dropdown/components/__stories__/DropdownMenuHeader.stories.tsx
@@ -1,6 +1,5 @@
 import { Meta, StoryObj } from '@storybook/react';
 
-import { SelectHotkeyScope } from '@/ui/input/types/SelectHotkeyScope';
 import { Dropdown } from '@/ui/layout/dropdown/components/Dropdown';
 import { DropdownContent } from '@/ui/layout/dropdown/components/DropdownContent';
 import { DropdownMenuHeader } from '@/ui/layout/dropdown/components/DropdownMenuHeader/DropdownMenuHeader';
@@ -63,7 +62,6 @@ export const ContextDropdownAndAvatar: Story = {
     EndComponent: (
       <Dropdown
         dropdownId={'story-dropdown-id-context-menu'}
-        dropdownHotkeyScope={{ scope: SelectHotkeyScope.Select }}
         dropdownComponents={
           <DropdownContent>
             <DropdownMenuItemsContainer>
diff --git a/packages/twenty-front/src/modules/ui/layout/dropdown/components/internal/DropdownInternalContainer.tsx b/packages/twenty-front/src/modules/ui/layout/dropdown/components/internal/DropdownInternalContainer.tsx
index 395ac0e0e..988ee7571 100644
--- a/packages/twenty-front/src/modules/ui/layout/dropdown/components/internal/DropdownInternalContainer.tsx
+++ b/packages/twenty-front/src/modules/ui/layout/dropdown/components/internal/DropdownInternalContainer.tsx
@@ -1,13 +1,12 @@
 import { RootStackingContextZIndices } from '@/ui/layout/constants/RootStackingContextZIndices';
+import { DropdownHotkeyScope } from '@/ui/layout/dropdown/constants/DropdownHotkeyScope';
 import { useDropdown } from '@/ui/layout/dropdown/hooks/useDropdown';
-import { useInternalHotkeyScopeManagement } from '@/ui/layout/dropdown/hooks/useInternalHotkeyScopeManagement';
 import { activeDropdownFocusIdState } from '@/ui/layout/dropdown/states/activeDropdownFocusIdState';
 import { dropdownMaxHeightComponentState } from '@/ui/layout/dropdown/states/internal/dropdownMaxHeightComponentState';
 import { dropdownMaxWidthComponentState } from '@/ui/layout/dropdown/states/internal/dropdownMaxWidthComponentState';
 import { OverlayContainer } from '@/ui/layout/overlay/components/OverlayContainer';
 import { HotkeyEffect } from '@/ui/utilities/hotkey/components/HotkeyEffect';
-import { useScopedHotkeys } from '@/ui/utilities/hotkey/hooks/useScopedHotkeys';
-import { HotkeyScope } from '@/ui/utilities/hotkey/types/HotkeyScope';
+import { useHotkeysOnFocusedElement } from '@/ui/utilities/hotkey/hooks/useHotkeysOnFocusedElement';
 import { ClickOutsideListenerContext } from '@/ui/utilities/pointer-event/contexts/ClickOutsideListenerContext';
 import { useListenClickOutside } from '@/ui/utilities/pointer-event/hooks/useListenClickOutside';
 import { useRecoilComponentValueV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentValueV2';
@@ -45,11 +44,9 @@ export type DropdownInternalContainerProps = {
   dropdownPlacement: Placement;
   floatingUiRefs: UseFloatingReturn['refs'];
   onClickOutside?: () => void;
-  hotkeyScope: HotkeyScope;
   floatingStyles: UseFloatingReturn['floatingStyles'];
   hotkey?: {
     key: Keys;
-    scope: string;
   };
   onHotkeyTriggered?: () => void;
   dropdownComponents: React.ReactNode;
@@ -63,7 +60,6 @@ export const DropdownInternalContainer = ({
   dropdownPlacement,
   floatingUiRefs,
   onClickOutside,
-  hotkeyScope,
   floatingStyles,
   hotkey,
   onHotkeyTriggered,
@@ -108,23 +104,24 @@ export const DropdownInternalContainer = ({
     excludedClickOutsideIds,
   });
 
-  useInternalHotkeyScopeManagement({
-    dropdownScopeId: dropdownId,
-    dropdownHotkeyScopeFromParent: hotkeyScope,
-  });
-
-  useScopedHotkeys(
-    [Key.Escape],
-    () => {
+  useHotkeysOnFocusedElement({
+    keys: [Key.Escape],
+    callback: () => {
       if (activeDropdownFocusId !== dropdownId) return;
 
       if (isDropdownOpen) {
         closeDropdown();
       }
     },
-    hotkeyScope?.scope,
-    [closeDropdown, isDropdownOpen],
-  );
+    focusId: dropdownId,
+    scope: DropdownHotkeyScope.Dropdown,
+    dependencies: [
+      closeDropdown,
+      isDropdownOpen,
+      activeDropdownFocusId,
+      dropdownId,
+    ],
+  });
 
   const dropdownMenuStyles = {
     ...floatingStyles,
@@ -137,7 +134,11 @@ export const DropdownInternalContainer = ({
   return (
     <>
       {hotkey && onHotkeyTriggered && (
-        <HotkeyEffect hotkey={hotkey} onHotkeyTriggered={onHotkeyTriggered} />
+        <HotkeyEffect
+          hotkey={hotkey}
+          onHotkeyTriggered={onHotkeyTriggered}
+          focusId={dropdownId}
+        />
       )}
 
       <FloatingPortal>
diff --git a/packages/twenty-front/src/modules/ui/layout/dropdown/constants/DropdownHotkeyScope.ts b/packages/twenty-front/src/modules/ui/layout/dropdown/constants/DropdownHotkeyScope.ts
new file mode 100644
index 000000000..8f6e48494
--- /dev/null
+++ b/packages/twenty-front/src/modules/ui/layout/dropdown/constants/DropdownHotkeyScope.ts
@@ -0,0 +1,3 @@
+export enum DropdownHotkeyScope {
+  Dropdown = 'dropdown',
+}
diff --git a/packages/twenty-front/src/modules/ui/layout/dropdown/constants/DropdownMenuHotkeyScope.ts b/packages/twenty-front/src/modules/ui/layout/dropdown/constants/DropdownMenuHotkeyScope.ts
deleted file mode 100644
index 67147f0b1..000000000
--- a/packages/twenty-front/src/modules/ui/layout/dropdown/constants/DropdownMenuHotkeyScope.ts
+++ /dev/null
@@ -1,3 +0,0 @@
-export enum DropdownMenuHotkeyScope {
-  InnerSelect = 'dropdown-menu-inner-select',
-}
diff --git a/packages/twenty-front/src/modules/ui/layout/dropdown/hooks/__tests__/useInternalHotkeyScopeManagement.test.tsx b/packages/twenty-front/src/modules/ui/layout/dropdown/hooks/__tests__/useInternalHotkeyScopeManagement.test.tsx
deleted file mode 100644
index 3bfd0f3a3..000000000
--- a/packages/twenty-front/src/modules/ui/layout/dropdown/hooks/__tests__/useInternalHotkeyScopeManagement.test.tsx
+++ /dev/null
@@ -1,47 +0,0 @@
-import { expect } from '@storybook/test';
-import { renderHook } from '@testing-library/react';
-import { RecoilRoot, useRecoilValue } from 'recoil';
-
-import { useDropdownStates } from '@/ui/layout/dropdown/hooks/internal/useDropdownStates';
-import { useInternalHotkeyScopeManagement } from '@/ui/layout/dropdown/hooks/useInternalHotkeyScopeManagement';
-import { HotkeyScope } from '@/ui/utilities/hotkey/types/HotkeyScope';
-
-const dropdownScopeId = 'test-dropdown-id-scope';
-
-const Wrapper = ({ children }: { children: React.ReactNode }) => {
-  return <RecoilRoot>{children}</RecoilRoot>;
-};
-
-describe('useInternalHotkeyScopeManagement', () => {
-  it('should update dropdownHotkeyScope', async () => {
-    const { result, rerender } = renderHook(
-      ({
-        dropdownHotkeyScopeFromParent,
-      }: {
-        dropdownHotkeyScopeFromParent?: HotkeyScope;
-      }) => {
-        useInternalHotkeyScopeManagement({
-          dropdownScopeId,
-          dropdownHotkeyScopeFromParent,
-        });
-        const { dropdownHotkeyScopeState } = useDropdownStates({
-          dropdownScopeId,
-        });
-        const dropdownHotkeyScope = useRecoilValue(dropdownHotkeyScopeState);
-        return { dropdownHotkeyScope };
-      },
-      {
-        wrapper: Wrapper,
-        initialProps: {},
-      },
-    );
-
-    expect(result.current.dropdownHotkeyScope).toBeNull();
-
-    const scopeFromParent = { scope: 'customScope' };
-
-    rerender({ dropdownHotkeyScopeFromParent: scopeFromParent });
-
-    expect(result.current.dropdownHotkeyScope).toEqual(scopeFromParent);
-  });
-});
diff --git a/packages/twenty-front/src/modules/ui/layout/dropdown/hooks/internal/useDropdownStates.ts b/packages/twenty-front/src/modules/ui/layout/dropdown/hooks/internal/useDropdownStates.ts
index 5c8178003..a96a2837c 100644
--- a/packages/twenty-front/src/modules/ui/layout/dropdown/hooks/internal/useDropdownStates.ts
+++ b/packages/twenty-front/src/modules/ui/layout/dropdown/hooks/internal/useDropdownStates.ts
@@ -1,5 +1,4 @@
 import { DropdownScopeInternalContext } from '@/ui/layout/dropdown/scopes/scope-internal-context/DropdownScopeInternalContext';
-import { dropdownHotkeyComponentState } from '@/ui/layout/dropdown/states/dropdownHotkeyComponentState';
 import { dropdownPlacementComponentState } from '@/ui/layout/dropdown/states/dropdownPlacementComponentState';
 import { isDropdownOpenComponentState } from '@/ui/layout/dropdown/states/isDropdownOpenComponentState';
 import { useAvailableScopeIdOrThrow } from '@/ui/utilities/recoil-scope/scopes-internal/hooks/useAvailableScopeId';
@@ -23,10 +22,6 @@ export const useDropdownStates = ({
       dropdownPlacementComponentState,
       scopeId,
     ),
-    dropdownHotkeyScopeState: extractComponentState(
-      dropdownHotkeyComponentState,
-      scopeId,
-    ),
     isDropdownOpenState: extractComponentState(
       isDropdownOpenComponentState,
       scopeId,
diff --git a/packages/twenty-front/src/modules/ui/layout/dropdown/hooks/useCloseAnyOpenDropdown.ts b/packages/twenty-front/src/modules/ui/layout/dropdown/hooks/useCloseAnyOpenDropdown.ts
index efe0660f8..dc58ef07f 100644
--- a/packages/twenty-front/src/modules/ui/layout/dropdown/hooks/useCloseAnyOpenDropdown.ts
+++ b/packages/twenty-front/src/modules/ui/layout/dropdown/hooks/useCloseAnyOpenDropdown.ts
@@ -1,15 +1,15 @@
 import { useCloseDropdownFromOutside } from '@/ui/layout/dropdown/hooks/useCloseDropdownFromOutside';
 import { activeDropdownFocusIdState } from '@/ui/layout/dropdown/states/activeDropdownFocusIdState';
 import { previousDropdownFocusIdState } from '@/ui/layout/dropdown/states/previousDropdownFocusIdState';
-import { usePreviousHotkeyScope } from '@/ui/utilities/hotkey/hooks/usePreviousHotkeyScope';
+import { useRemoveFocusItemFromFocusStack } from '@/ui/utilities/focus/hooks/useRemoveFocusItemFromFocusStack';
 import { useRecoilCallback } from 'recoil';
 import { isDefined } from 'twenty-shared/utils';
 
 export const useCloseAnyOpenDropdown = () => {
-  const { goBackToPreviousHotkeyScope } = usePreviousHotkeyScope();
-
   const { closeDropdownFromOutside } = useCloseDropdownFromOutside();
 
+  const { removeFocusItemFromFocusStack } = useRemoveFocusItemFromFocusStack();
+
   const closeAnyOpenDropdown = useRecoilCallback(
     ({ snapshot, set }) =>
       () => {
@@ -33,18 +33,24 @@ export const useCloseAnyOpenDropdown = () => {
 
         if (isDefined(activeDropdownFocusId)) {
           closeDropdownFromOutside(activeDropdownFocusId);
+          removeFocusItemFromFocusStack({
+            focusId: activeDropdownFocusId,
+            memoizeKey: 'global',
+          });
         }
 
         if (thereIsOneNestedDropdownOpen) {
           closeDropdownFromOutside(previousDropdownFocusId);
+          removeFocusItemFromFocusStack({
+            focusId: previousDropdownFocusId,
+            memoizeKey: 'global',
+          });
         }
 
         set(previousDropdownFocusIdState, null);
         set(activeDropdownFocusIdState, null);
-
-        goBackToPreviousHotkeyScope();
       },
-    [closeDropdownFromOutside, goBackToPreviousHotkeyScope],
+    [closeDropdownFromOutside, removeFocusItemFromFocusStack],
   );
 
   return { closeAnyOpenDropdown };
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 2835fcad6..31d9ff9d9 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
@@ -3,18 +3,19 @@ import { useRecoilCallback, useRecoilState } from 'recoil';
 import { useDropdownStates } from '@/ui/layout/dropdown/hooks/internal/useDropdownStates';
 import { useGoBackToPreviousDropdownFocusId } from '@/ui/layout/dropdown/hooks/useGoBackToPreviousDropdownFocusId';
 import { useSetActiveDropdownFocusIdAndMemorizePrevious } from '@/ui/layout/dropdown/hooks/useSetFocusedDropdownIdAndMemorizePrevious';
-import { dropdownHotkeyComponentState } from '@/ui/layout/dropdown/states/dropdownHotkeyComponentState';
-import { usePreviousHotkeyScope } from '@/ui/utilities/hotkey/hooks/usePreviousHotkeyScope';
+import { usePushFocusItemToFocusStack } from '@/ui/utilities/focus/hooks/usePushFocusItemToFocusStack';
+import { useRemoveFocusItemFromFocusStack } from '@/ui/utilities/focus/hooks/useRemoveFocusItemFromFocusStack';
+import { FocusComponentType } from '@/ui/utilities/focus/types/FocusComponentType';
+import { GlobalHotkeysConfig } from '@/ui/utilities/hotkey/types/GlobalHotkeysConfig';
 import { HotkeyScope } from '@/ui/utilities/hotkey/types/HotkeyScope';
-import { getSnapshotValue } from '@/ui/utilities/recoil-scope/utils/getSnapshotValue';
 import { useCallback } from 'react';
-import { isDefined } from 'twenty-shared/utils';
 
 export const useDropdown = (dropdownId?: string) => {
+  const { pushFocusItemToFocusStack } = usePushFocusItemToFocusStack();
+  const { removeFocusItemFromFocusStack } = useRemoveFocusItemFromFocusStack();
+
   const { scopeId, isDropdownOpenState, dropdownPlacementState } =
-    useDropdownStates({
-      dropdownScopeId: dropdownId,
-    });
+    useDropdownStates({ dropdownScopeId: dropdownId });
 
   const { setActiveDropdownFocusIdAndMemorizePrevious } =
     useSetActiveDropdownFocusIdAndMemorizePrevious();
@@ -22,71 +23,67 @@ export const useDropdown = (dropdownId?: string) => {
   const { goBackToPreviousDropdownFocusId } =
     useGoBackToPreviousDropdownFocusId();
 
-  const {
-    setHotkeyScopeAndMemorizePreviousScope,
-    goBackToPreviousHotkeyScope,
-  } = usePreviousHotkeyScope();
+  const [isDropdownOpen, setIsDropdownOpen] =
+    useRecoilState(isDropdownOpenState);
 
   const [dropdownPlacement, setDropdownPlacement] = useRecoilState(
     dropdownPlacementState,
   );
 
-  const [isDropdownOpen, setIsDropdownOpen] =
-    useRecoilState(isDropdownOpenState);
-
   const closeDropdown = useCallback(() => {
     if (isDropdownOpen) {
-      goBackToPreviousHotkeyScope();
       setIsDropdownOpen(false);
       goBackToPreviousDropdownFocusId();
+      removeFocusItemFromFocusStack({
+        focusId: dropdownId ?? scopeId,
+        memoizeKey: 'global',
+      });
     }
   }, [
     isDropdownOpen,
-    goBackToPreviousHotkeyScope,
     setIsDropdownOpen,
     goBackToPreviousDropdownFocusId,
+    removeFocusItemFromFocusStack,
+    dropdownId,
+    scopeId,
   ]);
 
   const openDropdown = useRecoilCallback(
-    ({ snapshot }) =>
-      (dropdownHotkeyScopeFromProps?: HotkeyScope) => {
-        if (!isDropdownOpen) {
-          setIsDropdownOpen(true);
-          setActiveDropdownFocusIdAndMemorizePrevious(dropdownId ?? scopeId);
+    () => (globalHotkeysConfig?: Partial<GlobalHotkeysConfig>) => {
+      if (!isDropdownOpen) {
+        setIsDropdownOpen(true);
+        setActiveDropdownFocusIdAndMemorizePrevious(dropdownId ?? scopeId);
 
-          const dropdownHotkeyScope = getSnapshotValue(
-            snapshot,
-            dropdownHotkeyComponentState({
-              scopeId: dropdownId ?? scopeId,
-            }),
-          );
-
-          const dropdownHotkeyScopeForOpening =
-            dropdownHotkeyScopeFromProps ?? dropdownHotkeyScope;
-
-          if (isDefined(dropdownHotkeyScopeForOpening)) {
-            setHotkeyScopeAndMemorizePreviousScope({
-              scope: dropdownHotkeyScopeForOpening.scope,
-              customScopes: dropdownHotkeyScopeForOpening.customScopes,
-            });
-          }
-        }
-      },
+        pushFocusItemToFocusStack({
+          focusId: dropdownId ?? scopeId,
+          component: {
+            type: FocusComponentType.DROPDOWN,
+            instanceId: dropdownId ?? scopeId,
+          },
+          globalHotkeysConfig,
+          // TODO: Remove this once we've fully migrated away from hotkey scopes
+          hotkeyScope: { scope: 'dropdown' } as HotkeyScope,
+          memoizeKey: 'global',
+        });
+      }
+    },
     [
       isDropdownOpen,
       setIsDropdownOpen,
       setActiveDropdownFocusIdAndMemorizePrevious,
+      pushFocusItemToFocusStack,
       dropdownId,
       scopeId,
-      setHotkeyScopeAndMemorizePreviousScope,
     ],
   );
 
-  const toggleDropdown = (dropdownHotkeyScopeFromProps?: HotkeyScope) => {
+  const toggleDropdown = (
+    globalHotkeysConfig?: Partial<GlobalHotkeysConfig>,
+  ) => {
     if (isDropdownOpen) {
       closeDropdown();
     } else {
-      openDropdown(dropdownHotkeyScopeFromProps);
+      openDropdown(globalHotkeysConfig);
     }
   };
 
diff --git a/packages/twenty-front/src/modules/ui/layout/dropdown/hooks/useDropdownV2.ts b/packages/twenty-front/src/modules/ui/layout/dropdown/hooks/useDropdownV2.ts
index 9cefe8f11..c594e4dd6 100644
--- a/packages/twenty-front/src/modules/ui/layout/dropdown/hooks/useDropdownV2.ts
+++ b/packages/twenty-front/src/modules/ui/layout/dropdown/hooks/useDropdownV2.ts
@@ -1,21 +1,25 @@
 import { useRecoilCallback } from 'recoil';
 
 import { useGoBackToPreviousDropdownFocusId } from '@/ui/layout/dropdown/hooks/useGoBackToPreviousDropdownFocusId';
-import { dropdownHotkeyComponentState } from '@/ui/layout/dropdown/states/dropdownHotkeyComponentState';
+import { useSetActiveDropdownFocusIdAndMemorizePrevious } from '@/ui/layout/dropdown/hooks/useSetFocusedDropdownIdAndMemorizePrevious';
 import { isDropdownOpenComponentState } from '@/ui/layout/dropdown/states/isDropdownOpenComponentState';
-import { usePreviousHotkeyScope } from '@/ui/utilities/hotkey/hooks/usePreviousHotkeyScope';
+import { usePushFocusItemToFocusStack } from '@/ui/utilities/focus/hooks/usePushFocusItemToFocusStack';
+import { useRemoveFocusItemFromFocusStack } from '@/ui/utilities/focus/hooks/useRemoveFocusItemFromFocusStack';
+import { FocusComponentType } from '@/ui/utilities/focus/types/FocusComponentType';
+import { GlobalHotkeysConfig } from '@/ui/utilities/hotkey/types/GlobalHotkeysConfig';
 import { HotkeyScope } from '@/ui/utilities/hotkey/types/HotkeyScope';
-import { isDefined } from 'twenty-shared/utils';
 
 export const useDropdownV2 = () => {
-  const {
-    setHotkeyScopeAndMemorizePreviousScope,
-    goBackToPreviousHotkeyScope,
-  } = usePreviousHotkeyScope();
-
   const { goBackToPreviousDropdownFocusId } =
     useGoBackToPreviousDropdownFocusId();
 
+  const { pushFocusItemToFocusStack } = usePushFocusItemToFocusStack();
+
+  const { removeFocusItemFromFocusStack } = useRemoveFocusItemFromFocusStack();
+
+  const { setActiveDropdownFocusIdAndMemorizePrevious } =
+    useSetActiveDropdownFocusIdAndMemorizePrevious();
+
   const closeDropdown = useRecoilCallback(
     ({ set, snapshot }) =>
       (specificComponentId: string) => {
@@ -26,7 +30,10 @@ export const useDropdownV2 = () => {
           .getValue();
 
         if (isDropdownOpen) {
-          goBackToPreviousHotkeyScope();
+          removeFocusItemFromFocusStack({
+            focusId: scopeId,
+            memoizeKey: 'global',
+          });
           goBackToPreviousDropdownFocusId();
           set(
             isDropdownOpenComponentState({
@@ -36,18 +43,17 @@ export const useDropdownV2 = () => {
           );
         }
       },
-    [goBackToPreviousHotkeyScope, goBackToPreviousDropdownFocusId],
+    [removeFocusItemFromFocusStack, goBackToPreviousDropdownFocusId],
   );
 
   const openDropdown = useRecoilCallback(
-    ({ set, snapshot }) =>
-      (specificComponentId: string, customHotkeyScope?: HotkeyScope) => {
+    ({ set }) =>
+      (
+        specificComponentId: string,
+        globalHotkeysConfig?: Partial<GlobalHotkeysConfig>,
+      ) => {
         const scopeId = specificComponentId;
 
-        const dropdownHotkeyScope = snapshot
-          .getLoadable(dropdownHotkeyComponentState({ scopeId }))
-          .getValue();
-
         set(
           isDropdownOpenComponentState({
             scopeId,
@@ -55,24 +61,29 @@ export const useDropdownV2 = () => {
           true,
         );
 
-        if (isDefined(customHotkeyScope)) {
-          setHotkeyScopeAndMemorizePreviousScope({
-            scope: customHotkeyScope.scope,
-            customScopes: customHotkeyScope.customScopes,
-          });
-        } else if (isDefined(dropdownHotkeyScope)) {
-          setHotkeyScopeAndMemorizePreviousScope({
-            scope: dropdownHotkeyScope.scope,
-            customScopes: dropdownHotkeyScope.customScopes,
-          });
-        }
+        setActiveDropdownFocusIdAndMemorizePrevious(specificComponentId);
+
+        pushFocusItemToFocusStack({
+          focusId: scopeId,
+          component: {
+            type: FocusComponentType.DROPDOWN,
+            instanceId: scopeId,
+          },
+          globalHotkeysConfig,
+          // TODO: Remove this once we've fully migrated away from hotkey scopes
+          hotkeyScope: { scope: 'dropdown' } as HotkeyScope,
+          memoizeKey: 'global',
+        });
       },
-    [setHotkeyScopeAndMemorizePreviousScope],
+    [pushFocusItemToFocusStack, setActiveDropdownFocusIdAndMemorizePrevious],
   );
 
   const toggleDropdown = useRecoilCallback(
     ({ snapshot }) =>
-      (specificComponentId: string, customHotkeyScope?: HotkeyScope) => {
+      (
+        specificComponentId: string,
+        globalHotkeysConfig?: Partial<GlobalHotkeysConfig>,
+      ) => {
         const scopeId = specificComponentId;
         const isDropdownOpen = snapshot
           .getLoadable(isDropdownOpenComponentState({ scopeId }))
@@ -81,7 +92,7 @@ export const useDropdownV2 = () => {
         if (isDropdownOpen) {
           closeDropdown(specificComponentId);
         } else {
-          openDropdown(specificComponentId, customHotkeyScope);
+          openDropdown(specificComponentId, globalHotkeysConfig);
         }
       },
     [closeDropdown, openDropdown],
diff --git a/packages/twenty-front/src/modules/ui/layout/dropdown/hooks/useInternalHotkeyScopeManagement.ts b/packages/twenty-front/src/modules/ui/layout/dropdown/hooks/useInternalHotkeyScopeManagement.ts
deleted file mode 100644
index 9ea9db797..000000000
--- a/packages/twenty-front/src/modules/ui/layout/dropdown/hooks/useInternalHotkeyScopeManagement.ts
+++ /dev/null
@@ -1,30 +0,0 @@
-import { useEffect } from 'react';
-import { useRecoilState } from 'recoil';
-
-import { useDropdownStates } from '@/ui/layout/dropdown/hooks/internal/useDropdownStates';
-import { HotkeyScope } from '@/ui/utilities/hotkey/types/HotkeyScope';
-import { isDeeplyEqual } from '~/utils/isDeeplyEqual';
-
-export const useInternalHotkeyScopeManagement = ({
-  dropdownScopeId,
-  dropdownHotkeyScopeFromParent,
-}: {
-  dropdownScopeId: string;
-  dropdownHotkeyScopeFromParent?: HotkeyScope;
-}) => {
-  const { dropdownHotkeyScopeState } = useDropdownStates({ dropdownScopeId });
-
-  const [dropdownHotkeyScope, setDropdownHotkeyScope] = useRecoilState(
-    dropdownHotkeyScopeState,
-  );
-
-  useEffect(() => {
-    if (!isDeeplyEqual(dropdownHotkeyScopeFromParent, dropdownHotkeyScope)) {
-      setDropdownHotkeyScope(dropdownHotkeyScopeFromParent);
-    }
-  }, [
-    dropdownHotkeyScope,
-    dropdownHotkeyScopeFromParent,
-    setDropdownHotkeyScope,
-  ]);
-};
diff --git a/packages/twenty-front/src/modules/ui/layout/dropdown/states/dropdownHotkeyComponentState.ts b/packages/twenty-front/src/modules/ui/layout/dropdown/states/dropdownHotkeyComponentState.ts
deleted file mode 100644
index 729472555..000000000
--- a/packages/twenty-front/src/modules/ui/layout/dropdown/states/dropdownHotkeyComponentState.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-import { HotkeyScope } from '@/ui/utilities/hotkey/types/HotkeyScope';
-import { createComponentState } from '@/ui/utilities/state/component-state/utils/createComponentState';
-
-export const dropdownHotkeyComponentState = createComponentState<
-  HotkeyScope | null | undefined
->({
-  key: 'dropdownHotkeyComponentState',
-  defaultValue: null,
-});
diff --git a/packages/twenty-front/src/modules/ui/layout/modal/hooks/useModal.tsx b/packages/twenty-front/src/modules/ui/layout/modal/hooks/useModal.tsx
index da2a9c9a1..b766a9f77 100644
--- a/packages/twenty-front/src/modules/ui/layout/modal/hooks/useModal.tsx
+++ b/packages/twenty-front/src/modules/ui/layout/modal/hooks/useModal.tsx
@@ -1,13 +1,13 @@
 import { ModalHotkeyScope } from '@/ui/layout/modal/components/types/ModalHotkeyScope';
 import { isModalOpenedComponentState } from '@/ui/layout/modal/states/isModalOpenedComponentState';
 import { usePushFocusItemToFocusStack } from '@/ui/utilities/focus/hooks/usePushFocusItemToFocusStack';
-import { useRemoveFocusIdFromFocusStack } from '@/ui/utilities/focus/hooks/useRemoveFocusIdFromFocusStack';
+import { useRemoveFocusItemFromFocusStack } from '@/ui/utilities/focus/hooks/useRemoveFocusItemFromFocusStack';
 import { FocusComponentType } from '@/ui/utilities/focus/types/FocusComponentType';
 import { useRecoilCallback } from 'recoil';
 
 export const useModal = () => {
-  const pushFocusItem = usePushFocusItemToFocusStack();
-  const removeFocusId = useRemoveFocusIdFromFocusStack();
+  const { pushFocusItemToFocusStack } = usePushFocusItemToFocusStack();
+  const { removeFocusItemFromFocusStack } = useRemoveFocusItemFromFocusStack();
 
   const closeModal = useRecoilCallback(
     ({ set, snapshot }) =>
@@ -22,7 +22,7 @@ export const useModal = () => {
           return;
         }
 
-        removeFocusId({
+        removeFocusItemFromFocusStack({
           focusId: modalId,
           memoizeKey: modalId,
         });
@@ -32,7 +32,7 @@ export const useModal = () => {
           false,
         );
       },
-    [removeFocusId],
+    [removeFocusItemFromFocusStack],
   );
 
   const openModal = useRecoilCallback(
@@ -53,7 +53,7 @@ export const useModal = () => {
           true,
         );
 
-        pushFocusItem({
+        pushFocusItemToFocusStack({
           focusId: modalId,
           component: {
             type: FocusComponentType.MODAL,
@@ -76,7 +76,7 @@ export const useModal = () => {
           memoizeKey: modalId,
         });
       },
-    [pushFocusItem],
+    [pushFocusItemToFocusStack],
   );
 
   const toggleModal = useRecoilCallback(
diff --git a/packages/twenty-front/src/modules/ui/layout/selectable-list/components/SelectableList.tsx b/packages/twenty-front/src/modules/ui/layout/selectable-list/components/SelectableList.tsx
index 34ecf3796..fa10a4950 100644
--- a/packages/twenty-front/src/modules/ui/layout/selectable-list/components/SelectableList.tsx
+++ b/packages/twenty-front/src/modules/ui/layout/selectable-list/components/SelectableList.tsx
@@ -13,19 +13,26 @@ type SelectableListProps = {
   selectableItemIdArray?: string[];
   selectableItemIdMatrix?: string[][];
   onSelect?: (selected: string) => void;
-  hotkeyScope: string;
   selectableListInstanceId: string;
+  focusId: string;
+  hotkeyScope: string;
 };
 
 export const SelectableList = ({
   children,
-  hotkeyScope,
   selectableItemIdArray,
   selectableItemIdMatrix,
   selectableListInstanceId,
   onSelect,
+  focusId,
+  hotkeyScope,
 }: SelectableListProps) => {
-  useSelectableListHotKeys(selectableListInstanceId, hotkeyScope, onSelect);
+  useSelectableListHotKeys(
+    selectableListInstanceId,
+    hotkeyScope,
+    focusId,
+    onSelect,
+  );
 
   const setSelectableItemIds = useSetRecoilComponentStateV2(
     selectableItemIdsComponentState,
@@ -54,7 +61,7 @@ export const SelectableList = ({
         instanceId: selectableListInstanceId,
       }}
     >
-      <SelectableListContextProvider value={{ hotkeyScope }}>
+      <SelectableListContextProvider value={{ focusId, hotkeyScope }}>
         {children}
       </SelectableListContextProvider>
     </SelectableListComponentInstanceContext.Provider>
diff --git a/packages/twenty-front/src/modules/ui/layout/selectable-list/components/SelectableListItemHotkeyEffect.tsx b/packages/twenty-front/src/modules/ui/layout/selectable-list/components/SelectableListItemHotkeyEffect.tsx
index c53b18842..545809b18 100644
--- a/packages/twenty-front/src/modules/ui/layout/selectable-list/components/SelectableListItemHotkeyEffect.tsx
+++ b/packages/twenty-front/src/modules/ui/layout/selectable-list/components/SelectableListItemHotkeyEffect.tsx
@@ -8,12 +8,14 @@ export const SelectableListItemHotkeyEffect = ({
   itemId: string;
   onEnter: () => void;
 }) => {
-  const { hotkeyScope } = useSelectableListContextOrThrow();
+  const { focusId, hotkeyScope } = useSelectableListContextOrThrow();
 
   useSelectableListListenToEnterHotkeyOnItem({
-    hotkeyScope,
+    focusId,
     itemId,
     onEnter,
+    hotkeyScope,
   });
+
   return null;
 };
diff --git a/packages/twenty-front/src/modules/ui/layout/selectable-list/hooks/internal/useSelectableListHotKeys.ts b/packages/twenty-front/src/modules/ui/layout/selectable-list/hooks/internal/useSelectableListHotKeys.ts
index 1c5cf7355..2a9aff480 100644
--- a/packages/twenty-front/src/modules/ui/layout/selectable-list/hooks/internal/useSelectableListHotKeys.ts
+++ b/packages/twenty-front/src/modules/ui/layout/selectable-list/hooks/internal/useSelectableListHotKeys.ts
@@ -5,14 +5,16 @@ import { Key } from 'ts-key-enum';
 import { selectableItemIdsComponentState } from '@/ui/layout/selectable-list/states/selectableItemIdsComponentState';
 import { selectedItemIdComponentState } from '@/ui/layout/selectable-list/states/selectedItemIdComponentState';
 import { isSelectedItemIdComponentFamilySelector } from '@/ui/layout/selectable-list/states/selectors/isSelectedItemIdComponentFamilySelector';
-import { useScopedHotkeys } from '@/ui/utilities/hotkey/hooks/useScopedHotkeys';
+import { useHotkeysOnFocusedElement } from '@/ui/utilities/hotkey/hooks/useHotkeysOnFocusedElement';
 import { getSnapshotValue } from '@/ui/utilities/recoil-scope/utils/getSnapshotValue';
 
 type Direction = 'up' | 'down' | 'left' | 'right';
 
 export const useSelectableListHotKeys = (
   instanceId: string,
+  // TODO: Remove this after migration to focus stack
   hotkeyScope: string,
+  focusId: string,
   onSelect?: (itemId: string) => void,
 ) => {
   const findPosition = (
@@ -134,16 +136,35 @@ export const useSelectableListHotKeys = (
     [instanceId, onSelect],
   );
 
-  useScopedHotkeys(Key.ArrowUp, () => handleSelect('up'), hotkeyScope, []);
+  useHotkeysOnFocusedElement({
+    keys: Key.ArrowUp,
+    callback: () => handleSelect('up'),
+    focusId,
+    scope: hotkeyScope,
+    dependencies: [handleSelect],
+  });
 
-  useScopedHotkeys(Key.ArrowDown, () => handleSelect('down'), hotkeyScope, []);
+  useHotkeysOnFocusedElement({
+    keys: Key.ArrowDown,
+    callback: () => handleSelect('down'),
+    focusId,
+    scope: hotkeyScope,
+    dependencies: [handleSelect],
+  });
 
-  useScopedHotkeys(Key.ArrowLeft, () => handleSelect('left'), hotkeyScope, []);
+  useHotkeysOnFocusedElement({
+    keys: Key.ArrowLeft,
+    callback: () => handleSelect('left'),
+    focusId,
+    scope: hotkeyScope,
+    dependencies: [handleSelect],
+  });
 
-  useScopedHotkeys(
-    Key.ArrowRight,
-    () => handleSelect('right'),
-    hotkeyScope,
-    [],
-  );
+  useHotkeysOnFocusedElement({
+    keys: Key.ArrowRight,
+    callback: () => handleSelect('right'),
+    focusId,
+    scope: hotkeyScope,
+    dependencies: [handleSelect],
+  });
 };
diff --git a/packages/twenty-front/src/modules/ui/layout/selectable-list/hooks/useSelectableListListenToEnterHotkeyOnItem.ts b/packages/twenty-front/src/modules/ui/layout/selectable-list/hooks/useSelectableListListenToEnterHotkeyOnItem.ts
index dd8b20146..d8a600672 100644
--- a/packages/twenty-front/src/modules/ui/layout/selectable-list/hooks/useSelectableListListenToEnterHotkeyOnItem.ts
+++ b/packages/twenty-front/src/modules/ui/layout/selectable-list/hooks/useSelectableListListenToEnterHotkeyOnItem.ts
@@ -1,6 +1,6 @@
 import { SelectableListComponentInstanceContext } from '@/ui/layout/selectable-list/states/contexts/SelectableListComponentInstanceContext';
 import { selectedItemIdComponentState } from '@/ui/layout/selectable-list/states/selectedItemIdComponentState';
-import { useScopedHotkeys } from '@/ui/utilities/hotkey/hooks/useScopedHotkeys';
+import { useHotkeysOnFocusedElement } from '@/ui/utilities/hotkey/hooks/useHotkeysOnFocusedElement';
 import { getSnapshotValue } from '@/ui/utilities/recoil-scope/utils/getSnapshotValue';
 import { useAvailableComponentInstanceIdOrThrow } from '@/ui/utilities/state/component-state/hooks/useAvailableComponentInstanceIdOrThrow';
 import { isNonEmptyString } from '@sniptt/guards';
@@ -8,20 +8,24 @@ import { useRecoilCallback } from 'recoil';
 import { Key } from 'ts-key-enum';
 
 export const useSelectableListListenToEnterHotkeyOnItem = ({
-  hotkeyScope,
+  focusId,
   itemId,
   onEnter,
+  hotkeyScope,
 }: {
-  hotkeyScope: string;
+  focusId: string;
   itemId: string;
   onEnter: () => void;
+  // TODO: Remove this after migration to focus stack
+  hotkeyScope: string;
 }) => {
   const instanceId = useAvailableComponentInstanceIdOrThrow(
     SelectableListComponentInstanceContext,
   );
-  useScopedHotkeys(
-    Key.Enter,
-    useRecoilCallback(
+
+  useHotkeysOnFocusedElement({
+    keys: Key.Enter,
+    callback: useRecoilCallback(
       ({ snapshot }) =>
         () => {
           const selectedItemId = getSnapshotValue(
@@ -37,7 +41,8 @@ export const useSelectableListListenToEnterHotkeyOnItem = ({
         },
       [instanceId, itemId, onEnter],
     ),
-    hotkeyScope,
-    [itemId, onEnter],
-  );
+    focusId,
+    scope: hotkeyScope,
+    dependencies: [itemId, onEnter],
+  });
 };
diff --git a/packages/twenty-front/src/modules/ui/layout/selectable-list/states/contexts/SelectableListContext.tsx b/packages/twenty-front/src/modules/ui/layout/selectable-list/states/contexts/SelectableListContext.tsx
index 7c8d757b5..7722d75d7 100644
--- a/packages/twenty-front/src/modules/ui/layout/selectable-list/states/contexts/SelectableListContext.tsx
+++ b/packages/twenty-front/src/modules/ui/layout/selectable-list/states/contexts/SelectableListContext.tsx
@@ -1,6 +1,7 @@
 import { createRequiredContext } from '~/utils/createRequiredContext';
 
 export type SelectableListContextValue = {
+  focusId: string;
   hotkeyScope: string;
 };
 
diff --git a/packages/twenty-front/src/modules/ui/layout/tab-list/components/TabListDropdown.tsx b/packages/twenty-front/src/modules/ui/layout/tab-list/components/TabListDropdown.tsx
index 23e21596d..72ee18652 100644
--- a/packages/twenty-front/src/modules/ui/layout/tab-list/components/TabListDropdown.tsx
+++ b/packages/twenty-front/src/modules/ui/layout/tab-list/components/TabListDropdown.tsx
@@ -67,7 +67,6 @@ export const TabListDropdown = ({
           </DropdownMenuItemsContainer>
         </DropdownContent>
       }
-      dropdownHotkeyScope={{ scope: dropdownId }}
     />
   );
 };
diff --git a/packages/twenty-front/src/modules/ui/navigation/menu-item/components/MenuItemWithOptionDropdown.tsx b/packages/twenty-front/src/modules/ui/navigation/menu-item/components/MenuItemWithOptionDropdown.tsx
index 3b2d6a809..8200d6c68 100644
--- a/packages/twenty-front/src/modules/ui/navigation/menu-item/components/MenuItemWithOptionDropdown.tsx
+++ b/packages/twenty-front/src/modules/ui/navigation/menu-item/components/MenuItemWithOptionDropdown.tsx
@@ -1,4 +1,3 @@
-import { SelectHotkeyScope } from '@/ui/input/types/SelectHotkeyScope';
 import { Dropdown } from '@/ui/layout/dropdown/components/Dropdown';
 import { useTheme } from '@emotion/react';
 import { Placement } from '@floating-ui/react';
@@ -93,7 +92,6 @@ export const MenuItemWithOptionDropdown = ({
           dropdownPlacement={dropdownPlacement}
           dropdownComponents={dropdownContent}
           dropdownId={dropdownId}
-          dropdownHotkeyScope={{ scope: SelectHotkeyScope.Select }}
         />
       </div>
       {hasSubMenu && (
diff --git a/packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/MultiWorkspaceDropdown/MultiWorkspaceDropdownButton.tsx b/packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/MultiWorkspaceDropdown/MultiWorkspaceDropdownButton.tsx
index f157df3f2..47166a29c 100644
--- a/packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/MultiWorkspaceDropdown/MultiWorkspaceDropdownButton.tsx
+++ b/packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/MultiWorkspaceDropdown/MultiWorkspaceDropdownButton.tsx
@@ -5,7 +5,6 @@ import { MultiWorkspaceDropdownThemesComponents } from '@/ui/navigation/navigati
 import { MultiWorkspaceDropdownWorkspacesListComponents } from '@/ui/navigation/navigation-drawer/components/MultiWorkspaceDropdown/internal/MultiWorkspaceDropdownWorkspacesListComponents';
 import { MULTI_WORKSPACE_DROPDOWN_ID } from '@/ui/navigation/navigation-drawer/constants/MultiWorkspaceDropdownId';
 import { multiWorkspaceDropdownState } from '@/ui/navigation/navigation-drawer/states/multiWorkspaceDropdownState';
-import { NavigationDrawerHotKeyScope } from '@/ui/navigation/navigation-drawer/types/NavigationDrawerHotKeyScope';
 import { useMemo } from 'react';
 import { useRecoilState } from 'recoil';
 
@@ -28,9 +27,6 @@ export const MultiWorkspaceDropdownButton = () => {
   return (
     <Dropdown
       dropdownId={MULTI_WORKSPACE_DROPDOWN_ID}
-      dropdownHotkeyScope={{
-        scope: NavigationDrawerHotKeyScope.MultiWorkspaceDropdownButton,
-      }}
       dropdownOffset={{ y: -35, x: -5 }}
       clickableComponent={<MultiWorkspaceDropdownClickableComponent />}
       dropdownComponents={<DropdownComponents />}
diff --git a/packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/MultiWorkspaceDropdown/internal/MultiWorkspaceDropdownDefaultComponents.tsx b/packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/MultiWorkspaceDropdown/internal/MultiWorkspaceDropdownDefaultComponents.tsx
index fc7cb87ea..8351c5741 100644
--- a/packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/MultiWorkspaceDropdown/internal/MultiWorkspaceDropdownDefaultComponents.tsx
+++ b/packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/MultiWorkspaceDropdown/internal/MultiWorkspaceDropdownDefaultComponents.tsx
@@ -1,14 +1,15 @@
 import { DEFAULT_WORKSPACE_LOGO } from '@/ui/navigation/navigation-drawer/constants/DefaultWorkspaceLogo';
 
 import { useAuth } from '@/auth/hooks/useAuth';
+import { availableWorkspacesState } from '@/auth/states/availableWorkspacesState';
 import { currentWorkspaceState } from '@/auth/states/currentWorkspaceState';
+import { countAvailableWorkspaces } from '@/auth/utils/availableWorkspacesUtils';
 import { useBuildWorkspaceUrl } from '@/domain-manager/hooks/useBuildWorkspaceUrl';
 import { useRedirectToWorkspaceDomain } from '@/domain-manager/hooks/useRedirectToWorkspaceDomain';
 import { AppPath } from '@/types/AppPath';
 import { SettingsPath } from '@/types/SettingsPath';
 import { SnackBarVariant } from '@/ui/feedback/snack-bar-manager/components/SnackBar';
 import { useSnackBar } from '@/ui/feedback/snack-bar-manager/hooks/useSnackBar';
-import { SelectHotkeyScope } from '@/ui/input/types/SelectHotkeyScope';
 import { Dropdown } from '@/ui/layout/dropdown/components/Dropdown';
 import { DropdownContent } from '@/ui/layout/dropdown/components/DropdownContent';
 import { DropdownMenuHeader } from '@/ui/layout/dropdown/components/DropdownMenuHeader/DropdownMenuHeader';
@@ -37,13 +38,11 @@ import {
   UndecoratedLink,
 } from 'twenty-ui/navigation';
 import {
-  useSignUpInNewWorkspaceMutation,
   AvailableWorkspace,
+  useSignUpInNewWorkspaceMutation,
 } from '~/generated/graphql';
 import { getWorkspaceUrl } from '~/utils/getWorkspaceUrl';
 import { getSettingsPath } from '~/utils/navigation/getSettingsPath';
-import { availableWorkspacesState } from '@/auth/states/availableWorkspacesState';
-import { countAvailableWorkspaces } from '@/auth/utils/availableWorkspacesUtils';
 
 const StyledDescription = styled.div`
   color: ${({ theme }) => theme.font.color.light};
@@ -118,7 +117,6 @@ export const MultiWorkspaceDropdownDefaultComponents = () => {
               />
             }
             dropdownId={'multi-workspace-dropdown-context-menu'}
-            dropdownHotkeyScope={{ scope: SelectHotkeyScope.Select }}
             dropdownComponents={
               <DropdownContent>
                 <DropdownMenuItemsContainer>
diff --git a/packages/twenty-front/src/modules/ui/utilities/focus/constants/DebugFocusStack.ts b/packages/twenty-front/src/modules/ui/utilities/focus/constants/DebugFocusStack.ts
new file mode 100644
index 000000000..0239aa703
--- /dev/null
+++ b/packages/twenty-front/src/modules/ui/utilities/focus/constants/DebugFocusStack.ts
@@ -0,0 +1,3 @@
+import { DEBUG_HOTKEY_SCOPE } from '@/ui/utilities/hotkey/constants/DebugHotkeyScope';
+
+export const DEBUG_FOCUS_STACK = DEBUG_HOTKEY_SCOPE;
diff --git a/packages/twenty-front/src/modules/ui/utilities/focus/hooks/__tests__/usePushFocusItemToFocusStack.test.tsx b/packages/twenty-front/src/modules/ui/utilities/focus/hooks/__tests__/usePushFocusItemToFocusStack.test.tsx
index f79ac064c..91e0f9a28 100644
--- a/packages/twenty-front/src/modules/ui/utilities/focus/hooks/__tests__/usePushFocusItemToFocusStack.test.tsx
+++ b/packages/twenty-front/src/modules/ui/utilities/focus/hooks/__tests__/usePushFocusItemToFocusStack.test.tsx
@@ -9,12 +9,12 @@ import { RecoilRoot, useRecoilValue } from 'recoil';
 const renderHooks = () => {
   const { result } = renderHook(
     () => {
-      const pushFocusItem = usePushFocusItemToFocusStack();
+      const { pushFocusItemToFocusStack } = usePushFocusItemToFocusStack();
       const focusStack = useRecoilValue(focusStackState);
       const currentFocusId = useRecoilValue(currentFocusIdSelector);
 
       return {
-        pushFocusItem,
+        pushFocusItemToFocusStack,
         focusStack,
         currentFocusId,
       };
@@ -46,7 +46,7 @@ describe('usePushFocusItemToFocusStack', () => {
     };
 
     await act(async () => {
-      result.current.pushFocusItem({
+      result.current.pushFocusItemToFocusStack({
         focusId: focusItem.focusId,
         component: {
           type: focusItem.componentInstance.componentType,
@@ -73,7 +73,7 @@ describe('usePushFocusItemToFocusStack', () => {
     };
 
     await act(async () => {
-      result.current.pushFocusItem({
+      result.current.pushFocusItemToFocusStack({
         focusId: anotherFocusItem.focusId,
         component: {
           type: anotherFocusItem.componentInstance.componentType,
diff --git a/packages/twenty-front/src/modules/ui/utilities/focus/hooks/__tests__/useRemoveFocusIdFromFocusStack.test.tsx b/packages/twenty-front/src/modules/ui/utilities/focus/hooks/__tests__/useRemoveFocusItemFromFocusStack.test.tsx
similarity index 81%
rename from packages/twenty-front/src/modules/ui/utilities/focus/hooks/__tests__/useRemoveFocusIdFromFocusStack.test.tsx
rename to packages/twenty-front/src/modules/ui/utilities/focus/hooks/__tests__/useRemoveFocusItemFromFocusStack.test.tsx
index 20dd54ae2..83bd5209b 100644
--- a/packages/twenty-front/src/modules/ui/utilities/focus/hooks/__tests__/useRemoveFocusIdFromFocusStack.test.tsx
+++ b/packages/twenty-front/src/modules/ui/utilities/focus/hooks/__tests__/useRemoveFocusItemFromFocusStack.test.tsx
@@ -1,5 +1,5 @@
 import { usePushFocusItemToFocusStack } from '@/ui/utilities/focus/hooks/usePushFocusItemToFocusStack';
-import { useRemoveFocusIdFromFocusStack } from '@/ui/utilities/focus/hooks/useRemoveFocusIdFromFocusStack';
+import { useRemoveFocusItemFromFocusStack } from '@/ui/utilities/focus/hooks/useRemoveFocusItemFromFocusStack';
 import { currentFocusIdSelector } from '@/ui/utilities/focus/states/currentFocusIdSelector';
 import { focusStackState } from '@/ui/utilities/focus/states/focusStackState';
 import { FocusComponentType } from '@/ui/utilities/focus/types/FocusComponentType';
@@ -10,14 +10,15 @@ import { RecoilRoot, useRecoilValue } from 'recoil';
 const renderHooks = () => {
   const { result } = renderHook(
     () => {
-      const pushFocusItem = usePushFocusItemToFocusStack();
-      const removeFocusId = useRemoveFocusIdFromFocusStack();
+      const { pushFocusItemToFocusStack } = usePushFocusItemToFocusStack();
+      const { removeFocusItemFromFocusStack } =
+        useRemoveFocusItemFromFocusStack();
       const focusStack = useRecoilValue(focusStackState);
       const currentFocusId = useRecoilValue(currentFocusIdSelector);
 
       return {
-        pushFocusItem,
-        removeFocusId,
+        pushFocusItemToFocusStack,
+        removeFocusItemFromFocusStack,
         focusStack,
         currentFocusId,
       };
@@ -30,8 +31,8 @@ const renderHooks = () => {
   return { result };
 };
 
-describe('useRemoveFocusIdFromFocusStack', () => {
-  it('should remove focus id from the stack', async () => {
+describe('useRemoveFocusItemFromFocusStack', () => {
+  it('should remove focus item from the stack', async () => {
     const { result } = renderHooks();
 
     const firstFocusItem = {
@@ -59,7 +60,7 @@ describe('useRemoveFocusIdFromFocusStack', () => {
     };
 
     await act(async () => {
-      result.current.pushFocusItem({
+      result.current.pushFocusItemToFocusStack({
         focusId: firstFocusItem.focusId,
         component: {
           type: firstFocusItem.componentInstance.componentType,
@@ -71,7 +72,7 @@ describe('useRemoveFocusIdFromFocusStack', () => {
     });
 
     await act(async () => {
-      result.current.pushFocusItem({
+      result.current.pushFocusItemToFocusStack({
         focusId: secondFocusItem.focusId,
         component: {
           type: secondFocusItem.componentInstance.componentType,
@@ -89,7 +90,7 @@ describe('useRemoveFocusIdFromFocusStack', () => {
     expect(result.current.currentFocusId).toEqual(secondFocusItem.focusId);
 
     await act(async () => {
-      result.current.removeFocusId({
+      result.current.removeFocusItemFromFocusStack({
         focusId: firstFocusItem.focusId,
         memoizeKey: 'global',
       });
diff --git a/packages/twenty-front/src/modules/ui/utilities/focus/hooks/__tests__/useResetFocusStack.test.tsx b/packages/twenty-front/src/modules/ui/utilities/focus/hooks/__tests__/useResetFocusStack.test.tsx
index 481fe4836..cc420835e 100644
--- a/packages/twenty-front/src/modules/ui/utilities/focus/hooks/__tests__/useResetFocusStack.test.tsx
+++ b/packages/twenty-front/src/modules/ui/utilities/focus/hooks/__tests__/useResetFocusStack.test.tsx
@@ -10,13 +10,13 @@ import { RecoilRoot, useRecoilValue } from 'recoil';
 const renderHooks = () => {
   const { result } = renderHook(
     () => {
-      const pushFocusItem = usePushFocusItemToFocusStack();
-      const resetFocusStack = useResetFocusStack();
+      const { pushFocusItemToFocusStack } = usePushFocusItemToFocusStack();
+      const { resetFocusStack } = useResetFocusStack();
       const focusStack = useRecoilValue(focusStackState);
       const currentFocusId = useRecoilValue(currentFocusIdSelector);
 
       return {
-        pushFocusItem,
+        pushFocusItemToFocusStack,
         resetFocusStack,
         focusStack,
         currentFocusId,
@@ -47,7 +47,7 @@ describe('useResetFocusStack', () => {
     };
 
     await act(async () => {
-      result.current.pushFocusItem({
+      result.current.pushFocusItemToFocusStack({
         focusId: focusItem.focusId,
         component: {
           type: focusItem.componentInstance.componentType,
diff --git a/packages/twenty-front/src/modules/ui/utilities/focus/hooks/__tests__/useResetFocusStackToFocusItem.test.tsx b/packages/twenty-front/src/modules/ui/utilities/focus/hooks/__tests__/useResetFocusStackToFocusItem.test.tsx
index af4171373..617057b75 100644
--- a/packages/twenty-front/src/modules/ui/utilities/focus/hooks/__tests__/useResetFocusStackToFocusItem.test.tsx
+++ b/packages/twenty-front/src/modules/ui/utilities/focus/hooks/__tests__/useResetFocusStackToFocusItem.test.tsx
@@ -10,13 +10,13 @@ import { RecoilRoot, useRecoilValue } from 'recoil';
 const renderHooks = () => {
   const { result } = renderHook(
     () => {
-      const pushFocusItem = usePushFocusItemToFocusStack();
-      const resetFocusStackToFocusItem = useResetFocusStackToFocusItem();
+      const { pushFocusItemToFocusStack } = usePushFocusItemToFocusStack();
+      const { resetFocusStackToFocusItem } = useResetFocusStackToFocusItem();
       const focusStack = useRecoilValue(focusStackState);
       const currentFocusId = useRecoilValue(currentFocusIdSelector);
 
       return {
-        pushFocusItem,
+        pushFocusItemToFocusStack,
         resetFocusStackToFocusItem,
         focusStack,
         currentFocusId,
@@ -59,7 +59,7 @@ describe('useResetFocusStackToFocusItem', () => {
     };
 
     await act(async () => {
-      result.current.pushFocusItem({
+      result.current.pushFocusItemToFocusStack({
         focusId: firstFocusItem.focusId,
         component: {
           type: firstFocusItem.componentInstance.componentType,
@@ -71,7 +71,7 @@ describe('useResetFocusStackToFocusItem', () => {
     });
 
     await act(async () => {
-      result.current.pushFocusItem({
+      result.current.pushFocusItemToFocusStack({
         focusId: secondFocusItem.focusId,
         component: {
           type: secondFocusItem.componentInstance.componentType,
diff --git a/packages/twenty-front/src/modules/ui/utilities/focus/hooks/usePushFocusItemToFocusStack.ts b/packages/twenty-front/src/modules/ui/utilities/focus/hooks/usePushFocusItemToFocusStack.ts
index 49173eadd..a3248b0f1 100644
--- a/packages/twenty-front/src/modules/ui/utilities/focus/hooks/usePushFocusItemToFocusStack.ts
+++ b/packages/twenty-front/src/modules/ui/utilities/focus/hooks/usePushFocusItemToFocusStack.ts
@@ -1,3 +1,4 @@
+import { DEBUG_FOCUS_STACK } from '@/ui/utilities/focus/constants/DebugFocusStack';
 import { focusStackState } from '@/ui/utilities/focus/states/focusStackState';
 import { FocusComponentType } from '@/ui/utilities/focus/types/FocusComponentType';
 import { FocusStackItem } from '@/ui/utilities/focus/types/FocusStackItem';
@@ -5,26 +6,27 @@ import { usePreviousHotkeyScope } from '@/ui/utilities/hotkey/hooks/usePreviousH
 import { GlobalHotkeysConfig } from '@/ui/utilities/hotkey/types/GlobalHotkeysConfig';
 import { HotkeyScope } from '@/ui/utilities/hotkey/types/HotkeyScope';
 import { useRecoilCallback } from 'recoil';
+import { logDebug } from '~/utils/logDebug';
+
+const addOrMoveItemToTheTopOfTheStack = ({
+  focusStackItem,
+  currentFocusStack,
+}: {
+  focusStackItem: FocusStackItem;
+  currentFocusStack: FocusStackItem[];
+}) => [
+  ...currentFocusStack.filter(
+    (currentFocusStackItem) =>
+      currentFocusStackItem.focusId !== focusStackItem.focusId,
+  ),
+  focusStackItem,
+];
 
 export const usePushFocusItemToFocusStack = () => {
   const { setHotkeyScopeAndMemorizePreviousScope } = usePreviousHotkeyScope();
 
-  const addOrMoveItemToTheTopOfTheStack = useRecoilCallback(
-    ({ set }) =>
-      (focusStackItem: FocusStackItem) => {
-        set(focusStackState, (currentFocusStack) => [
-          ...currentFocusStack.filter(
-            (currentFocusStackItem) =>
-              currentFocusStackItem.focusId !== focusStackItem.focusId,
-          ),
-          focusStackItem,
-        ]);
-      },
-    [],
-  );
-
-  return useRecoilCallback(
-    () =>
+  const pushFocusItemToFocusStack = useRecoilCallback(
+    ({ snapshot, set }) =>
       ({
         focusId,
         component,
@@ -57,7 +59,23 @@ export const usePushFocusItemToFocusStack = () => {
           },
         };
 
-        addOrMoveItemToTheTopOfTheStack(focusStackItem);
+        const currentFocusStack = snapshot
+          .getLoadable(focusStackState)
+          .getValue();
+
+        const newFocusStack = addOrMoveItemToTheTopOfTheStack({
+          focusStackItem,
+          currentFocusStack,
+        });
+
+        set(focusStackState, newFocusStack);
+
+        if (DEBUG_FOCUS_STACK) {
+          logDebug(`DEBUG: pushFocusItemToFocusStack ${focusId}`, {
+            focusStackItem,
+            newFocusStack,
+          });
+        }
 
         // TODO: Remove this once we've migrated hotkey scopes to the new api
         setHotkeyScopeAndMemorizePreviousScope({
@@ -66,6 +84,8 @@ export const usePushFocusItemToFocusStack = () => {
           memoizeKey,
         });
       },
-    [setHotkeyScopeAndMemorizePreviousScope, addOrMoveItemToTheTopOfTheStack],
+    [setHotkeyScopeAndMemorizePreviousScope],
   );
+
+  return { pushFocusItemToFocusStack };
 };
diff --git a/packages/twenty-front/src/modules/ui/utilities/focus/hooks/useRemoveFocusIdFromFocusStack.ts b/packages/twenty-front/src/modules/ui/utilities/focus/hooks/useRemoveFocusIdFromFocusStack.ts
deleted file mode 100644
index c966e92be..000000000
--- a/packages/twenty-front/src/modules/ui/utilities/focus/hooks/useRemoveFocusIdFromFocusStack.ts
+++ /dev/null
@@ -1,22 +0,0 @@
-import { focusStackState } from '@/ui/utilities/focus/states/focusStackState';
-import { usePreviousHotkeyScope } from '@/ui/utilities/hotkey/hooks/usePreviousHotkeyScope';
-import { useRecoilCallback } from 'recoil';
-
-export const useRemoveFocusIdFromFocusStack = () => {
-  const { goBackToPreviousHotkeyScope } = usePreviousHotkeyScope();
-
-  return useRecoilCallback(
-    ({ set }) =>
-      ({ focusId, memoizeKey }: { focusId: string; memoizeKey: string }) => {
-        set(focusStackState, (previousFocusStack) =>
-          previousFocusStack.filter(
-            (focusStackItem) => focusStackItem.focusId !== focusId,
-          ),
-        );
-
-        // TODO: Remove this once we've migrated hotkey scopes to the new api
-        goBackToPreviousHotkeyScope(memoizeKey);
-      },
-    [goBackToPreviousHotkeyScope],
-  );
-};
diff --git a/packages/twenty-front/src/modules/ui/utilities/focus/hooks/useRemoveFocusItemFromFocusStack.ts b/packages/twenty-front/src/modules/ui/utilities/focus/hooks/useRemoveFocusItemFromFocusStack.ts
new file mode 100644
index 000000000..787c5026f
--- /dev/null
+++ b/packages/twenty-front/src/modules/ui/utilities/focus/hooks/useRemoveFocusItemFromFocusStack.ts
@@ -0,0 +1,34 @@
+import { DEBUG_FOCUS_STACK } from '@/ui/utilities/focus/constants/DebugFocusStack';
+import { focusStackState } from '@/ui/utilities/focus/states/focusStackState';
+import { usePreviousHotkeyScope } from '@/ui/utilities/hotkey/hooks/usePreviousHotkeyScope';
+import { useRecoilCallback } from 'recoil';
+import { logDebug } from '~/utils/logDebug';
+
+export const useRemoveFocusItemFromFocusStack = () => {
+  const { goBackToPreviousHotkeyScope } = usePreviousHotkeyScope();
+
+  const removeFocusItemFromFocusStack = useRecoilCallback(
+    ({ snapshot, set }) =>
+      ({ focusId, memoizeKey }: { focusId: string; memoizeKey: string }) => {
+        const focusStack = snapshot.getLoadable(focusStackState).getValue();
+
+        const newFocusStack = focusStack.filter(
+          (focusStackItem) => focusStackItem.focusId !== focusId,
+        );
+
+        set(focusStackState, newFocusStack);
+
+        if (DEBUG_FOCUS_STACK) {
+          logDebug(`DEBUG: removeFocusItemFromFocusStack ${focusId}`, {
+            newFocusStack,
+          });
+        }
+
+        // TODO: Remove this once we've migrated hotkey scopes to the new api
+        goBackToPreviousHotkeyScope(memoizeKey);
+      },
+    [goBackToPreviousHotkeyScope],
+  );
+
+  return { removeFocusItemFromFocusStack };
+};
diff --git a/packages/twenty-front/src/modules/ui/utilities/focus/hooks/useResetFocusStack.ts b/packages/twenty-front/src/modules/ui/utilities/focus/hooks/useResetFocusStack.ts
index c22529b6a..c2728ff9d 100644
--- a/packages/twenty-front/src/modules/ui/utilities/focus/hooks/useResetFocusStack.ts
+++ b/packages/twenty-front/src/modules/ui/utilities/focus/hooks/useResetFocusStack.ts
@@ -1,18 +1,26 @@
+import { DEBUG_FOCUS_STACK } from '@/ui/utilities/focus/constants/DebugFocusStack';
 import { focusStackState } from '@/ui/utilities/focus/states/focusStackState';
 import { currentHotkeyScopeState } from '@/ui/utilities/hotkey/states/internal/currentHotkeyScopeState';
 import { previousHotkeyScopeFamilyState } from '@/ui/utilities/hotkey/states/internal/previousHotkeyScopeFamilyState';
 import { useRecoilCallback } from 'recoil';
+import { logDebug } from '~/utils/logDebug';
 
 export const useResetFocusStack = () => {
-  return useRecoilCallback(
+  const resetFocusStack = useRecoilCallback(
     ({ reset }) =>
       (memoizeKey = 'global') => {
         reset(focusStackState);
 
+        if (DEBUG_FOCUS_STACK) {
+          logDebug(`DEBUG: reset focus stack`);
+        }
+
         // TODO: Remove this once we've migrated hotkey scopes to the new api
         reset(previousHotkeyScopeFamilyState(memoizeKey as string));
         reset(currentHotkeyScopeState);
       },
     [],
   );
+
+  return { resetFocusStack };
 };
diff --git a/packages/twenty-front/src/modules/ui/utilities/focus/hooks/useResetFocusStackToFocusItem.ts b/packages/twenty-front/src/modules/ui/utilities/focus/hooks/useResetFocusStackToFocusItem.ts
index 270a8db4e..65a1b0279 100644
--- a/packages/twenty-front/src/modules/ui/utilities/focus/hooks/useResetFocusStackToFocusItem.ts
+++ b/packages/twenty-front/src/modules/ui/utilities/focus/hooks/useResetFocusStackToFocusItem.ts
@@ -1,12 +1,14 @@
+import { DEBUG_FOCUS_STACK } from '@/ui/utilities/focus/constants/DebugFocusStack';
 import { focusStackState } from '@/ui/utilities/focus/states/focusStackState';
 import { FocusStackItem } from '@/ui/utilities/focus/types/FocusStackItem';
 import { currentHotkeyScopeState } from '@/ui/utilities/hotkey/states/internal/currentHotkeyScopeState';
 import { previousHotkeyScopeFamilyState } from '@/ui/utilities/hotkey/states/internal/previousHotkeyScopeFamilyState';
 import { HotkeyScope } from '@/ui/utilities/hotkey/types/HotkeyScope';
 import { useRecoilCallback } from 'recoil';
+import { logDebug } from '~/utils/logDebug';
 
 export const useResetFocusStackToFocusItem = () => {
-  return useRecoilCallback(
+  const resetFocusStackToFocusItem = useRecoilCallback(
     ({ set }) =>
       ({
         focusStackItem,
@@ -19,10 +21,18 @@ export const useResetFocusStackToFocusItem = () => {
       }) => {
         set(focusStackState, [focusStackItem]);
 
+        if (DEBUG_FOCUS_STACK) {
+          logDebug(`DEBUG: reset focus stack to focus item`, {
+            focusStackItem,
+          });
+        }
+
         // TODO: Remove this once we've migrated hotkey scopes to the new api
         set(previousHotkeyScopeFamilyState(memoizeKey), null);
         set(currentHotkeyScopeState, hotkeyScope);
       },
     [],
   );
+
+  return { resetFocusStackToFocusItem };
 };
diff --git a/packages/twenty-front/src/modules/ui/utilities/focus/types/FocusComponentType.ts b/packages/twenty-front/src/modules/ui/utilities/focus/types/FocusComponentType.ts
index 7562a2d4e..b758bcacd 100644
--- a/packages/twenty-front/src/modules/ui/utilities/focus/types/FocusComponentType.ts
+++ b/packages/twenty-front/src/modules/ui/utilities/focus/types/FocusComponentType.ts
@@ -1,3 +1,6 @@
 export enum FocusComponentType {
   MODAL = 'modal',
+  DROPDOWN = 'dropdown',
+  SIDE_PANEL = 'side-panel',
+  OPEN_FIELD_INPUT = 'open-field-input',
 }
diff --git a/packages/twenty-front/src/modules/ui/utilities/hotkey/components/HotkeyEffect.tsx b/packages/twenty-front/src/modules/ui/utilities/hotkey/components/HotkeyEffect.tsx
index 1f2e604b5..28dd767e8 100644
--- a/packages/twenty-front/src/modules/ui/utilities/hotkey/components/HotkeyEffect.tsx
+++ b/packages/twenty-front/src/modules/ui/utilities/hotkey/components/HotkeyEffect.tsx
@@ -1,22 +1,28 @@
 import { Keys } from 'react-hotkeys-hook';
 
-import { useScopedHotkeys } from '@/ui/utilities/hotkey/hooks/useScopedHotkeys';
+import { DropdownHotkeyScope } from '@/ui/layout/dropdown/constants/DropdownHotkeyScope';
+import { useHotkeysOnFocusedElement } from '@/ui/utilities/hotkey/hooks/useHotkeysOnFocusedElement';
 
 type HotkeyEffectProps = {
   hotkey: {
     key: Keys;
-    scope: string;
   };
   onHotkeyTriggered: () => void;
+  focusId: string;
 };
 
 export const HotkeyEffect = ({
   hotkey,
+  focusId,
   onHotkeyTriggered,
 }: HotkeyEffectProps) => {
-  useScopedHotkeys(hotkey.key, () => onHotkeyTriggered(), hotkey.scope, [
-    onHotkeyTriggered,
-  ]);
+  useHotkeysOnFocusedElement({
+    keys: hotkey.key,
+    callback: onHotkeyTriggered,
+    focusId,
+    scope: DropdownHotkeyScope.Dropdown,
+    dependencies: [onHotkeyTriggered],
+  });
 
   return <></>;
 };
diff --git a/packages/twenty-front/src/modules/ui/utilities/hotkey/hooks/useHotkeysOnFocusedElementCallback.ts b/packages/twenty-front/src/modules/ui/utilities/hotkey/hooks/useHotkeysOnFocusedElementCallback.ts
index 1f4023799..30aca7199 100644
--- a/packages/twenty-front/src/modules/ui/utilities/hotkey/hooks/useHotkeysOnFocusedElementCallback.ts
+++ b/packages/twenty-front/src/modules/ui/utilities/hotkey/hooks/useHotkeysOnFocusedElementCallback.ts
@@ -49,7 +49,7 @@ export const useHotkeysOnFocusedElementCallback = (
                 hotkeysEvent.keys
               }) because I'm in scope [${scope}] and the active scopes are : [${currentHotkeyScopes.join(
                 ', ',
-              )}] and the current focus identifier is [${focusId}]`,
+              )}] and the current focus identifier is [${currentFocusId}], and the focusId is [${focusId}]`,
               'color: gray; ',
             );
           }
@@ -63,7 +63,7 @@ export const useHotkeysOnFocusedElementCallback = (
               hotkeysEvent.keys
             }) because I'm in scope [${scope}] and the active scopes are : [${currentHotkeyScopes.join(
               ', ',
-            )}], and the current focus identifier is [${focusId}]`,
+            )}], and the current focus identifier is [${currentFocusId}], and the focusId is [${focusId}]`,
             'color: green;',
           );
         }
diff --git a/packages/twenty-front/src/modules/views/components/AdvancedFilterDropdownButton.tsx b/packages/twenty-front/src/modules/views/components/AdvancedFilterDropdownButton.tsx
index 2c63d267c..abef1667c 100644
--- a/packages/twenty-front/src/modules/views/components/AdvancedFilterDropdownButton.tsx
+++ b/packages/twenty-front/src/modules/views/components/AdvancedFilterDropdownButton.tsx
@@ -29,7 +29,6 @@ export const AdvancedFilterDropdownButton = () => {
       dropdownId={ADVANCED_FILTER_DROPDOWN_ID}
       clickableComponent={<AdvancedFilterChip />}
       dropdownComponents={<AdvancedFilterRootRecordFilterGroup />}
-      dropdownHotkeyScope={{ scope: ADVANCED_FILTER_DROPDOWN_ID }}
       dropdownOffset={{ y: 8, x: 0 }}
       dropdownPlacement="bottom-start"
       onOpen={handleOpenAdvancedFilterDropdown}
diff --git a/packages/twenty-front/src/modules/views/components/EditableFilterDropdownButton.tsx b/packages/twenty-front/src/modules/views/components/EditableFilterDropdownButton.tsx
index acad6f466..468c589b5 100644
--- a/packages/twenty-front/src/modules/views/components/EditableFilterDropdownButton.tsx
+++ b/packages/twenty-front/src/modules/views/components/EditableFilterDropdownButton.tsx
@@ -3,7 +3,6 @@ import { useCallback } from 'react';
 import { RecordFilter } from '@/object-record/record-filter/types/RecordFilter';
 import { Dropdown } from '@/ui/layout/dropdown/components/Dropdown';
 import { useDropdown } from '@/ui/layout/dropdown/hooks/useDropdown';
-import { HotkeyScope } from '@/ui/utilities/hotkey/types/HotkeyScope';
 import { EditableFilterChip } from '@/views/components/EditableFilterChip';
 
 import { ObjectFilterDropdownFilterInput } from '@/object-record/object-filter-dropdown/components/ObjectFilterDropdownFilterInput';
@@ -13,12 +12,10 @@ import { useSetEditableFilterChipDropdownStates } from '@/views/hooks/useSetEdit
 
 type EditableFilterDropdownButtonProps = {
   recordFilter: RecordFilter;
-  hotkeyScope: HotkeyScope;
 };
 
 export const EditableFilterDropdownButton = ({
   recordFilter,
-  hotkeyScope,
 }: EditableFilterDropdownButtonProps) => {
   const { closeDropdown } = useDropdown(recordFilter.id);
 
@@ -59,7 +56,6 @@ export const EditableFilterDropdownButton = ({
         dropdownComponents={
           <ObjectFilterDropdownFilterInput filterDropdownId={recordFilter.id} />
         }
-        dropdownHotkeyScope={hotkeyScope}
         dropdownOffset={{ y: 8, x: 0 }}
         dropdownPlacement="bottom-start"
         onClose={onFilterDropdownClose}
diff --git a/packages/twenty-front/src/modules/views/components/UpdateViewButtonGroup.tsx b/packages/twenty-front/src/modules/views/components/UpdateViewButtonGroup.tsx
index 33be2ba16..639e9f933 100644
--- a/packages/twenty-front/src/modules/views/components/UpdateViewButtonGroup.tsx
+++ b/packages/twenty-front/src/modules/views/components/UpdateViewButtonGroup.tsx
@@ -34,9 +34,7 @@ export type UpdateViewButtonGroupProps = {
   hotkeyScope: HotkeyScope;
 };
 
-export const UpdateViewButtonGroup = ({
-  hotkeyScope,
-}: UpdateViewButtonGroupProps) => {
+export const UpdateViewButtonGroup = () => {
   const { saveCurrentViewFilterAndSorts } = useSaveCurrentViewFiltersAndSorts();
 
   const { setViewPickerMode } = useViewPickerMode();
@@ -109,7 +107,6 @@ export const UpdateViewButtonGroup = ({
           <Button title="Update view" onClick={handleUpdateViewClick} />
           <Dropdown
             dropdownId={UPDATE_VIEW_BUTTON_DROPDOWN_ID}
-            dropdownHotkeyScope={hotkeyScope}
             clickableComponent={
               <IconButton
                 size="small"
diff --git a/packages/twenty-front/src/modules/views/components/ViewBar.tsx b/packages/twenty-front/src/modules/views/components/ViewBar.tsx
index 494d8ae31..3aaa46c33 100644
--- a/packages/twenty-front/src/modules/views/components/ViewBar.tsx
+++ b/packages/twenty-front/src/modules/views/components/ViewBar.tsx
@@ -8,10 +8,8 @@ import { QueryParamsFiltersEffect } from '@/views/components/QueryParamsFiltersE
 import { ViewBarPageTitle } from '@/views/components/ViewBarPageTitle';
 import { ViewBarSkeletonLoader } from '@/views/components/ViewBarSkeletonLoader';
 import { ViewPickerDropdown } from '@/views/view-picker/components/ViewPickerDropdown';
-import { ViewsHotkeyScope } from '../types/ViewsHotkeyScope';
 
 import { ObjectFilterDropdownComponentInstanceContext } from '@/object-record/object-filter-dropdown/states/contexts/ObjectFilterDropdownComponentInstanceContext';
-import { FiltersHotkeyScope } from '@/object-record/object-filter-dropdown/types/FiltersHotkeyScope';
 import { VIEW_SORT_DROPDOWN_ID } from '@/object-record/object-sort-dropdown/constants/ViewSortDropdownId';
 import { ObjectSortDropdownComponentInstanceContext } from '@/object-record/object-sort-dropdown/states/context/ObjectSortDropdownComponentInstanceContext';
 import { ViewBarFilterDropdown } from '@/views/components/ViewBarFilterDropdown';
@@ -59,17 +57,9 @@ export const ViewBar = ({
             <ObjectFilterDropdownComponentInstanceContext.Provider
               value={{ instanceId: VIEW_BAR_FILTER_DROPDOWN_ID }}
             >
-              <ViewBarFilterDropdown
-                hotkeyScope={{
-                  scope: FiltersHotkeyScope.ObjectFilterDropdownButton,
-                }}
-              />
+              <ViewBarFilterDropdown />
             </ObjectFilterDropdownComponentInstanceContext.Provider>
-            <ObjectSortDropdownButton
-              hotkeyScope={{
-                scope: FiltersHotkeyScope.ObjectSortDropdownButton,
-              }}
-            />
+            <ObjectSortDropdownButton />
             {optionsDropdownButton}
           </>
         }
@@ -78,13 +68,7 @@ export const ViewBar = ({
             hasFilterButton
             viewBarId={viewBarId}
             objectNamePlural={objectNamePlural}
-            rightComponent={
-              <UpdateViewButtonGroup
-                hotkeyScope={{
-                  scope: ViewsHotkeyScope.UpdateViewButtonDropdown,
-                }}
-              />
-            }
+            rightComponent={<UpdateViewButtonGroup />}
           />
         }
       />
diff --git a/packages/twenty-front/src/modules/views/components/ViewBarDetails.tsx b/packages/twenty-front/src/modules/views/components/ViewBarDetails.tsx
index 07b7da1fa..20881a6d9 100644
--- a/packages/twenty-front/src/modules/views/components/ViewBarDetails.tsx
+++ b/packages/twenty-front/src/modules/views/components/ViewBarDetails.tsx
@@ -229,12 +229,7 @@ export const ViewBarDetails = ({
                 value={{ instanceId: recordFilter.id }}
               >
                 <DropdownScope dropdownScopeId={recordFilter.id}>
-                  <EditableFilterDropdownButton
-                    recordFilter={recordFilter}
-                    hotkeyScope={{
-                      scope: recordFilter.id,
-                    }}
-                  />
+                  <EditableFilterDropdownButton recordFilter={recordFilter} />
                 </DropdownScope>
               </ObjectFilterDropdownComponentInstanceContext.Provider>
             ))}
diff --git a/packages/twenty-front/src/modules/views/components/ViewBarFilterButton.tsx b/packages/twenty-front/src/modules/views/components/ViewBarFilterButton.tsx
index 835ffdac4..305798f2f 100644
--- a/packages/twenty-front/src/modules/views/components/ViewBarFilterButton.tsx
+++ b/packages/twenty-front/src/modules/views/components/ViewBarFilterButton.tsx
@@ -1,26 +1,13 @@
-import { useResetFilterDropdown } from '@/object-record/object-filter-dropdown/hooks/useResetFilterDropdown';
 import { StyledHeaderDropdownButton } from '@/ui/layout/dropdown/components/StyledHeaderDropdownButton';
 import { useDropdown } from '@/ui/layout/dropdown/hooks/useDropdown';
 import { VIEW_BAR_FILTER_DROPDOWN_ID } from '@/views/constants/ViewBarFilterDropdownId';
 import { Trans } from '@lingui/react/macro';
 
 export const ViewBarFilterButton = () => {
-  const { resetFilterDropdown } = useResetFilterDropdown();
-
-  const { toggleDropdown, isDropdownOpen } = useDropdown(
-    VIEW_BAR_FILTER_DROPDOWN_ID,
-  );
-
-  const handleClick = () => {
-    toggleDropdown();
-    resetFilterDropdown();
-  };
+  const { isDropdownOpen } = useDropdown(VIEW_BAR_FILTER_DROPDOWN_ID);
 
   return (
-    <StyledHeaderDropdownButton
-      onClick={handleClick}
-      isUnfolded={isDropdownOpen}
-    >
+    <StyledHeaderDropdownButton isUnfolded={isDropdownOpen}>
       <Trans>Filter</Trans>
     </StyledHeaderDropdownButton>
   );
diff --git a/packages/twenty-front/src/modules/views/components/ViewBarFilterDropdown.tsx b/packages/twenty-front/src/modules/views/components/ViewBarFilterDropdown.tsx
index 0ebb66515..d93ca6d7b 100644
--- a/packages/twenty-front/src/modules/views/components/ViewBarFilterDropdown.tsx
+++ b/packages/twenty-front/src/modules/views/components/ViewBarFilterDropdown.tsx
@@ -1,6 +1,5 @@
 import { useResetFilterDropdown } from '@/object-record/object-filter-dropdown/hooks/useResetFilterDropdown';
 import { Dropdown } from '@/ui/layout/dropdown/components/Dropdown';
-import { HotkeyScope } from '@/ui/utilities/hotkey/types/HotkeyScope';
 import { VIEW_BAR_FILTER_DROPDOWN_ID } from '@/views/constants/ViewBarFilterDropdownId';
 import { useVectorSearchFilterActions } from '@/views/hooks/useVectorSearchFilterActions';
 
@@ -13,13 +12,7 @@ import { ViewBarFilterDropdownContent } from '@/views/components/ViewBarFilterDr
 import { isDefined } from 'twenty-shared/utils';
 import { ViewBarFilterButton } from './ViewBarFilterButton';
 
-type ViewBarFilterDropdownProps = {
-  hotkeyScope: HotkeyScope;
-};
-
-export const ViewBarFilterDropdown = ({
-  hotkeyScope,
-}: ViewBarFilterDropdownProps) => {
+export const ViewBarFilterDropdown = () => {
   const { resetFilterDropdown } = useResetFilterDropdown();
   const { removeEmptyVectorSearchFilter } = useVectorSearchFilterActions();
   const { removeRecordFilter } = useRemoveRecordFilter();
@@ -47,13 +40,17 @@ export const ViewBarFilterDropdown = ({
     removeEmptyVectorSearchFilter();
   };
 
+  const handleDropdownOpen = () => {
+    resetFilterDropdown();
+  };
+
   return (
     <Dropdown
       dropdownId={VIEW_BAR_FILTER_DROPDOWN_ID}
       onClose={handleDropdownClose}
+      onOpen={handleDropdownOpen}
       clickableComponent={<ViewBarFilterButton />}
       dropdownComponents={<ViewBarFilterDropdownContent />}
-      dropdownHotkeyScope={hotkeyScope}
       dropdownOffset={{ y: 8 }}
       onClickOutside={handleDropdownClickOutside}
       excludedClickOutsideIds={[OPERAND_DROPDOWN_CLICK_OUTSIDE_ID]}
diff --git a/packages/twenty-front/src/modules/views/components/ViewBarFilterDropdownAdvancedFilterButton.tsx b/packages/twenty-front/src/modules/views/components/ViewBarFilterDropdownAdvancedFilterButton.tsx
index bfef615e8..596847e39 100644
--- a/packages/twenty-front/src/modules/views/components/ViewBarFilterDropdownAdvancedFilterButton.tsx
+++ b/packages/twenty-front/src/modules/views/components/ViewBarFilterDropdownAdvancedFilterButton.tsx
@@ -119,9 +119,7 @@ export const ViewBarFilterDropdownAdvancedFilterButton = () => {
     }
 
     closeObjectFilterDropdown();
-    openAdvancedFilterDropdown({
-      scope: ADVANCED_FILTER_DROPDOWN_ID,
-    });
+    openAdvancedFilterDropdown();
   };
 
   return (
diff --git a/packages/twenty-front/src/modules/views/components/ViewBarFilterDropdownFieldSelectMenu.tsx b/packages/twenty-front/src/modules/views/components/ViewBarFilterDropdownFieldSelectMenu.tsx
index 05a1c5895..20d1d632f 100644
--- a/packages/twenty-front/src/modules/views/components/ViewBarFilterDropdownFieldSelectMenu.tsx
+++ b/packages/twenty-front/src/modules/views/components/ViewBarFilterDropdownFieldSelectMenu.tsx
@@ -10,15 +10,16 @@ import { SelectableList } from '@/ui/layout/selectable-list/components/Selectabl
 
 import { FILTER_FIELD_LIST_ID } from '@/object-record/object-filter-dropdown/constants/FilterFieldListId';
 import { useFilterDropdownSelectableFieldMetadataItems } from '@/object-record/object-filter-dropdown/hooks/useFilterDropdownSelectableFieldMetadataItems';
-import { FiltersHotkeyScope } from '@/object-record/object-filter-dropdown/types/FiltersHotkeyScope';
 import { DropdownContent } from '@/ui/layout/dropdown/components/DropdownContent';
 import { DropdownMenuSectionLabel } from '@/ui/layout/dropdown/components/DropdownMenuSectionLabel';
 import { useRecoilComponentStateV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentStateV2';
 import { ViewBarFilterDropdownBottomMenu } from '@/views/components/ViewBarFilterDropdownBottomMenu';
 import { ViewBarFilterDropdownFieldSelectMenuItem } from '@/views/components/ViewBarFilterDropdownFieldSelectMenuItem';
 
+import { DropdownHotkeyScope } from '@/ui/layout/dropdown/constants/DropdownHotkeyScope';
 import { GenericDropdownContentWidth } from '@/ui/layout/dropdown/constants/GenericDropdownContentWidth';
 import { VIEW_BAR_FILTER_BOTTOM_MENU_ITEM_IDS } from '@/views/constants/ViewBarFilterBottomMenuItemIds';
+import { VIEW_BAR_FILTER_DROPDOWN_ID } from '@/views/constants/ViewBarFilterDropdownId';
 import { useLingui } from '@lingui/react/macro';
 
 export const StyledInput = styled.input`
@@ -92,9 +93,10 @@ export const ViewBarFilterDropdownFieldSelectMenu = () => {
         }
       />
       <SelectableList
-        hotkeyScope={FiltersHotkeyScope.ObjectFilterDropdownButton}
         selectableItemIdArray={selectableFieldMetadataItemIds}
         selectableListInstanceId={FILTER_FIELD_LIST_ID}
+        focusId={VIEW_BAR_FILTER_DROPDOWN_ID}
+        hotkeyScope={DropdownHotkeyScope.Dropdown}
       >
         {shouldShowVisibleFields && (
           <>
diff --git a/packages/twenty-front/src/modules/views/hooks/__tests__/useInitializeFilterOnFieldMetadataItemFromViewBarFilterDropdown.test.test.tsx b/packages/twenty-front/src/modules/views/hooks/__tests__/useInitializeFilterOnFieldMetadataItemFromViewBarFilterDropdown.test.test.tsx
index 77d558b12..3cd5a8841 100644
--- a/packages/twenty-front/src/modules/views/hooks/__tests__/useInitializeFilterOnFieldMetadataItemFromViewBarFilterDropdown.test.test.tsx
+++ b/packages/twenty-front/src/modules/views/hooks/__tests__/useInitializeFilterOnFieldMetadataItemFromViewBarFilterDropdown.test.test.tsx
@@ -15,16 +15,20 @@ import { RecordFiltersComponentInstanceContext } from '@/object-record/record-fi
 import { currentRecordFiltersComponentState } from '@/object-record/record-filter/states/currentRecordFiltersComponentState';
 import { RecordFilter } from '@/object-record/record-filter/types/RecordFilter';
 import { getRecordFilterOperands } from '@/object-record/record-filter/utils/getRecordFilterOperands';
-import { SingleRecordPickerHotkeyScope } from '@/object-record/record-picker/single-record-picker/types/SingleRecordPickerHotkeyScope';
+import { DropdownHotkeyScope } from '@/ui/layout/dropdown/constants/DropdownHotkeyScope';
+import { FocusComponentType } from '@/ui/utilities/focus/types/FocusComponentType';
 import { useRecoilComponentValueV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentValueV2';
 import { useSetRecoilComponentStateV2 } from '@/ui/utilities/state/component-state/hooks/useSetRecoilComponentStateV2';
+import { VIEW_BAR_FILTER_DROPDOWN_ID } from '@/views/constants/ViewBarFilterDropdownId';
 import { generatedMockObjectMetadataItems } from '~/testing/mock-data/generatedMockObjectMetadataItems';
 import { getMockPersonObjectMetadataItem } from '~/testing/mock-data/people';
 
-const mockSetHotkeyScope = jest.fn();
+const mockPushFocusItemToFocusStack = jest.fn();
 
-jest.mock('@/ui/utilities/hotkey/hooks/useSetHotkeyScope', () => ({
-  useSetHotkeyScope: () => mockSetHotkeyScope,
+jest.mock('@/ui/utilities/focus/hooks/usePushFocusItemToFocusStack', () => ({
+  usePushFocusItemToFocusStack: () => ({
+    pushFocusItemToFocusStack: mockPushFocusItemToFocusStack,
+  }),
 }));
 
 const peopleObjectMetadataItemMock = getMockPersonObjectMetadataItem();
@@ -109,7 +113,7 @@ describe('useInitializeFilterOnFieldMetadataItemFromViewBarFilterDropdown', () =
     );
     expect(result.current.objectFilterDropdownFilterIsSelected).toBe(true);
     expect(result.current.selectedOperandInDropdown).toBe(defaultOperand);
-    expect(mockSetHotkeyScope).not.toHaveBeenCalled();
+    expect(mockPushFocusItemToFocusStack).not.toHaveBeenCalled();
   });
 
   it('should initialize filter with a relation field', () => {
@@ -161,9 +165,17 @@ describe('useInitializeFilterOnFieldMetadataItemFromViewBarFilterDropdown', () =
     );
     expect(result.current.objectFilterDropdownFilterIsSelected).toBe(true);
     expect(result.current.selectedOperandInDropdown).toBe(defaultOperand);
-    expect(mockSetHotkeyScope).toHaveBeenCalledWith(
-      SingleRecordPickerHotkeyScope.SingleRecordPicker,
-    );
+    expect(mockPushFocusItemToFocusStack).toHaveBeenCalledWith({
+      focusId: VIEW_BAR_FILTER_DROPDOWN_ID,
+      component: {
+        type: FocusComponentType.DROPDOWN,
+        instanceId: personCompanyFieldMetadataItemMock.id,
+      },
+      hotkeyScope: {
+        scope: DropdownHotkeyScope.Dropdown,
+      },
+      memoizeKey: personCompanyFieldMetadataItemMock.id,
+    });
   });
 
   it('should initialize filter with a duplicate field on city', () => {
diff --git a/packages/twenty-front/src/modules/views/hooks/useInitializeFilterOnFieldMetadataItemFromViewBarFilterDropdown.ts b/packages/twenty-front/src/modules/views/hooks/useInitializeFilterOnFieldMetadataItemFromViewBarFilterDropdown.ts
index 09e41497c..62eb3f2d0 100644
--- a/packages/twenty-front/src/modules/views/hooks/useInitializeFilterOnFieldMetadataItemFromViewBarFilterDropdown.ts
+++ b/packages/twenty-front/src/modules/views/hooks/useInitializeFilterOnFieldMetadataItemFromViewBarFilterDropdown.ts
@@ -10,9 +10,11 @@ import { RecordFilter } from '@/object-record/record-filter/types/RecordFilter';
 import { findDuplicateRecordFilterInNonAdvancedRecordFilters } from '@/object-record/record-filter/utils/findDuplicateRecordFilterInNonAdvancedRecordFilters';
 import { getDateFilterDisplayValue } from '@/object-record/record-filter/utils/getDateFilterDisplayValue';
 import { getRecordFilterOperands } from '@/object-record/record-filter/utils/getRecordFilterOperands';
-import { SingleRecordPickerHotkeyScope } from '@/object-record/record-picker/single-record-picker/types/SingleRecordPickerHotkeyScope';
-import { useSetHotkeyScope } from '@/ui/utilities/hotkey/hooks/useSetHotkeyScope';
+import { DropdownHotkeyScope } from '@/ui/layout/dropdown/constants/DropdownHotkeyScope';
+import { usePushFocusItemToFocusStack } from '@/ui/utilities/focus/hooks/usePushFocusItemToFocusStack';
+import { FocusComponentType } from '@/ui/utilities/focus/types/FocusComponentType';
 import { useRecoilComponentCallbackStateV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentCallbackStateV2';
+import { VIEW_BAR_FILTER_DROPDOWN_ID } from '@/views/constants/ViewBarFilterDropdownId';
 import { useRecoilCallback } from 'recoil';
 import { isDefined } from 'twenty-shared/utils';
 import { v4 } from 'uuid';
@@ -24,8 +26,6 @@ export const useInitializeFilterOnFieldMetadataItemFromViewBarFilterDropdown =
         selectedOperandInDropdownComponentState,
       );
 
-    const setHotkeyScope = useSetHotkeyScope();
-
     const currentRecordFiltersCallbackState = useRecoilComponentCallbackStateV2(
       currentRecordFiltersComponentState,
     );
@@ -48,6 +48,8 @@ export const useInitializeFilterOnFieldMetadataItemFromViewBarFilterDropdown =
     const { upsertObjectFilterDropdownCurrentFilter } =
       useUpsertObjectFilterDropdownCurrentFilter();
 
+    const { pushFocusItemToFocusStack } = usePushFocusItemToFocusStack();
+
     const initializeFilterOnFieldMetataItemFromViewBarFilterDropdown =
       useRecoilCallback(
         ({ set, snapshot }) =>
@@ -66,7 +68,17 @@ export const useInitializeFilterOnFieldMetadataItemFromViewBarFilterDropdown =
             );
 
             if (filterType === 'RELATION' || filterType === 'SELECT') {
-              setHotkeyScope(SingleRecordPickerHotkeyScope.SingleRecordPicker);
+              pushFocusItemToFocusStack({
+                focusId: VIEW_BAR_FILTER_DROPDOWN_ID,
+                component: {
+                  type: FocusComponentType.DROPDOWN,
+                  instanceId: fieldMetadataItem.id,
+                },
+                hotkeyScope: {
+                  scope: DropdownHotkeyScope.Dropdown,
+                },
+                memoizeKey: fieldMetadataItem.id,
+              });
             }
 
             set(objectFilterDropdownFilterIsSelectedCallbackState, true);
@@ -130,11 +142,11 @@ export const useInitializeFilterOnFieldMetadataItemFromViewBarFilterDropdown =
           },
         [
           fieldMetadataItemUsedInDropdownCallbackState,
+          currentRecordFiltersCallbackState,
+          objectFilterDropdownFilterIsSelectedCallbackState,
+          pushFocusItemToFocusStack,
           objectFilterDropdownCurrentRecordFilterCallbackState,
           selectedOperandInDropdownCallbackState,
-          setHotkeyScope,
-          objectFilterDropdownFilterIsSelectedCallbackState,
-          currentRecordFiltersCallbackState,
           upsertObjectFilterDropdownCurrentFilter,
         ],
       );
diff --git a/packages/twenty-front/src/modules/views/types/ViewsHotkeyScope.ts b/packages/twenty-front/src/modules/views/types/ViewsHotkeyScope.ts
deleted file mode 100644
index 6e68490b1..000000000
--- a/packages/twenty-front/src/modules/views/types/ViewsHotkeyScope.ts
+++ /dev/null
@@ -1,4 +0,0 @@
-export enum ViewsHotkeyScope {
-  ListDropdown = 'views-list-dropdown',
-  UpdateViewButtonDropdown = 'update-view-button-dropdown',
-}
diff --git a/packages/twenty-front/src/modules/views/view-picker/components/ViewPickerContentCreateMode.tsx b/packages/twenty-front/src/modules/views/view-picker/components/ViewPickerContentCreateMode.tsx
index 03f452593..6f915f0ed 100644
--- a/packages/twenty-front/src/modules/views/view-picker/components/ViewPickerContentCreateMode.tsx
+++ b/packages/twenty-front/src/modules/views/view-picker/components/ViewPickerContentCreateMode.tsx
@@ -10,18 +10,18 @@ import { DropdownMenuHeader } from '@/ui/layout/dropdown/components/DropdownMenu
 import { DropdownMenuHeaderLeftComponent } from '@/ui/layout/dropdown/components/DropdownMenuHeader/internal/DropdownMenuHeaderLeftComponent';
 import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer';
 import { DropdownMenuSeparator } from '@/ui/layout/dropdown/components/DropdownMenuSeparator';
-import { useScopedHotkeys } from '@/ui/utilities/hotkey/hooks/useScopedHotkeys';
-import { useSetHotkeyScope } from '@/ui/utilities/hotkey/hooks/useSetHotkeyScope';
+import { DropdownHotkeyScope } from '@/ui/layout/dropdown/constants/DropdownHotkeyScope';
+import { useHotkeysOnFocusedElement } from '@/ui/utilities/hotkey/hooks/useHotkeysOnFocusedElement';
 import { useRecoilComponentStateV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentStateV2';
 import { useRecoilComponentValueV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentValueV2';
 import { useSetRecoilComponentStateV2 } from '@/ui/utilities/state/component-state/hooks/useSetRecoilComponentStateV2';
 import { viewObjectMetadataIdComponentState } from '@/views/states/viewObjectMetadataIdComponentState';
 import { ViewType, viewTypeIconMapping } from '@/views/types/ViewType';
-import { ViewsHotkeyScope } from '@/views/types/ViewsHotkeyScope';
 import { ViewPickerCreateButton } from '@/views/view-picker/components/ViewPickerCreateButton';
 import { ViewPickerIconAndNameContainer } from '@/views/view-picker/components/ViewPickerIconAndNameContainer';
 import { ViewPickerSaveButtonContainer } from '@/views/view-picker/components/ViewPickerSaveButtonContainer';
 import { ViewPickerSelectContainer } from '@/views/view-picker/components/ViewPickerSelectContainer';
+import { VIEW_PICKER_DROPDOWN_ID } from '@/views/view-picker/constants/ViewPickerDropdownId';
 import { VIEW_PICKER_KANBAN_FIELD_DROPDOWN_ID } from '@/views/view-picker/constants/ViewPickerKanbanFieldDropdownId';
 import { VIEW_PICKER_TYPE_SELECT_OPTIONS } from '@/views/view-picker/constants/ViewPickerTypeSelectOptions';
 import { VIEW_PICKER_VIEW_TYPE_DROPDOWN_ID } from '@/views/view-picker/constants/ViewPickerViewTypeDropdownId';
@@ -78,15 +78,13 @@ export const ViewPickerContentCreateMode = () => {
     viewPickerTypeComponentState,
   );
 
-  const setHotkeyScope = useSetHotkeyScope();
-
   const { createViewFromCurrentState } = useCreateViewFromCurrentState();
 
   const { availableFieldsForKanban } = useGetAvailableFieldsForKanban();
 
-  useScopedHotkeys(
-    Key.Enter,
-    async () => {
+  useHotkeysOnFocusedElement({
+    keys: [Key.Enter],
+    callback: async () => {
       if (viewPickerIsPersisting) {
         return;
       }
@@ -100,8 +98,15 @@ export const ViewPickerContentCreateMode = () => {
 
       await createViewFromCurrentState();
     },
-    ViewsHotkeyScope.ListDropdown,
-  );
+    focusId: VIEW_PICKER_DROPDOWN_ID,
+    scope: DropdownHotkeyScope.Dropdown,
+    dependencies: [
+      viewPickerIsPersisting,
+      createViewFromCurrentState,
+      viewPickerType,
+      availableFieldsForKanban,
+    ],
+  });
 
   const defaultIcon = viewTypeIconMapping(viewPickerType).displayName;
 
@@ -141,11 +146,7 @@ export const ViewPickerContentCreateMode = () => {
       </DropdownMenuHeader>
       <DropdownMenuItemsContainer>
         <ViewPickerIconAndNameContainer>
-          <IconPicker
-            onChange={onIconChange}
-            selectedIconKey={selectedIcon}
-            onClose={() => setHotkeyScope(ViewsHotkeyScope.ListDropdown)}
-          />
+          <IconPicker onChange={onIconChange} selectedIconKey={selectedIcon} />
           <TextInputV2
             value={viewPickerInputName}
             onChange={(value) => {
diff --git a/packages/twenty-front/src/modules/views/view-picker/components/ViewPickerContentEditMode.tsx b/packages/twenty-front/src/modules/views/view-picker/components/ViewPickerContentEditMode.tsx
index 32faaf5ff..d3183ae48 100644
--- a/packages/twenty-front/src/modules/views/view-picker/components/ViewPickerContentEditMode.tsx
+++ b/packages/twenty-front/src/modules/views/view-picker/components/ViewPickerContentEditMode.tsx
@@ -7,15 +7,15 @@ import { DropdownMenuHeader } from '@/ui/layout/dropdown/components/DropdownMenu
 import { DropdownMenuHeaderLeftComponent } from '@/ui/layout/dropdown/components/DropdownMenuHeader/internal/DropdownMenuHeaderLeftComponent';
 import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer';
 import { DropdownMenuSeparator } from '@/ui/layout/dropdown/components/DropdownMenuSeparator';
-import { useScopedHotkeys } from '@/ui/utilities/hotkey/hooks/useScopedHotkeys';
-import { useSetHotkeyScope } from '@/ui/utilities/hotkey/hooks/useSetHotkeyScope';
+import { DropdownHotkeyScope } from '@/ui/layout/dropdown/constants/DropdownHotkeyScope';
+import { useHotkeysOnFocusedElement } from '@/ui/utilities/hotkey/hooks/useHotkeysOnFocusedElement';
 import { useRecoilComponentStateV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentStateV2';
 import { useRecoilComponentValueV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentValueV2';
 import { useSetRecoilComponentStateV2 } from '@/ui/utilities/state/component-state/hooks/useSetRecoilComponentStateV2';
-import { ViewsHotkeyScope } from '@/views/types/ViewsHotkeyScope';
 import { ViewPickerEditButton } from '@/views/view-picker/components/ViewPickerEditButton';
 import { ViewPickerIconAndNameContainer } from '@/views/view-picker/components/ViewPickerIconAndNameContainer';
 import { ViewPickerSaveButtonContainer } from '@/views/view-picker/components/ViewPickerSaveButtonContainer';
+import { VIEW_PICKER_DROPDOWN_ID } from '@/views/view-picker/constants/ViewPickerDropdownId';
 import { useUpdateViewFromCurrentState } from '@/views/view-picker/hooks/useUpdateViewFromCurrentState';
 import { useViewPickerMode } from '@/views/view-picker/hooks/useViewPickerMode';
 import { viewPickerInputNameComponentState } from '@/views/view-picker/states/viewPickerInputNameComponentState';
@@ -39,21 +39,21 @@ export const ViewPickerContentEditMode = () => {
     viewPickerIsDirtyComponentState,
   );
 
-  const setHotkeyScope = useSetHotkeyScope();
-
   const { updateViewFromCurrentState } = useUpdateViewFromCurrentState();
 
-  useScopedHotkeys(
-    Key.Enter,
-    async () => {
+  useHotkeysOnFocusedElement({
+    keys: [Key.Enter],
+    callback: async () => {
       if (viewPickerIsPersisting) {
         return;
       }
 
       await updateViewFromCurrentState();
     },
-    ViewsHotkeyScope.ListDropdown,
-  );
+    focusId: VIEW_PICKER_DROPDOWN_ID,
+    scope: DropdownHotkeyScope.Dropdown,
+    dependencies: [viewPickerIsPersisting, updateViewFromCurrentState],
+  });
 
   const onIconChange = ({ iconKey }: { iconKey: string }) => {
     setViewPickerIsDirty(true);
@@ -83,7 +83,6 @@ export const ViewPickerContentEditMode = () => {
           <IconPicker
             onChange={onIconChange}
             selectedIconKey={viewPickerSelectedIcon}
-            onClose={() => setHotkeyScope(ViewsHotkeyScope.ListDropdown)}
           />
           <TextInputV2
             value={viewPickerInputName}
diff --git a/packages/twenty-front/src/modules/views/view-picker/components/ViewPickerDropdown.tsx b/packages/twenty-front/src/modules/views/view-picker/components/ViewPickerDropdown.tsx
index 709ab982b..17bc9e411 100644
--- a/packages/twenty-front/src/modules/views/view-picker/components/ViewPickerDropdown.tsx
+++ b/packages/twenty-front/src/modules/views/view-picker/components/ViewPickerDropdown.tsx
@@ -6,7 +6,6 @@ import { StyledDropdownButtonContainer } from '@/ui/layout/dropdown/components/S
 import { useDropdown } from '@/ui/layout/dropdown/hooks/useDropdown';
 import { useGetRecordIndexTotalCount } from '@/views/hooks/internal/useGetRecordIndexTotalCount';
 import { useGetCurrentViewOnly } from '@/views/hooks/useGetCurrentViewOnly';
-import { ViewsHotkeyScope } from '@/views/types/ViewsHotkeyScope';
 import { ViewPickerContentCreateMode } from '@/views/view-picker/components/ViewPickerContentCreateMode';
 import { ViewPickerContentEditMode } from '@/views/view-picker/components/ViewPickerContentEditMode';
 import { ViewPickerContentEffect } from '@/views/view-picker/components/ViewPickerContentEffect';
@@ -71,7 +70,6 @@ export const ViewPickerDropdown = () => {
   return (
     <Dropdown
       dropdownId={VIEW_PICKER_DROPDOWN_ID}
-      dropdownHotkeyScope={{ scope: ViewsHotkeyScope.ListDropdown }}
       dropdownOffset={{ x: 0, y: 8 }}
       dropdownPlacement="bottom-start"
       onClickOutside={handleClickOutside}
diff --git a/packages/twenty-front/src/modules/workflow/workflow-trigger/components/WorkflowEditTriggerDatabaseEventForm.tsx b/packages/twenty-front/src/modules/workflow/workflow-trigger/components/WorkflowEditTriggerDatabaseEventForm.tsx
index 1546b0b90..ff061d903 100644
--- a/packages/twenty-front/src/modules/workflow/workflow-trigger/components/WorkflowEditTriggerDatabaseEventForm.tsx
+++ b/packages/twenty-front/src/modules/workflow/workflow-trigger/components/WorkflowEditTriggerDatabaseEventForm.tsx
@@ -1,7 +1,6 @@
 import { useFilteredObjectMetadataItems } from '@/object-metadata/hooks/useFilteredObjectMetadataItems';
 import { FieldMultiSelectValue } from '@/object-record/record-field/types/FieldMetadata';
 import { SelectControl } from '@/ui/input/components/SelectControl';
-import { SelectHotkeyScope } from '@/ui/input/types/SelectHotkeyScope';
 import { Dropdown } from '@/ui/layout/dropdown/components/Dropdown';
 import { DropdownContent } from '@/ui/layout/dropdown/components/DropdownContent';
 import { DropdownMenuHeader } from '@/ui/layout/dropdown/components/DropdownMenuHeader/DropdownMenuHeader';
@@ -9,6 +8,7 @@ import { DropdownMenuHeaderLeftComponent } from '@/ui/layout/dropdown/components
 import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer';
 import { DropdownMenuSearchInput } from '@/ui/layout/dropdown/components/DropdownMenuSearchInput';
 import { DropdownMenuSeparator } from '@/ui/layout/dropdown/components/DropdownMenuSeparator';
+import { GenericDropdownContentWidth } from '@/ui/layout/dropdown/constants/GenericDropdownContentWidth';
 import { useDropdown } from '@/ui/layout/dropdown/hooks/useDropdown';
 import { WorkflowFieldsMultiSelect } from '@/workflow/components/WorkflowEditUpdateEventFieldsMultiSelect';
 import { WorkflowDatabaseEventTrigger } from '@/workflow/types/Workflow';
@@ -25,7 +25,6 @@ import { useCallback, useMemo, useState } from 'react';
 import { isDefined } from 'twenty-shared/utils';
 import { IconChevronLeft, IconSettings, useIcons } from 'twenty-ui/display';
 import { MenuItem } from 'twenty-ui/navigation';
-import { GenericDropdownContentWidth } from '@/ui/layout/dropdown/constants/GenericDropdownContentWidth';
 
 const StyledLabel = styled.span`
   color: ${({ theme }) => theme.font.color.light};
@@ -266,7 +265,6 @@ export const WorkflowEditTriggerDatabaseEventForm = ({
                   ))}
               </>
             }
-            dropdownHotkeyScope={{ scope: SelectHotkeyScope.Select }}
             dropdownOffset={{ y: parseInt(theme.spacing(1), 10) }}
           />
         </StyledRecordTypeSelectContainer>
diff --git a/packages/twenty-front/src/modules/workflow/workflow-variables/components/WorkflowVariablesDropdown.tsx b/packages/twenty-front/src/modules/workflow/workflow-variables/components/WorkflowVariablesDropdown.tsx
index 4da56bf26..35082df8c 100644
--- a/packages/twenty-front/src/modules/workflow/workflow-variables/components/WorkflowVariablesDropdown.tsx
+++ b/packages/twenty-front/src/modules/workflow/workflow-variables/components/WorkflowVariablesDropdown.tsx
@@ -101,9 +101,6 @@ export const WorkflowVariablesDropdown = ({
   return (
     <Dropdown
       dropdownId={dropdownId}
-      dropdownHotkeyScope={{
-        scope: dropdownId,
-      }}
       clickableComponent={
         <StyledDropdownVariableButtonContainer
           isUnfolded={isDropdownOpen}