admin/twenty
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

Add search records actions to the command menu (#9892)

Browse Source 
Closes https://github.com/twentyhq/core-team-issues/issues/253 and
https://github.com/twentyhq/core-team-issues/issues/256.

- Created `CommandMenuList`, a component used at the root level of the
command menu and inside the search page of the command menu
- Refactored record agnostic actions
- Added shortcuts to the action menu entries (`/` key for the search)
and updated the design of the shortcuts
- Reordered actions at the root level of the command menu


https://github.com/user-attachments/assets/e1339cc4-ef5d-45c5-a159-6817a54b92e9
This commit is contained in:
Raphaël Bosi
2025-01-29 18:23:40 +01:00
committed by GitHub
parent 03f3ccd060
commit ce296fae4f
52 changed files with 1539 additions and 1361 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
packages/twenty-front/src/modules/action-menu/actions/record-actions/components/RegisterRecordActionEffect.tsx
View File

@ -8,7 +8,7 @@ import { useContext, useEffect } from 'react';
type RegisterRecordActionEffectProps = {
action: ActionMenuEntry & {
actionHook: ActionHook;
useAction: ActionHook;
};
objectMetadataItem: ObjectMetadataItem;
};
@ -17,7 +17,7 @@ export const RegisterRecordActionEffect = ({
action,
objectMetadataItem,
}: RegisterRecordActionEffectProps) => {
const { shouldBeRegistered, onClick, ConfirmationModal } = action.actionHook({
const { shouldBeRegistered, onClick, ConfirmationModal } = action.useAction({
objectMetadataItem,
});

16
packages/twenty-front/src/modules/action-menu/actions/record-actions/constants/DefaultActionsConfigV1.ts
View File

@ -23,7 +23,7 @@ import {
export const DEFAULT_ACTIONS_CONFIG_V1: Record<
string,
ActionMenuEntry & {
actionHook: ActionHook;
useAction: ActionHook;
}
> = {
addToFavoritesSingleRecord: {
@ -37,7 +37,7 @@ export const DEFAULT_ACTIONS_CONFIG_V1: Record<
ActionViewType.SHOW_PAGE,
ActionViewType.INDEX_PAGE_SINGLE_RECORD_SELECTION,
],
actionHook: useAddToFavoritesSingleRecordAction,
useAction: useAddToFavoritesSingleRecordAction,
},
removeFromFavoritesSingleRecord: {
type: ActionMenuEntryType.Standard,
@ -50,7 +50,7 @@ export const DEFAULT_ACTIONS_CONFIG_V1: Record<
ActionViewType.SHOW_PAGE,
ActionViewType.INDEX_PAGE_SINGLE_RECORD_SELECTION,
],
actionHook: useRemoveFromFavoritesSingleRecordAction,
useAction: useRemoveFromFavoritesSingleRecordAction,
},
deleteSingleRecord: {
type: ActionMenuEntryType.Standard,
@ -65,7 +65,7 @@ export const DEFAULT_ACTIONS_CONFIG_V1: Record<
ActionViewType.SHOW_PAGE,
ActionViewType.INDEX_PAGE_SINGLE_RECORD_SELECTION,
],
actionHook: useDeleteSingleRecordAction,
useAction: useDeleteSingleRecordAction,
},
deleteMultipleRecords: {
type: ActionMenuEntryType.Standard,
@ -78,7 +78,7 @@ export const DEFAULT_ACTIONS_CONFIG_V1: Record<
accent: 'danger',
isPinned: true,
availableOn: [ActionViewType.INDEX_PAGE_BULK_SELECTION],
actionHook: useDeleteMultipleRecordsAction,
useAction: useDeleteMultipleRecordsAction,
},
exportMultipleRecords: {
type: ActionMenuEntryType.Standard,
@ -91,11 +91,11 @@ export const DEFAULT_ACTIONS_CONFIG_V1: Record<
accent: 'default',
isPinned: false,
availableOn: [ActionViewType.INDEX_PAGE_BULK_SELECTION],
actionHook: useExportMultipleRecordsAction,
useAction: useExportMultipleRecordsAction,
},
exportView: {
type: ActionMenuEntryType.Standard,
scope: ActionMenuEntryScope.RecordSelection,
scope: ActionMenuEntryScope.Object,
key: NoSelectionRecordActionKeys.EXPORT_VIEW,
label: 'Export view',
shortLabel: 'Export',
@ -104,6 +104,6 @@ export const DEFAULT_ACTIONS_CONFIG_V1: Record<
accent: 'default',
isPinned: false,
availableOn: [ActionViewType.INDEX_PAGE_NO_SELECTION],
actionHook: useExportMultipleRecordsAction,
useAction: useExportMultipleRecordsAction,
},
};

28
packages/twenty-front/src/modules/action-menu/actions/record-actions/constants/DefaultActionsConfigV2.ts
View File

@ -33,12 +33,12 @@ import {
export const DEFAULT_ACTIONS_CONFIG_V2: Record<
string,
ActionMenuEntry & {
actionHook: ActionHook;
useAction: ActionHook;
}
> = {
createNewRecord: {
type: ActionMenuEntryType.Standard,
scope: ActionMenuEntryScope.RecordSelection,
scope: ActionMenuEntryScope.Object,
key: NoSelectionRecordActionKeys.CREATE_NEW_RECORD,
label: 'Create new record',
shortLabel: 'New record',
@ -46,7 +46,7 @@ export const DEFAULT_ACTIONS_CONFIG_V2: Record<
isPinned: true,
Icon: IconPlus,
availableOn: [ActionViewType.INDEX_PAGE_NO_SELECTION],
actionHook: useCreateNewTableRecordNoSelectionRecordAction,
useAction: useCreateNewTableRecordNoSelectionRecordAction,
},
exportNoteToPdf: {
type: ActionMenuEntryType.Standard,
@ -58,7 +58,7 @@ export const DEFAULT_ACTIONS_CONFIG_V2: Record<
isPinned: false,
Icon: IconFileExport,
availableOn: [ActionViewType.SHOW_PAGE],
actionHook: useExportNoteAction,
useAction: useExportNoteAction,
},
addToFavoritesSingleRecord: {
type: ActionMenuEntryType.Standard,
@ -73,7 +73,7 @@ export const DEFAULT_ACTIONS_CONFIG_V2: Record<
ActionViewType.INDEX_PAGE_SINGLE_RECORD_SELECTION,
ActionViewType.SHOW_PAGE,
],
actionHook: useAddToFavoritesSingleRecordAction,
useAction: useAddToFavoritesSingleRecordAction,
},
removeFromFavoritesSingleRecord: {
type: ActionMenuEntryType.Standard,
@ -88,7 +88,7 @@ export const DEFAULT_ACTIONS_CONFIG_V2: Record<
ActionViewType.INDEX_PAGE_SINGLE_RECORD_SELECTION,
ActionViewType.SHOW_PAGE,
],
actionHook: useRemoveFromFavoritesSingleRecordAction,
useAction: useRemoveFromFavoritesSingleRecordAction,
},
deleteSingleRecord: {
type: ActionMenuEntryType.Standard,
@ -104,7 +104,7 @@ export const DEFAULT_ACTIONS_CONFIG_V2: Record<
ActionViewType.INDEX_PAGE_SINGLE_RECORD_SELECTION,
ActionViewType.SHOW_PAGE,
],
actionHook: useDeleteSingleRecordAction,
useAction: useDeleteSingleRecordAction,
},
deleteMultipleRecords: {
type: ActionMenuEntryType.Standard,
@ -117,7 +117,7 @@ export const DEFAULT_ACTIONS_CONFIG_V2: Record<
accent: 'danger',
isPinned: true,
availableOn: [ActionViewType.INDEX_PAGE_BULK_SELECTION],
actionHook: useDeleteMultipleRecordsAction,
useAction: useDeleteMultipleRecordsAction,
},
exportMultipleRecords: {
type: ActionMenuEntryType.Standard,
@ -130,11 +130,11 @@ export const DEFAULT_ACTIONS_CONFIG_V2: Record<
accent: 'default',
isPinned: false,
availableOn: [ActionViewType.INDEX_PAGE_BULK_SELECTION],
actionHook: useExportMultipleRecordsAction,
useAction: useExportMultipleRecordsAction,
},
exportView: {
type: ActionMenuEntryType.Standard,
scope: ActionMenuEntryScope.RecordSelection,
scope: ActionMenuEntryScope.Object,
key: NoSelectionRecordActionKeys.EXPORT_VIEW,
label: 'Export view',
shortLabel: 'Export',
@ -143,7 +143,7 @@ export const DEFAULT_ACTIONS_CONFIG_V2: Record<
accent: 'default',
isPinned: false,
availableOn: [ActionViewType.INDEX_PAGE_NO_SELECTION],
actionHook: useExportMultipleRecordsAction,
useAction: useExportMultipleRecordsAction,
},
destroySingleRecord: {
type: ActionMenuEntryType.Standard,
@ -159,7 +159,7 @@ export const DEFAULT_ACTIONS_CONFIG_V2: Record<
ActionViewType.INDEX_PAGE_SINGLE_RECORD_SELECTION,
ActionViewType.SHOW_PAGE,
],
actionHook: useDestroySingleRecordAction,
useAction: useDestroySingleRecordAction,
},
navigateToPreviousRecord: {
type: ActionMenuEntryType.Standard,
@ -171,7 +171,7 @@ export const DEFAULT_ACTIONS_CONFIG_V2: Record<
isPinned: true,
Icon: IconChevronUp,
availableOn: [ActionViewType.SHOW_PAGE],
actionHook: useNavigateToPreviousRecordSingleRecordAction,
useAction: useNavigateToPreviousRecordSingleRecordAction,
},
navigateToNextRecord: {
type: ActionMenuEntryType.Standard,
@ -183,6 +183,6 @@ export const DEFAULT_ACTIONS_CONFIG_V2: Record<
isPinned: true,
Icon: IconChevronDown,
availableOn: [ActionViewType.SHOW_PAGE],
actionHook: useNavigateToNextRecordSingleRecordAction,
useAction: useNavigateToNextRecordSingleRecordAction,
},
};

