improve command menu actions ordering

2025-10-30 20:27:55 +00:00 · 2024-11-20 16:16:20 +01:00
parent 8c05830dcf
commit 1ba43bbff8
14 changed files with 233 additions and 82 deletions
--- a/packages/twenty-front/src/modules/action-menu/actions/global-actions/workflow-run-actions/components/WorkflowRunActionEffect.tsx
+++ b/packages/twenty-front/src/modules/action-menu/actions/global-actions/workflow-run-actions/components/WorkflowRunActionEffect.tsx
@@ -1,4 +1,8 @@
 import { useActionMenuEntries } from '@/action-menu/hooks/useActionMenuEntries';
+import {
+  ActionMenuEntryScope,
+  ActionMenuEntryType,
+} from '@/action-menu/types/ActionMenuEntry';
 import { SnackBarVariant } from '@/ui/feedback/snack-bar-manager/components/SnackBar';
 import { useSnackBar } from '@/ui/feedback/snack-bar-manager/hooks/useSnackBar';
 import { useAllActiveWorkflowVersions } from '@/workflow/hooks/useAllActiveWorkflowVersions';
@@ -28,9 +32,9 @@ export const WorkflowRunActionEffect = () => {
      activeWorkflowVersion,
    ] of activeWorkflowVersions.entries()) {
      addActionMenuEntry({
-        type: 'workflow-run',
+        type: ActionMenuEntryType.WorkflowRun,
        key: `workflow-run-${activeWorkflowVersion.id}`,
-        scope: 'global',
+        scope: ActionMenuEntryScope.Global,
        label: capitalize(activeWorkflowVersion.workflow.name),
        position: index,
        Icon: IconSettingsAutomation,
--- a/packages/twenty-front/src/modules/action-menu/actions/record-actions/components/DeleteRecordsActionEffect.tsx
+++ b/packages/twenty-front/src/modules/action-menu/actions/record-actions/components/DeleteRecordsActionEffect.tsx
@@ -1,5 +1,9 @@
 import { ActionMenuContext } from '@/action-menu/contexts/ActionMenuContext';
 import { useActionMenuEntries } from '@/action-menu/hooks/useActionMenuEntries';
+import {
+  ActionMenuEntryScope,
+  ActionMenuEntryType,
+} from '@/action-menu/types/ActionMenuEntry';
 import { contextStoreFiltersComponentState } from '@/context-store/states/contextStoreFiltersComponentState';
 import { contextStoreNumberOfSelectedRecordsComponentState } from '@/context-store/states/contextStoreNumberOfSelectedRecordsComponentState';
 import { contextStoreTargetedRecordsRuleComponentState } from '@/context-store/states/contextStoreTargetedRecordsRuleComponentState';
@@ -105,8 +109,8 @@ export const DeleteRecordsActionEffect = ({
  useEffect(() => {
    if (canDelete) {
      addActionMenuEntry({
-        type: 'standard',
-        scope: 'record-selection',
+        type: ActionMenuEntryType.Standard,
+        scope: ActionMenuEntryScope.RecordSelection,
        key: 'delete',
        label: 'Delete',
        position,
--- a/packages/twenty-front/src/modules/action-menu/actions/record-actions/components/ExportRecordsActionEffect.tsx
+++ b/packages/twenty-front/src/modules/action-menu/actions/record-actions/components/ExportRecordsActionEffect.tsx
@@ -4,6 +4,10 @@ import { ObjectMetadataItem } from '@/object-metadata/types/ObjectMetadataItem';
 import { useRecoilComponentValueV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentValueV2';
 import { IconDatabaseExport } from 'twenty-ui';

+import {
+  ActionMenuEntryScope,
+  ActionMenuEntryType,
+} from '@/action-menu/types/ActionMenuEntry';
 import {
  displayedExportProgress,
  useExportRecords,
@@ -31,8 +35,11 @@ export const ExportRecordsActionEffect = ({

  useEffect(() => {
    addActionMenuEntry({
-      type: 'standard',
-      scope: 'record-selection',
+      type: ActionMenuEntryType.Standard,
+      scope:
+        contextStoreNumberOfSelectedRecords > 0
+          ? ActionMenuEntryScope.RecordSelection
+          : ActionMenuEntryScope.Global,
      key: 'export',
      position,
      label: displayedExportProgress(
--- a/packages/twenty-front/src/modules/action-menu/actions/record-actions/components/ManageFavoritesActionEffect.tsx
+++ b/packages/twenty-front/src/modules/action-menu/actions/record-actions/components/ManageFavoritesActionEffect.tsx
@@ -1,4 +1,8 @@
 import { useActionMenuEntries } from '@/action-menu/hooks/useActionMenuEntries';
+import {
+  ActionMenuEntryScope,
+  ActionMenuEntryType,
+} from '@/action-menu/types/ActionMenuEntry';
 import { contextStoreTargetedRecordsRuleComponentState } from '@/context-store/states/contextStoreTargetedRecordsRuleComponentState';
 import { useCreateFavorite } from '@/favorites/hooks/useCreateFavorite';
 import { useDeleteFavorite } from '@/favorites/hooks/useDeleteFavorite';
@@ -50,8 +54,8 @@ export const ManageFavoritesActionEffect = ({
    }

    addActionMenuEntry({
-      type: 'standard',
-      scope: 'record-selection',
+      type: ActionMenuEntryType.Standard,
+      scope: ActionMenuEntryScope.RecordSelection,
      key: 'manage-favorites',
      label: isFavorite ? 'Remove from favorites' : 'Add to favorites',
      position,
--- a/packages/twenty-front/src/modules/action-menu/actions/record-actions/workflow-run-record-actions/components/WorkflowRunRecordActionEffect.tsx
+++ b/packages/twenty-front/src/modules/action-menu/actions/record-actions/workflow-run-record-actions/components/WorkflowRunRecordActionEffect.tsx
@@ -1,4 +1,8 @@
 import { useActionMenuEntries } from '@/action-menu/hooks/useActionMenuEntries';
+import {
+  ActionMenuEntryScope,
+  ActionMenuEntryType,
+} from '@/action-menu/types/ActionMenuEntry';
 import { contextStoreTargetedRecordsRuleComponentState } from '@/context-store/states/contextStoreTargetedRecordsRuleComponentState';
 import { ObjectMetadataItem } from '@/object-metadata/types/ObjectMetadataItem';
 import { recordStoreFamilyState } from '@/object-record/record-store/states/recordStoreFamilyState';
@@ -55,9 +59,9 @@ export const WorkflowRunRecordActionEffect = ({
      activeWorkflowVersion,
    ] of activeWorkflowVersions.entries()) {
      addActionMenuEntry({
-        type: 'workflow-run',
+        type: ActionMenuEntryType.WorkflowRun,
        key: `workflow-run-${activeWorkflowVersion.id}`,
-        scope: 'record-selection',
+        scope: ActionMenuEntryScope.RecordSelection,
        label: capitalize(activeWorkflowVersion.workflow.name),
        position: index,
        Icon: IconSettingsAutomation,
--- a/packages/twenty-front/src/modules/action-menu/components/RightDrawerActionMenuDropdown.tsx
+++ b/packages/twenty-front/src/modules/action-menu/components/RightDrawerActionMenuDropdown.tsx
@@ -1,5 +1,6 @@
 import { actionMenuEntriesComponentSelector } from '@/action-menu/states/actionMenuEntriesComponentSelector';
 import { ActionMenuComponentInstanceContext } from '@/action-menu/states/contexts/ActionMenuComponentInstanceContext';
+import { ActionMenuEntryScope } from '@/action-menu/types/ActionMenuEntry';
 import { RightDrawerActionMenuDropdownHotkeyScope } from '@/action-menu/types/RightDrawerActionMenuDropdownHotkeyScope';
 import { getRightDrawerActionMenuDropdownIdFromActionMenuId } from '@/action-menu/utils/getRightDrawerActionMenuDropdownIdFromActionMenuId';
 import { Dropdown } from '@/ui/layout/dropdown/components/Dropdown';
@@ -67,7 +68,8 @@ export const RightDrawerActionMenuDropdown = () => {
        <DropdownMenuItemsContainer>
          {actionMenuEntries
            .filter(
-              (actionMenuEntry) => actionMenuEntry.scope === 'record-selection',
+              (actionMenuEntry) =>
+                actionMenuEntry.scope === ActionMenuEntryScope.RecordSelection,
            )
            .map((actionMenuEntry, index) => (
              <MenuItem
--- a/packages/twenty-front/src/modules/action-menu/components/stories/RecordIndexActionMenuBar.stories.tsx
+++ b/packages/twenty-front/src/modules/action-menu/components/stories/RecordIndexActionMenuBar.stories.tsx
@@ -5,7 +5,11 @@ import { RecoilRoot } from 'recoil';
 import { RecordIndexActionMenuBar } from '@/action-menu/components/RecordIndexActionMenuBar';
 import { actionMenuEntriesComponentState } from '@/action-menu/states/actionMenuEntriesComponentState';
 import { ActionMenuComponentInstanceContext } from '@/action-menu/states/contexts/ActionMenuComponentInstanceContext';
-import { ActionMenuEntry } from '@/action-menu/types/ActionMenuEntry';
+import {
+  ActionMenuEntry,
+  ActionMenuEntryScope,
+  ActionMenuEntryType,
+} from '@/action-menu/types/ActionMenuEntry';
 import { getActionBarIdFromActionMenuId } from '@/action-menu/utils/getActionBarIdFromActionMenuId';
 import { ContextStoreComponentInstanceContext } from '@/context-store/states/contexts/ContextStoreComponentInstanceContext';
 import { contextStoreNumberOfSelectedRecordsComponentState } from '@/context-store/states/contextStoreNumberOfSelectedRecordsComponentState';
@@ -48,8 +52,8 @@ const meta: Meta<typeof RecordIndexActionMenuBar> = {

            map.set('delete', {
              isPinned: true,
-              scope: 'record-selection',
-              type: 'standard',
+              scope: ActionMenuEntryScope.RecordSelection,
+              type: ActionMenuEntryType.Standard,
              key: 'delete',
              label: 'Delete',
              position: 0,
--- a/packages/twenty-front/src/modules/action-menu/components/stories/RecordIndexActionMenuBarEntry.stories.tsx
+++ b/packages/twenty-front/src/modules/action-menu/components/stories/RecordIndexActionMenuBarEntry.stories.tsx
@@ -1,4 +1,8 @@
 import { RecordIndexActionMenuBarEntry } from '@/action-menu/components/RecordIndexActionMenuBarEntry';
+import {
+  ActionMenuEntryScope,
+  ActionMenuEntryType,
+} from '@/action-menu/types/ActionMenuEntry';
 import { expect, jest } from '@storybook/jest';
 import { Meta, StoryObj } from '@storybook/react';
 import { userEvent, within } from '@storybook/testing-library';
@@ -21,8 +25,8 @@ const markAsDoneMock = jest.fn();
 export const Default: Story = {
  args: {
    entry: {
-      type: 'standard',
-      scope: 'record-selection',
+      type: ActionMenuEntryType.Standard,
+      scope: ActionMenuEntryScope.RecordSelection,
      key: 'delete',
      label: 'Delete',
      position: 0,
@@ -35,8 +39,8 @@ export const Default: Story = {
 export const WithDangerAccent: Story = {
  args: {
    entry: {
-      type: 'standard',
-      scope: 'record-selection',
+      type: ActionMenuEntryType.Standard,
+      scope: ActionMenuEntryScope.RecordSelection,
      key: 'delete',
      label: 'Delete',
      position: 0,
@@ -50,8 +54,8 @@ export const WithDangerAccent: Story = {
 export const WithInteraction: Story = {
  args: {
    entry: {
-      type: 'standard',
-      scope: 'record-selection',
+      type: ActionMenuEntryType.Standard,
+      scope: ActionMenuEntryScope.RecordSelection,
      key: 'markAsDone',
      label: 'Mark as done',
      position: 0,
--- a/packages/twenty-front/src/modules/action-menu/components/stories/RecordIndexActionMenuDropdown.stories.tsx
+++ b/packages/twenty-front/src/modules/action-menu/components/stories/RecordIndexActionMenuDropdown.stories.tsx
@@ -7,7 +7,11 @@ import { RecordIndexActionMenuDropdown } from '@/action-menu/components/RecordIn
 import { actionMenuEntriesComponentState } from '@/action-menu/states/actionMenuEntriesComponentState';
 import { ActionMenuComponentInstanceContext } from '@/action-menu/states/contexts/ActionMenuComponentInstanceContext';
 import { recordIndexActionMenuDropdownPositionComponentState } from '@/action-menu/states/recordIndexActionMenuDropdownPositionComponentState';
-import { ActionMenuEntry } from '@/action-menu/types/ActionMenuEntry';
+import {
+  ActionMenuEntry,
+  ActionMenuEntryScope,
+  ActionMenuEntryType,
+} from '@/action-menu/types/ActionMenuEntry';
 import { isDropdownOpenComponentState } from '@/ui/layout/dropdown/states/isDropdownOpenComponentState';
 import { extractComponentState } from '@/ui/utilities/state/component-state/utils/extractComponentState';
 import { IconCheckbox, IconHeart, IconTrash } from 'twenty-ui';
@@ -41,8 +45,8 @@ const meta: Meta<typeof RecordIndexActionMenuDropdown> = {
          );

          map.set('delete', {
-            type: 'standard',
-            scope: 'record-selection',
+            type: ActionMenuEntryType.Standard,
+            scope: ActionMenuEntryScope.RecordSelection,
            key: 'delete',
            label: 'Delete',
            position: 0,
@@ -51,8 +55,8 @@ const meta: Meta<typeof RecordIndexActionMenuDropdown> = {
          });

          map.set('markAsDone', {
-            type: 'standard',
-            scope: 'record-selection',
+            type: ActionMenuEntryType.Standard,
+            scope: ActionMenuEntryScope.RecordSelection,
            key: 'markAsDone',
            label: 'Mark as done',
            position: 1,
@@ -61,8 +65,8 @@ const meta: Meta<typeof RecordIndexActionMenuDropdown> = {
          });

          map.set('addToFavorites', {
-            type: 'standard',
-            scope: 'record-selection',
+            type: ActionMenuEntryType.Standard,
+            scope: ActionMenuEntryScope.RecordSelection,
            key: 'addToFavorites',
            label: 'Add to favorites',
            position: 2,
--- a/packages/twenty-front/src/modules/action-menu/components/stories/RecordShowActionMenuBar.stories.tsx
+++ b/packages/twenty-front/src/modules/action-menu/components/stories/RecordShowActionMenuBar.stories.tsx
@@ -5,7 +5,11 @@ import { RecoilRoot } from 'recoil';
 import { RightDrawerActionMenuDropdown } from '@/action-menu/components/RightDrawerActionMenuDropdown';
 import { actionMenuEntriesComponentState } from '@/action-menu/states/actionMenuEntriesComponentState';
 import { ActionMenuComponentInstanceContext } from '@/action-menu/states/contexts/ActionMenuComponentInstanceContext';
-import { ActionMenuEntry } from '@/action-menu/types/ActionMenuEntry';
+import {
+  ActionMenuEntry,
+  ActionMenuEntryScope,
+  ActionMenuEntryType,
+} from '@/action-menu/types/ActionMenuEntry';
 import { contextStoreNumberOfSelectedRecordsComponentState } from '@/context-store/states/contextStoreNumberOfSelectedRecordsComponentState';
 import { contextStoreTargetedRecordsRuleComponentState } from '@/context-store/states/contextStoreTargetedRecordsRuleComponentState';
 import { userEvent, waitFor, within } from '@storybook/test';
@@ -54,8 +58,8 @@ const meta: Meta<typeof RightDrawerActionMenuDropdown> = {
          );

          map.set('addToFavorites', {
-            type: 'standard',
-            scope: 'record-selection',
+            type: ActionMenuEntryType.Standard,
+            scope: ActionMenuEntryScope.RecordSelection,
            key: 'addToFavorites',
            label: 'Add to favorites',
            position: 0,
@@ -64,8 +68,8 @@ const meta: Meta<typeof RightDrawerActionMenuDropdown> = {
          });

          map.set('export', {
-            type: 'standard',
-            scope: 'record-selection',
+            type: ActionMenuEntryType.Standard,
+            scope: ActionMenuEntryScope.RecordSelection,
            key: 'export',
            label: 'Export',
            position: 1,
@@ -74,8 +78,8 @@ const meta: Meta<typeof RightDrawerActionMenuDropdown> = {
          });

          map.set('delete', {
-            type: 'standard',
-            scope: 'record-selection',
+            type: ActionMenuEntryType.Standard,
+            scope: ActionMenuEntryScope.RecordSelection,
            key: 'delete',
            label: 'Delete',
            position: 2,
--- a/packages/twenty-front/src/modules/action-menu/types/ActionMenuEntry.ts
+++ b/packages/twenty-front/src/modules/action-menu/types/ActionMenuEntry.ts
@@ -1,9 +1,19 @@
 import { MouseEvent, ReactNode } from 'react';
 import { IconComponent, MenuItemAccent } from 'twenty-ui';

+export enum ActionMenuEntryType {
+  Standard = 'Standard',
+  WorkflowRun = 'WorkflowRun',
+}
+
+export enum ActionMenuEntryScope {
+  Global = 'Global',
+  RecordSelection = 'RecordSelection',
+}
+
 export type ActionMenuEntry = {
-  type: 'standard' | 'workflow-run';
-  scope: 'global' | 'record-selection';
+  type: ActionMenuEntryType;
+  scope: ActionMenuEntryScope;
  key: string;
  label: string;
  position: number;
--- a/packages/twenty-front/src/modules/command-menu/components/CommandMenu.tsx
+++ b/packages/twenty-front/src/modules/command-menu/components/CommandMenu.tsx
@@ -12,7 +12,11 @@ import { useCommandMenu } from '@/command-menu/hooks/useCommandMenu';
 import { commandMenuCommandsState } from '@/command-menu/states/commandMenuCommandsState';
 import { commandMenuSearchState } from '@/command-menu/states/commandMenuSearchState';
 import { isCommandMenuOpenedState } from '@/command-menu/states/isCommandMenuOpenedState';
-import { Command, CommandType } from '@/command-menu/types/Command';
+import {
+  Command,
+  CommandScope,
+  CommandType,
+} from '@/command-menu/types/Command';
 import { Company } from '@/companies/types/Company';
 import { contextStoreNumberOfSelectedRecordsComponentState } from '@/context-store/states/contextStoreNumberOfSelectedRecordsComponentState';
 import { contextStoreTargetedRecordsRuleComponentState } from '@/context-store/states/contextStoreTargetedRecordsRuleComponentState';
@@ -363,20 +367,45 @@ export const CommandMenu = () => {
        : true) && cmd.type === CommandType.Create,
  );

-  const matchingStandardActionCommands = commandMenuCommands.filter(
+  const matchingStandardActionRecordSelectionCommands =
+    commandMenuCommands.filter(
      (cmd) =>
        (deferredCommandMenuSearch.length > 0
          ? checkInShortcuts(cmd, deferredCommandMenuSearch) ||
            checkInLabels(cmd, deferredCommandMenuSearch)
-        : true) && cmd.type === CommandType.StandardAction,
+          : true) &&
+        cmd.type === CommandType.StandardAction &&
+        cmd.scope === CommandScope.RecordSelection,
    );

-  const matchingWorkflowRunCommands = commandMenuCommands.filter(
+  const matchingStandardActionGlobalCommands = commandMenuCommands.filter(
    (cmd) =>
      (deferredCommandMenuSearch.length > 0
        ? checkInShortcuts(cmd, deferredCommandMenuSearch) ||
          checkInLabels(cmd, deferredCommandMenuSearch)
-        : true) && cmd.type === CommandType.WorkflowRun,
+        : true) &&
+      cmd.type === CommandType.StandardAction &&
+      cmd.scope === CommandScope.Global,
+  );
+
+  const matchingWorkflowRunRecordSelectionCommands = commandMenuCommands.filter(
+    (cmd) =>
+      (deferredCommandMenuSearch.length > 0
+        ? checkInShortcuts(cmd, deferredCommandMenuSearch) ||
+          checkInLabels(cmd, deferredCommandMenuSearch)
+        : true) &&
+      cmd.type === CommandType.WorkflowRun &&
+      cmd.scope === CommandScope.RecordSelection,
+  );
+
+  const matchingWorkflowRunGlobalCommands = commandMenuCommands.filter(
+    (cmd) =>
+      (deferredCommandMenuSearch.length > 0
+        ? checkInShortcuts(cmd, deferredCommandMenuSearch) ||
+          checkInLabels(cmd, deferredCommandMenuSearch)
+        : true) &&
+      cmd.type === CommandType.WorkflowRun &&
+      cmd.scope === CommandScope.Global,
  );

  useListenClickOutside({
@@ -404,8 +433,10 @@ export const CommandMenu = () => {

  const selectableItemIds = copilotCommands
    .map((cmd) => cmd.id)
-    .concat(matchingStandardActionCommands.map((cmd) => cmd.id))
-    .concat(matchingWorkflowRunCommands.map((cmd) => cmd.id))
+    .concat(matchingStandardActionRecordSelectionCommands.map((cmd) => cmd.id))
+    .concat(matchingWorkflowRunRecordSelectionCommands.map((cmd) => cmd.id))
+    .concat(matchingStandardActionGlobalCommands.map((cmd) => cmd.id))
+    .concat(matchingWorkflowRunGlobalCommands.map((cmd) => cmd.id))
    .concat(matchingCreateCommand.map((cmd) => cmd.id))
    .concat(matchingNavigateCommand.map((cmd) => cmd.id))
    .concat(people?.map((person) => person.id))
@@ -422,8 +453,10 @@ export const CommandMenu = () => {
    );

  const isNoResults =
-    !matchingStandardActionCommands.length &&
-    !matchingWorkflowRunCommands.length &&
+    !matchingStandardActionRecordSelectionCommands.length &&
+    !matchingWorkflowRunRecordSelectionCommands.length &&
+    !matchingStandardActionGlobalCommands.length &&
+    !matchingWorkflowRunGlobalCommands.length &&
    !matchingCreateCommand.length &&
    !matchingNavigateCommand.length &&
    !people?.length &&
@@ -599,38 +632,82 @@ export const CommandMenu = () => {
                      </SelectableItem>
                    </CommandGroup>
                  )}
-                  <CommandGroup heading="Standard Actions">
-                    {matchingStandardActionCommands?.map(
-                      (standardActionCommand) => (
+                  <CommandGroup heading="Record Selection">
+                    {matchingStandardActionRecordSelectionCommands?.map(
+                      (standardActionrecordSelectionCommand) => (
                        <SelectableItem
-                          itemId={standardActionCommand.id}
-                          key={standardActionCommand.id}
+                          itemId={standardActionrecordSelectionCommand.id}
+                          key={standardActionrecordSelectionCommand.id}
                        >
                          <CommandMenuItem
-                            id={standardActionCommand.id}
-                            label={standardActionCommand.label}
-                            Icon={standardActionCommand.Icon}
-                            onClick={standardActionCommand.onCommandClick}
+                            id={standardActionrecordSelectionCommand.id}
+                            label={standardActionrecordSelectionCommand.label}
+                            Icon={standardActionrecordSelectionCommand.Icon}
+                            onClick={
+                              standardActionrecordSelectionCommand.onCommandClick
+                            }
+                          />
+                        </SelectableItem>
+                      ),
+                    )}
+                    {matchingWorkflowRunRecordSelectionCommands?.map(
+                      (workflowRunRecordSelectionCommand) => (
+                        <SelectableItem
+                          itemId={workflowRunRecordSelectionCommand.id}
+                          key={workflowRunRecordSelectionCommand.id}
+                        >
+                          <CommandMenuItem
+                            id={workflowRunRecordSelectionCommand.id}
+                            label={workflowRunRecordSelectionCommand.label}
+                            Icon={workflowRunRecordSelectionCommand.Icon}
+                            onClick={
+                              workflowRunRecordSelectionCommand.onCommandClick
+                            }
                          />
                        </SelectableItem>
                      ),
                    )}
                  </CommandGroup>
-                  <CommandGroup heading="Workflows">
-                    {matchingWorkflowRunCommands?.map((workflowRunCommand) => (
+                  {matchingStandardActionGlobalCommands?.length > 0 && (
+                    <CommandGroup heading="View">
+                      {matchingStandardActionGlobalCommands?.map(
+                        (standardActionGlobalCommand) => (
                          <SelectableItem
-                        itemId={workflowRunCommand.id}
-                        key={workflowRunCommand.id}
+                            itemId={standardActionGlobalCommand.id}
+                            key={standardActionGlobalCommand.id}
                          >
                            <CommandMenuItem
-                          id={workflowRunCommand.id}
-                          label={workflowRunCommand.label}
-                          Icon={workflowRunCommand.Icon}
-                          onClick={workflowRunCommand.onCommandClick}
+                              id={standardActionGlobalCommand.id}
+                              label={standardActionGlobalCommand.label}
+                              Icon={standardActionGlobalCommand.Icon}
+                              onClick={
+                                standardActionGlobalCommand.onCommandClick
+                              }
                            />
                          </SelectableItem>
-                    ))}
+                        ),
+                      )}
                    </CommandGroup>
+                  )}
+                  {matchingWorkflowRunGlobalCommands?.length > 0 && (
+                    <CommandGroup heading="Workflows">
+                      {matchingWorkflowRunGlobalCommands?.map(
+                        (workflowRunGlobalCommand) => (
+                          <SelectableItem
+                            itemId={workflowRunGlobalCommand.id}
+                            key={workflowRunGlobalCommand.id}
+                          >
+                            <CommandMenuItem
+                              id={workflowRunGlobalCommand.id}
+                              label={workflowRunGlobalCommand.label}
+                              Icon={workflowRunGlobalCommand.Icon}
+                              onClick={workflowRunGlobalCommand.onCommandClick}
+                            />
+                          </SelectableItem>
+                        ),
+                      )}
+                    </CommandGroup>
+                  )}

                  {commandGroups.map(({ heading, items, renderItem }) =>
                    items?.length ? (
--- a/packages/twenty-front/src/modules/command-menu/types/Command.ts
+++ b/packages/twenty-front/src/modules/command-menu/types/Command.ts
@@ -1,5 +1,4 @@
 import { IconComponent } from 'twenty-ui';
-
 export enum CommandType {
  Navigate = 'Navigate',
  Create = 'Create',
@@ -7,15 +6,17 @@ export enum CommandType {
  WorkflowRun = 'WorkflowRun',
 }

+export enum CommandScope {
+  Global = 'Global',
+  RecordSelection = 'RecordSelection',
+}
+
 export type Command = {
  id: string;
  to?: string;
  label: string;
-  type?:
-    | CommandType.Navigate
-    | CommandType.Create
-    | CommandType.StandardAction
-    | CommandType.WorkflowRun;
+  type?: CommandType;
+  scope?: CommandScope;
  Icon?: IconComponent;
  firstHotKey?: string;
  secondHotKey?: string;
--- a/packages/twenty-front/src/modules/command-menu/utils/computeCommandMenuCommands.ts
+++ b/packages/twenty-front/src/modules/command-menu/utils/computeCommandMenuCommands.ts
@@ -1,30 +1,52 @@
-import { ActionMenuEntry } from '@/action-menu/types/ActionMenuEntry';
+import {
+  ActionMenuEntry,
+  ActionMenuEntryScope,
+  ActionMenuEntryType,
+} from '@/action-menu/types/ActionMenuEntry';
 import { COMMAND_MENU_COMMANDS } from '@/command-menu/constants/CommandMenuCommands';
-import { CommandType } from '@/command-menu/types/Command';
+import {
+  Command,
+  CommandScope,
+  CommandType,
+} from '@/command-menu/types/Command';

 export const computeCommandMenuCommands = (
  actionMenuEntries: ActionMenuEntry[],
-) => {
+): Command[] => {
  const commands = Object.values(COMMAND_MENU_COMMANDS);

-  const actionCommands = actionMenuEntries
-    ?.filter((actionMenuEntry) => actionMenuEntry.type === 'standard')
+  const actionCommands: Command[] = actionMenuEntries
+    ?.filter(
+      (actionMenuEntry) =>
+        actionMenuEntry.type === ActionMenuEntryType.Standard,
+    )
    ?.map((actionMenuEntry) => ({
      id: actionMenuEntry.key,
      label: actionMenuEntry.label,
      Icon: actionMenuEntry.Icon,
      onCommandClick: actionMenuEntry.onClick,
      type: CommandType.StandardAction,
+      scope:
+        actionMenuEntry.scope === ActionMenuEntryScope.RecordSelection
+          ? CommandScope.RecordSelection
+          : CommandScope.Global,
    }));

-  const workflowRunCommands = actionMenuEntries
-    ?.filter((actionMenuEntry) => actionMenuEntry.type === 'workflow-run')
+  const workflowRunCommands: Command[] = actionMenuEntries
+    ?.filter(
+      (actionMenuEntry) =>
+        actionMenuEntry.type === ActionMenuEntryType.WorkflowRun,
+    )
    ?.map((actionMenuEntry) => ({
      id: actionMenuEntry.key,
      label: actionMenuEntry.label,
      Icon: actionMenuEntry.Icon,
      onCommandClick: actionMenuEntry.onClick,
      type: CommandType.WorkflowRun,
+      scope:
+        actionMenuEntry.scope === ActionMenuEntryScope.RecordSelection
+          ? CommandScope.RecordSelection
+          : CommandScope.Global,
    }));

  return [...commands, ...actionCommands, ...workflowRunCommands];