36
packages/twenty-front/src/modules/action-menu/actions/record-actions/constants/WorkflowActionsConfig.ts
View File

@ -44,7 +44,7 @@ import {
export const WORKFLOW_ACTIONS_CONFIG: Record<
string,
ActionMenuEntry & {
actionHook: ActionHook;
useAction: ActionHook;
}
> = {
createNewRecord: {
@ -57,7 +57,7 @@ export const WORKFLOW_ACTIONS_CONFIG: Record<
isPinned: true,
Icon: IconPlus,
availableOn: [ActionViewType.INDEX_PAGE_NO_SELECTION],
actionHook: useCreateNewTableRecordNoSelectionRecordAction,
useAction: useCreateNewTableRecordNoSelectionRecordAction,
},
activateWorkflowSingleRecord: {
key: WorkflowSingleRecordActionKeys.ACTIVATE,
@ -72,7 +72,7 @@ export const WORKFLOW_ACTIONS_CONFIG: Record<
ActionViewType.SHOW_PAGE,
ActionViewType.INDEX_PAGE_SINGLE_RECORD_SELECTION,
],
actionHook: useActivateWorkflowSingleRecordAction,
useAction: useActivateWorkflowSingleRecordAction,
},
deactivateWorkflowSingleRecord: {
key: WorkflowSingleRecordActionKeys.DEACTIVATE,
@ -87,7 +87,7 @@ export const WORKFLOW_ACTIONS_CONFIG: Record<
ActionViewType.SHOW_PAGE,
ActionViewType.INDEX_PAGE_SINGLE_RECORD_SELECTION,
],
actionHook: useDeactivateWorkflowSingleRecordAction,
useAction: useDeactivateWorkflowSingleRecordAction,
},
discardWorkflowDraftSingleRecord: {
key: WorkflowSingleRecordActionKeys.DISCARD_DRAFT,
@ -102,7 +102,7 @@ export const WORKFLOW_ACTIONS_CONFIG: Record<
ActionViewType.SHOW_PAGE,
ActionViewType.INDEX_PAGE_SINGLE_RECORD_SELECTION,
],
actionHook: useDiscardDraftWorkflowSingleRecordAction,
useAction: useDiscardDraftWorkflowSingleRecordAction,
},
seeWorkflowActiveVersionSingleRecord: {
key: WorkflowSingleRecordActionKeys.SEE_ACTIVE_VERSION,
@ -117,7 +117,7 @@ export const WORKFLOW_ACTIONS_CONFIG: Record<
ActionViewType.SHOW_PAGE,
ActionViewType.INDEX_PAGE_SINGLE_RECORD_SELECTION,
],
actionHook: useSeeActiveVersionWorkflowSingleRecordAction,
useAction: useSeeActiveVersionWorkflowSingleRecordAction,
},
seeWorkflowRunsSingleRecord: {
key: WorkflowSingleRecordActionKeys.SEE_RUNS,
@ -132,7 +132,7 @@ export const WORKFLOW_ACTIONS_CONFIG: Record<
ActionViewType.SHOW_PAGE,
ActionViewType.INDEX_PAGE_SINGLE_RECORD_SELECTION,
],
actionHook: useSeeRunsWorkflowSingleRecordAction,
useAction: useSeeRunsWorkflowSingleRecordAction,
},
seeWorkflowVersionsHistorySingleRecord: {
key: WorkflowSingleRecordActionKeys.SEE_VERSIONS,
@ -147,7 +147,7 @@ export const WORKFLOW_ACTIONS_CONFIG: Record<
ActionViewType.SHOW_PAGE,
ActionViewType.INDEX_PAGE_SINGLE_RECORD_SELECTION,
],
actionHook: useSeeVersionsWorkflowSingleRecordAction,
useAction: useSeeVersionsWorkflowSingleRecordAction,
},
testWorkflowSingleRecord: {
key: WorkflowSingleRecordActionKeys.TEST,
@ -162,7 +162,7 @@ export const WORKFLOW_ACTIONS_CONFIG: Record<
ActionViewType.SHOW_PAGE,
ActionViewType.INDEX_PAGE_SINGLE_RECORD_SELECTION,
],
actionHook: useTestWorkflowSingleRecordAction,
useAction: useTestWorkflowSingleRecordAction,
},
navigateToPreviousRecord: {
type: ActionMenuEntryType.Standard,
@ -173,7 +173,7 @@ export const WORKFLOW_ACTIONS_CONFIG: Record<
position: 8,
Icon: IconChevronUp,
availableOn: [ActionViewType.SHOW_PAGE],
actionHook: useNavigateToPreviousRecordSingleRecordAction,
useAction: useNavigateToPreviousRecordSingleRecordAction,
},
navigateToNextRecord: {
type: ActionMenuEntryType.Standard,
@ -184,7 +184,7 @@ export const WORKFLOW_ACTIONS_CONFIG: Record<
position: 9,
Icon: IconChevronDown,
availableOn: [ActionViewType.SHOW_PAGE],
actionHook: useNavigateToNextRecordSingleRecordAction,
useAction: useNavigateToNextRecordSingleRecordAction,
},
addToFavoritesSingleRecord: {
type: ActionMenuEntryType.Standard,
@ -199,7 +199,7 @@ export const WORKFLOW_ACTIONS_CONFIG: Record<
ActionViewType.INDEX_PAGE_SINGLE_RECORD_SELECTION,
ActionViewType.SHOW_PAGE,
],
actionHook: useAddToFavoritesSingleRecordAction,
useAction: useAddToFavoritesSingleRecordAction,
},
removeFromFavoritesSingleRecord: {
type: ActionMenuEntryType.Standard,
@ -214,7 +214,7 @@ export const WORKFLOW_ACTIONS_CONFIG: Record<
ActionViewType.INDEX_PAGE_SINGLE_RECORD_SELECTION,
ActionViewType.SHOW_PAGE,
],
actionHook: useRemoveFromFavoritesSingleRecordAction,
useAction: useRemoveFromFavoritesSingleRecordAction,
},
deleteSingleRecord: {
type: ActionMenuEntryType.Standard,
@ -230,7 +230,7 @@ export const WORKFLOW_ACTIONS_CONFIG: Record<
ActionViewType.INDEX_PAGE_SINGLE_RECORD_SELECTION,
ActionViewType.SHOW_PAGE,
],
actionHook: useDeleteSingleRecordAction,
useAction: useDeleteSingleRecordAction,
},
deleteMultipleRecords: {
type: ActionMenuEntryType.Standard,
@ -243,7 +243,7 @@ export const WORKFLOW_ACTIONS_CONFIG: Record<
accent: 'danger',
isPinned: true,
availableOn: [ActionViewType.INDEX_PAGE_BULK_SELECTION],
actionHook: useDeleteMultipleRecordsAction,
useAction: useDeleteMultipleRecordsAction,
},
destroySingleRecord: {
type: ActionMenuEntryType.Standard,
@ -259,7 +259,7 @@ export const WORKFLOW_ACTIONS_CONFIG: Record<
ActionViewType.INDEX_PAGE_SINGLE_RECORD_SELECTION,
ActionViewType.SHOW_PAGE,
],
actionHook: useDestroySingleRecordAction,
useAction: useDestroySingleRecordAction,
},
exportMultipleRecords: {
type: ActionMenuEntryType.Standard,
@ -272,7 +272,7 @@ export const WORKFLOW_ACTIONS_CONFIG: Record<
accent: 'default',
isPinned: false,
availableOn: [ActionViewType.INDEX_PAGE_BULK_SELECTION],
actionHook: useExportMultipleRecordsAction,
useAction: useExportMultipleRecordsAction,
},
exportView: {
type: ActionMenuEntryType.Standard,
@ -285,6 +285,6 @@ export const WORKFLOW_ACTIONS_CONFIG: Record<
accent: 'default',
isPinned: false,
availableOn: [ActionViewType.INDEX_PAGE_NO_SELECTION],
actionHook: useExportMultipleRecordsAction,
useAction: useExportMultipleRecordsAction,
},
};

14
packages/twenty-front/src/modules/action-menu/actions/record-actions/constants/WorkflowRunsActionsConfig.ts
View File

@ -24,7 +24,7 @@ import {
export const WORKFLOW_RUNS_ACTIONS_CONFIG: Record<
string,
ActionMenuEntry & {
actionHook: ActionHook;
useAction: ActionHook;
}
> = {
addToFavoritesSingleRecord: {
@ -40,7 +40,7 @@ export const WORKFLOW_RUNS_ACTIONS_CONFIG: Record<
ActionViewType.INDEX_PAGE_SINGLE_RECORD_SELECTION,
ActionViewType.SHOW_PAGE,
],
actionHook: useAddToFavoritesSingleRecordAction,
useAction: useAddToFavoritesSingleRecordAction,
},
removeFromFavoritesSingleRecord: {
type: ActionMenuEntryType.Standard,
@ -55,7 +55,7 @@ export const WORKFLOW_RUNS_ACTIONS_CONFIG: Record<
ActionViewType.INDEX_PAGE_SINGLE_RECORD_SELECTION,
ActionViewType.SHOW_PAGE,
],
actionHook: useRemoveFromFavoritesSingleRecordAction,
useAction: useRemoveFromFavoritesSingleRecordAction,
},
navigateToPreviousRecord: {
type: ActionMenuEntryType.Standard,
@ -67,7 +67,7 @@ export const WORKFLOW_RUNS_ACTIONS_CONFIG: Record<
isPinned: true,
Icon: IconChevronUp,
availableOn: [ActionViewType.SHOW_PAGE],
actionHook: useNavigateToPreviousRecordSingleRecordAction,
useAction: useNavigateToPreviousRecordSingleRecordAction,
},
navigateToNextRecord: {
type: ActionMenuEntryType.Standard,
@ -79,7 +79,7 @@ export const WORKFLOW_RUNS_ACTIONS_CONFIG: Record<
isPinned: true,
Icon: IconChevronDown,
availableOn: [ActionViewType.SHOW_PAGE],
actionHook: useNavigateToNextRecordSingleRecordAction,
useAction: useNavigateToNextRecordSingleRecordAction,
},
exportMultipleRecords: {
type: ActionMenuEntryType.Standard,
@ -92,7 +92,7 @@ export const WORKFLOW_RUNS_ACTIONS_CONFIG: Record<
accent: 'default',
isPinned: false,
availableOn: [ActionViewType.INDEX_PAGE_BULK_SELECTION],
actionHook: useExportMultipleRecordsAction,
useAction: useExportMultipleRecordsAction,
},
exportView: {
type: ActionMenuEntryType.Standard,
@ -105,6 +105,6 @@ export const WORKFLOW_RUNS_ACTIONS_CONFIG: Record<
accent: 'default',
isPinned: false,
availableOn: [ActionViewType.INDEX_PAGE_NO_SELECTION],
actionHook: useExportMultipleRecordsAction,
useAction: useExportMultipleRecordsAction,
},
};

20
packages/twenty-front/src/modules/action-menu/actions/record-actions/constants/WorkflowVersionsActionsConfig.ts
View File

@ -31,7 +31,7 @@ import {
export const WORKFLOW_VERSIONS_ACTIONS_CONFIG: Record<
string,
ActionMenuEntry & {
actionHook: ActionHook;
useAction: ActionHook;
}
> = {
useAsDraftWorkflowVersionSingleRecord: {
@ -47,7 +47,7 @@ export const WORKFLOW_VERSIONS_ACTIONS_CONFIG: Record<
ActionViewType.SHOW_PAGE,
ActionViewType.INDEX_PAGE_SINGLE_RECORD_SELECTION,
],
actionHook: useUseAsDraftWorkflowVersionSingleRecordAction,
useAction: useUseAsDraftWorkflowVersionSingleRecordAction,
},
seeWorkflowRunsSingleRecord: {
key: WorkflowVersionSingleRecordActionKeys.SEE_RUNS,
@ -61,7 +61,7 @@ export const WORKFLOW_VERSIONS_ACTIONS_CONFIG: Record<
ActionViewType.SHOW_PAGE,
ActionViewType.INDEX_PAGE_SINGLE_RECORD_SELECTION,
],
actionHook: useSeeRunsWorkflowVersionSingleRecordAction,
useAction: useSeeRunsWorkflowVersionSingleRecordAction,
},
seeWorkflowVersionsHistorySingleRecord: {
key: WorkflowVersionSingleRecordActionKeys.SEE_VERSIONS,
@ -75,7 +75,7 @@ export const WORKFLOW_VERSIONS_ACTIONS_CONFIG: Record<
ActionViewType.SHOW_PAGE,
ActionViewType.INDEX_PAGE_SINGLE_RECORD_SELECTION,
],
actionHook: useSeeVersionsWorkflowVersionSingleRecordAction,
useAction: useSeeVersionsWorkflowVersionSingleRecordAction,
},
navigateToPreviousRecord: {
type: ActionMenuEntryType.Standard,
@ -86,7 +86,7 @@ export const WORKFLOW_VERSIONS_ACTIONS_CONFIG: Record<
position: 4,
Icon: IconChevronUp,
availableOn: [ActionViewType.SHOW_PAGE],
actionHook: useNavigateToPreviousRecordSingleRecordAction,
useAction: useNavigateToPreviousRecordSingleRecordAction,
},
navigateToNextRecord: {
type: ActionMenuEntryType.Standard,
@ -97,7 +97,7 @@ export const WORKFLOW_VERSIONS_ACTIONS_CONFIG: Record<
position: 5,
Icon: IconChevronDown,
availableOn: [ActionViewType.SHOW_PAGE],
actionHook: useNavigateToNextRecordSingleRecordAction,
useAction: useNavigateToNextRecordSingleRecordAction,
},
addToFavoritesSingleRecord: {
type: ActionMenuEntryType.Standard,
@ -112,7 +112,7 @@ export const WORKFLOW_VERSIONS_ACTIONS_CONFIG: Record<
ActionViewType.INDEX_PAGE_SINGLE_RECORD_SELECTION,
ActionViewType.SHOW_PAGE,
],
actionHook: useAddToFavoritesSingleRecordAction,
useAction: useAddToFavoritesSingleRecordAction,
},
removeFromFavoritesSingleRecord: {
type: ActionMenuEntryType.Standard,
@ -127,7 +127,7 @@ export const WORKFLOW_VERSIONS_ACTIONS_CONFIG: Record<
ActionViewType.INDEX_PAGE_SINGLE_RECORD_SELECTION,
ActionViewType.SHOW_PAGE,
],
actionHook: useRemoveFromFavoritesSingleRecordAction,
useAction: useRemoveFromFavoritesSingleRecordAction,
},
exportMultipleRecords: {
type: ActionMenuEntryType.Standard,
@ -140,7 +140,7 @@ export const WORKFLOW_VERSIONS_ACTIONS_CONFIG: Record<
accent: 'default',
isPinned: false,
availableOn: [ActionViewType.INDEX_PAGE_BULK_SELECTION],
actionHook: useExportMultipleRecordsAction,
useAction: useExportMultipleRecordsAction,
},
exportView: {
type: ActionMenuEntryType.Standard,
@ -153,6 +153,6 @@ export const WORKFLOW_VERSIONS_ACTIONS_CONFIG: Record<
accent: 'default',
isPinned: false,
availableOn: [ActionViewType.INDEX_PAGE_NO_SELECTION],
actionHook: useExportMultipleRecordsAction,
useAction: useExportMultipleRecordsAction,
},
};

12
packages/twenty-front/src/modules/action-menu/actions/record-agnostic-actions/components/RecordAgnosticActionMenuEntriesSetter.tsx Normal file
View File

@ -0,0 +1,12 @@
import { RegisterAgnosticRecordActionEffect } from '@/action-menu/actions/record-agnostic-actions/components/RegisterAgnosticRecordActionEffect';
import { RECORD_AGNOSTIC_ACTIONS_CONFIG } from '@/action-menu/actions/record-agnostic-actions/constants/RecordAgnosticActionsConfig';
export const RecordAgnosticActionMenuEntriesSetter = () => {
return (
<>
{Object.values(RECORD_AGNOSTIC_ACTIONS_CONFIG).map((action) => (
<RegisterAgnosticRecordActionEffect key={action.key} action={action} />
))}
</>
);
};

17
packages/twenty-front/src/modules/action-menu/actions/record-agnostic-actions/components/RecordAgnosticActionsSetterEffect.tsx
View File

@ -1,17 +0,0 @@
import { useRecordAgnosticActions } from '@/action-menu/actions/record-agnostic-actions/hooks/useRecordAgnosticActions';
import { useEffect } from 'react';
export const RecordAgnosticActionsSetterEffect = () => {
const { registerRecordAgnosticActions, unregisterRecordAgnosticActions } =
useRecordAgnosticActions();
useEffect(() => {
registerRecordAgnosticActions();
return () => {
unregisterRecordAgnosticActions();
};
}, [registerRecordAgnosticActions, unregisterRecordAgnosticActions]);
return null;
};

50
packages/twenty-front/src/modules/action-menu/actions/record-agnostic-actions/components/RegisterAgnosticRecordActionEffect.tsx Normal file
View File

@ -0,0 +1,50 @@
import { ActionHookWithoutObjectMetadataItem } from '@/action-menu/actions/types/ActionHook';
import { wrapActionInCallbacks } from '@/action-menu/actions/utils/wrapActionInCallbacks';
import { ActionMenuContext } from '@/action-menu/contexts/ActionMenuContext';
import { useActionMenuEntries } from '@/action-menu/hooks/useActionMenuEntries';
import { ActionMenuEntry } from '@/action-menu/types/ActionMenuEntry';
import { useContext, useEffect } from 'react';
type RegisterAgnosticRecordActionEffectProps = {
action: ActionMenuEntry & {
useAction: ActionHookWithoutObjectMetadataItem;
};
};
export const RegisterAgnosticRecordActionEffect = ({
action,
}: RegisterAgnosticRecordActionEffectProps) => {
const { shouldBeRegistered, onClick, ConfirmationModal } = action.useAction();
const { onActionStartedCallback, onActionExecutedCallback } =
useContext(ActionMenuContext);
const { addActionMenuEntry, removeActionMenuEntry } = useActionMenuEntries();
const wrappedAction = wrapActionInCallbacks({
action: {
...action,
onClick,
ConfirmationModal,
},
onActionStartedCallback,
onActionExecutedCallback,
});
useEffect(() => {
if (shouldBeRegistered) {
addActionMenuEntry(wrappedAction);
}
return () => {
removeActionMenuEntry(wrappedAction.key);
};
}, [
addActionMenuEntry,
removeActionMenuEntry,
shouldBeRegistered,
wrappedAction,
]);
return null;
};

14
packages/twenty-front/src/modules/action-menu/actions/record-agnostic-actions/components/RunWorkflowRecordAgnosticActionMenuEntriesSetter.tsx Normal file
View File

@ -0,0 +1,14 @@
import { RegisterAgnosticRecordActionEffect } from '@/action-menu/actions/record-agnostic-actions/components/RegisterAgnosticRecordActionEffect';
import { useRunWorkflowActions } from '@/action-menu/actions/record-agnostic-actions/run-workflow-actions/hooks/useRunWorkflowActions';
export const RunWorkflowRecordAgnosticActionMenuEntriesSetter = () => {
const { runWorkflowActions } = useRunWorkflowActions();
return (
<>
{runWorkflowActions.map((action) => (
<RegisterAgnosticRecordActionEffect key={action.key} action={action} />
))}
</>
);
};

31
packages/twenty-front/src/modules/action-menu/actions/record-agnostic-actions/constants/RecordAgnosticActionsConfig.ts Normal file
View File

@ -0,0 +1,31 @@
import { useSearchRecordsRecordAgnosticAction } from '@/action-menu/actions/record-agnostic-actions/hooks/useSearchRecordsRecordAgnosticAction';
import { RecordAgnosticActionsKey } from '@/action-menu/actions/record-agnostic-actions/types/RecordAgnosticActionsKey';
import { ActionHookWithoutObjectMetadataItem } from '@/action-menu/actions/types/ActionHook';
import { ActionViewType } from '@/action-menu/actions/types/ActionViewType';
import {
ActionMenuEntry,
ActionMenuEntryScope,
ActionMenuEntryType,
} from '@/action-menu/types/ActionMenuEntry';
import { IconSearch } from 'twenty-ui';
export const RECORD_AGNOSTIC_ACTIONS_CONFIG: Record<
string,
ActionMenuEntry & {
useAction: ActionHookWithoutObjectMetadataItem;
}
> = {
searchRecords: {
type: ActionMenuEntryType.Standard,
scope: ActionMenuEntryScope.Global,
key: RecordAgnosticActionsKey.SEARCH_RECORDS,
label: 'Search records',
shortLabel: 'Search',
position: 0,
isPinned: false,
Icon: IconSearch,
availableOn: [ActionViewType.GLOBAL],
useAction: useSearchRecordsRecordAgnosticAction,
hotKeys: ['/'],
},
};

26
packages/twenty-front/src/modules/action-menu/actions/record-agnostic-actions/hooks/useRecordAgnosticActions.ts
View File

@ -1,26 +0,0 @@
import { useWorkflowRunActions } from '@/action-menu/actions/record-agnostic-actions/workflow-run-actions/hooks/useWorkflowRunActions';
import { useIsFeatureEnabled } from '@/workspace/hooks/useIsFeatureEnabled';
import { FeatureFlagKey } from '~/generated/graphql';
export const useRecordAgnosticActions = () => {
const isWorkflowEnabled = useIsFeatureEnabled(
FeatureFlagKey.IsWorkflowEnabled,
);
const { addWorkflowRunActions, removeWorkflowRunActions } =
useWorkflowRunActions();
const registerRecordAgnosticActions = () => {
if (isWorkflowEnabled) {
addWorkflowRunActions();
}
};
const unregisterRecordAgnosticActions = () => {
if (isWorkflowEnabled) {
removeWorkflowRunActions();
}
};
return { registerRecordAgnosticActions, unregisterRecordAgnosticActions };
};

28
packages/twenty-front/src/modules/action-menu/actions/record-agnostic-actions/hooks/useSearchRecordsRecordAgnosticAction.ts Normal file
View File

@ -0,0 +1,28 @@
import { useCommandMenu } from '@/command-menu/hooks/useCommandMenu';
import { commandMenuPageState } from '@/command-menu/states/commandMenuPageState';
import { commandMenuPageInfoState } from '@/command-menu/states/commandMenuPageTitle';
import { CommandMenuPages } from '@/command-menu/types/CommandMenuPages';
import { useRecoilCallback } from 'recoil';
import { IconSearch } from 'twenty-ui';
export const useSearchRecordsRecordAgnosticAction = () => {
const { openCommandMenu } = useCommandMenu();
const onClick = useRecoilCallback(
({ set }) =>
() => {
set(commandMenuPageState, CommandMenuPages.SearchRecords);
set(commandMenuPageInfoState, {
title: 'Search',
Icon: IconSearch,
});
openCommandMenu();
},
[openCommandMenu],
);
return {
onClick,
shouldBeRegistered: true,
};
};

49
packages/twenty-front/src/modules/action-menu/actions/record-agnostic-actions/workflow-run-actions/hooks/useWorkflowRunActions.tsx → packages/twenty-front/src/modules/action-menu/actions/record-agnostic-actions/run-workflow-actions/hooks/useRunWorkflowActions.tsx
View File

@ -1,4 +1,3 @@
import { useActionMenuEntries } from '@/action-menu/hooks/useActionMenuEntries';
import {
ActionMenuEntryScope,
ActionMenuEntryType,
@ -11,55 +10,49 @@ import { capitalize } from 'twenty-shared';
import { IconSettingsAutomation, isDefined } from 'twenty-ui';
import { FeatureFlagKey } from '~/generated/graphql';
export const useWorkflowRunActions = () => {
export const useRunWorkflowActions = () => {
const isWorkflowEnabled = useIsFeatureEnabled(
FeatureFlagKey.IsWorkflowEnabled,
);
const { addActionMenuEntry, removeActionMenuEntry } = useActionMenuEntries();
const { records: activeWorkflowVersions } = useAllActiveWorkflowVersions({
triggerType: 'MANUAL',
});
const { runWorkflowVersion } = useRunWorkflowVersion();
const addWorkflowRunActions = () => {
if (!isWorkflowEnabled) {
return;
}
if (!isWorkflowEnabled) {
return { runWorkflowActions: [] };
}
for (const [
index,
activeWorkflowVersion,
] of activeWorkflowVersions.entries()) {
const runWorkflowActions = activeWorkflowVersions
.map((activeWorkflowVersion, index) => {
if (!isDefined(activeWorkflowVersion.workflow)) {
continue;
return undefined;
}
const name = capitalize(activeWorkflowVersion.workflow.name);
addActionMenuEntry({
return {
type: ActionMenuEntryType.WorkflowRun,
key: `workflow-run-${activeWorkflowVersion.id}`,
scope: ActionMenuEntryScope.Global,
label: name,
position: index,
Icon: IconSettingsAutomation,
onClick: async () => {
await runWorkflowVersion({
workflowVersionId: activeWorkflowVersion.id,
});
useAction: () => {
return {
shouldBeRegistered: true,
onClick: async () => {
await runWorkflowVersion({
workflowVersionId: activeWorkflowVersion.id,
});
},
};
},
});
}
};
};
})
.filter(isDefined);
const removeWorkflowRunActions = () => {
for (const activeWorkflowVersion of activeWorkflowVersions) {
removeActionMenuEntry(`workflow-run-${activeWorkflowVersion.id}`);
}
};
return { addWorkflowRunActions, removeWorkflowRunActions };
return { runWorkflowActions };
};

3
packages/twenty-front/src/modules/action-menu/actions/record-agnostic-actions/types/RecordAgnosticActionsKey.ts Normal file
View File

@ -0,0 +1,3 @@
export enum RecordAgnosticActionsKey {
SEARCH_RECORDS = 'search-records',
}

1
packages/twenty-front/src/modules/action-menu/actions/types/ActionViewType.ts
View File

@ -1,4 +1,5 @@
export enum ActionViewType {
GLOBAL = 'GLOBAL',
INDEX_PAGE_BULK_SELECTION = 'INDEX_PAGE_BULK_SELECTION',
INDEX_PAGE_SINGLE_RECORD_SELECTION = 'INDEX_PAGE_SINGLE_RECORD_SELECTION',
INDEX_PAGE_NO_SELECTION = 'INDEX_PAGE_NO_SELECTION',

16
packages/twenty-front/src/modules/action-menu/components/RecordIndexActionMenu.tsx
View File

@ -1,6 +1,7 @@
import { RecordActionMenuEntriesSetter } from '@/action-menu/actions/record-actions/components/RecordActionMenuEntriesSetter';
import { MultipleRecordsActionKeys } from '@/action-menu/actions/record-actions/multiple-records/types/MultipleRecordsActionKeys';
import { RecordAgnosticActionsSetterEffect } from '@/action-menu/actions/record-agnostic-actions/components/RecordAgnosticActionsSetterEffect';
import { RecordAgnosticActionMenuEntriesSetter } from '@/action-menu/actions/record-agnostic-actions/components/RecordAgnosticActionMenuEntriesSetter';
import { RunWorkflowRecordAgnosticActionMenuEntriesSetter } from '@/action-menu/actions/record-agnostic-actions/components/RunWorkflowRecordAgnosticActionMenuEntriesSetter';
import { ActionMenuConfirmationModals } from '@/action-menu/components/ActionMenuConfirmationModals';
import { RecordIndexActionMenuBar } from '@/action-menu/components/RecordIndexActionMenuBar';
import { RecordIndexActionMenuButtons } from '@/action-menu/components/RecordIndexActionMenuButtons';
@ -21,14 +22,14 @@ export const RecordIndexActionMenu = ({ indexId }: { indexId: string }) => {
contextStoreCurrentObjectMetadataIdComponentState,
);
const isWorkflowEnabled = useIsFeatureEnabled(
FeatureFlagKey.IsWorkflowEnabled,
);
const isCommandMenuV2Enabled = useIsFeatureEnabled(
FeatureFlagKey.IsCommandMenuV2Enabled,
);
const isWorkflowEnabled = useIsFeatureEnabled(
FeatureFlagKey.IsWorkflowEnabled,
);
const isMobile = useIsMobile();
const setIsLoadMoreLocked = useSetRecoilComponentStateV2(
@ -63,7 +64,10 @@ export const RecordIndexActionMenu = ({ indexId }: { indexId: string }) => {
<ActionMenuConfirmationModals />
<RecordIndexActionMenuEffect />
<RecordActionMenuEntriesSetter />
{isWorkflowEnabled && <RecordAgnosticActionsSetterEffect />}
<RecordAgnosticActionMenuEntriesSetter />
{isWorkflowEnabled && (
<RunWorkflowRecordAgnosticActionMenuEntriesSetter />
)}
</ActionMenuContext.Provider>
)}
</>

16
packages/twenty-front/src/modules/action-menu/components/RecordShowActionMenu.tsx
View File

@ -1,5 +1,6 @@
import { RecordActionMenuEntriesSetter } from '@/action-menu/actions/record-actions/components/RecordActionMenuEntriesSetter';
import { RecordAgnosticActionsSetterEffect } from '@/action-menu/actions/record-agnostic-actions/components/RecordAgnosticActionsSetterEffect';
import { RecordAgnosticActionMenuEntriesSetter } from '@/action-menu/actions/record-agnostic-actions/components/RecordAgnosticActionMenuEntriesSetter';
import { RunWorkflowRecordAgnosticActionMenuEntriesSetter } from '@/action-menu/actions/record-agnostic-actions/components/RunWorkflowRecordAgnosticActionMenuEntriesSetter';
import { ActionMenuConfirmationModals } from '@/action-menu/components/ActionMenuConfirmationModals';
import { RecordShowActionMenuButtons } from '@/action-menu/components/RecordShowActionMenuButtons';
import { ActionMenuContext } from '@/action-menu/contexts/ActionMenuContext';
@ -29,14 +30,14 @@ export const RecordShowActionMenu = ({
contextStoreCurrentObjectMetadataIdComponentState,
);
const isWorkflowEnabled = useIsFeatureEnabled(
FeatureFlagKey.IsWorkflowEnabled,
);
const isCommandMenuV2Enabled = useIsFeatureEnabled(
FeatureFlagKey.IsCommandMenuV2Enabled,
);
const isWorkflowEnabled = useIsFeatureEnabled(
FeatureFlagKey.IsWorkflowEnabled,
);
// TODO: refactor RecordShowPageBaseHeader to use the context store
return (
@ -63,7 +64,10 @@ export const RecordShowActionMenu = ({
)}
<ActionMenuConfirmationModals />
<RecordActionMenuEntriesSetter />
{isWorkflowEnabled && <RecordAgnosticActionsSetterEffect />}
<RecordAgnosticActionMenuEntriesSetter />
{isWorkflowEnabled && (
<RunWorkflowRecordAgnosticActionMenuEntriesSetter />
)}
</ActionMenuContext.Provider>
)}
</>

10
packages/twenty-front/src/modules/action-menu/components/RecordShowRightDrawerActionMenu.tsx
View File

@ -1,5 +1,6 @@
import { RecordActionMenuEntriesSetter } from '@/action-menu/actions/record-actions/components/RecordActionMenuEntriesSetter';
import { RecordAgnosticActionsSetterEffect } from '@/action-menu/actions/record-agnostic-actions/components/RecordAgnosticActionsSetterEffect';
import { RecordAgnosticActionMenuEntriesSetter } from '@/action-menu/actions/record-agnostic-actions/components/RecordAgnosticActionMenuEntriesSetter';
import { RunWorkflowRecordAgnosticActionMenuEntriesSetter } from '@/action-menu/actions/record-agnostic-actions/components/RunWorkflowRecordAgnosticActionMenuEntriesSetter';
import { ActionMenuConfirmationModals } from '@/action-menu/components/ActionMenuConfirmationModals';
import { RightDrawerActionMenuDropdown } from '@/action-menu/components/RightDrawerActionMenuDropdown';
import { ActionMenuContext } from '@/action-menu/contexts/ActionMenuContext';
@ -7,7 +8,7 @@ import { ActionMenuContext } from '@/action-menu/contexts/ActionMenuContext';
import { contextStoreCurrentObjectMetadataIdComponentState } from '@/context-store/states/contextStoreCurrentObjectMetadataIdComponentState';
import { useRecoilComponentValueV2 } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentValueV2';
import { useIsFeatureEnabled } from '@/workspace/hooks/useIsFeatureEnabled';
import { FeatureFlagKey } from '~/generated/graphql';
import { FeatureFlagKey } from '~/generated-metadata/graphql';
export const RecordShowRightDrawerActionMenu = () => {
const contextStoreCurrentObjectMetadataId = useRecoilComponentValueV2(
@ -25,7 +26,10 @@ export const RecordShowRightDrawerActionMenu = () => {
<RightDrawerActionMenuDropdown />
<ActionMenuConfirmationModals />
<RecordActionMenuEntriesSetter />
{isWorkflowEnabled && <RecordAgnosticActionsSetterEffect />}
<RecordAgnosticActionMenuEntriesSetter />
{isWorkflowEnabled && (
<RunWorkflowRecordAgnosticActionMenuEntriesSetter />
)}
</ActionMenuContext.Provider>
)}
</>

2
packages/twenty-front/src/modules/action-menu/types/ActionMenuEntry.ts
View File

@ -11,6 +11,7 @@ export enum ActionMenuEntryType {
export enum ActionMenuEntryScope {
Global = 'Global',
RecordSelection = 'RecordSelection',
Object = 'Object',
}
export type ActionMenuEntry = {
@ -26,4 +27,5 @@ export type ActionMenuEntry = {
availableOn?: ActionViewType[];
onClick?: (event?: MouseEvent<HTMLElement>) => void;
ConfirmationModal?: ReactElement<ConfirmationModalProps>;
hotKeys?: string[];
};