Action menu refactoring (#11454)

# Description

Closes [#696](https://github.com/twentyhq/core-team-issues/issues/696)

- `useAction` hooks have been removed for all actions
- Every action can now declare a react component
- Some standard action components have been introduced: `Action`,
`ActionLink` and `ActionModal`
- The `ActionDisplay` component uses the new `displayType` prop of the
`ActionMenuContext` to render the right component for the action
according to its container: `ActionButton`, `ActionDropdownItem` or
`ActionListItem`
- The `ActionDisplayer` wraps the action component inside a context
which gives it all the information about the action
-`actionMenuEntriesComponenState` has been removed and now all actions
are computed directly using `useRegisteredAction`
- This computation is done inside `ActionMenuContextProvider` and the
actions are passed inside a context
- `actionMenuType` gives information about the container of the action,
so the action can know wether or not to close this container upon
execution
This commit is contained in:
Raphaël Bosi
2025-04-09 15:12:49 +02:00
committed by GitHub
parent 1834b38d04
commit 9e0402e691
235 changed files with 6252 additions and 7590 deletions

View File

@ -0,0 +1,69 @@
import { Action } from '@/action-menu/actions/components/Action';
import { SingleRecordActionKeys } from '@/action-menu/actions/record-actions/single-record/types/SingleRecordActionsKey';
import { ActionConfig } from '@/action-menu/actions/types/ActionConfig';
import { ActionScope } from '@/action-menu/actions/types/ActionScope';
import { ActionType } from '@/action-menu/actions/types/ActionType';
import { ActionViewType } from '@/action-menu/actions/types/ActionViewType';
import { msg } from '@lingui/core/macro';
import { IconFileExport, IconHeart, IconTrash } from 'twenty-ui/display';
export const createMockActionMenuActions = ({
deleteMock,
addToFavoritesMock,
exportMock,
}: {
deleteMock: () => void;
addToFavoritesMock: () => void;
exportMock: () => void;
}): ActionConfig[] => [
{
type: ActionType.Standard,
scope: ActionScope.RecordSelection,
key: SingleRecordActionKeys.ADD_TO_FAVORITES,
label: msg`Add to favorites`,
shortLabel: msg`Add to favorites`,
position: 2,
isPinned: true,
Icon: IconHeart,
shouldBeRegistered: () => true,
availableOn: [
ActionViewType.INDEX_PAGE_SINGLE_RECORD_SELECTION,
ActionViewType.SHOW_PAGE,
],
component: <Action onClick={addToFavoritesMock} />,
},
{
type: ActionType.Standard,
scope: ActionScope.RecordSelection,
key: SingleRecordActionKeys.EXPORT,
label: msg`Export`,
shortLabel: msg`Export`,
position: 4,
Icon: IconFileExport,
accent: 'default',
isPinned: false,
shouldBeRegistered: () => true,
availableOn: [
ActionViewType.SHOW_PAGE,
ActionViewType.INDEX_PAGE_SINGLE_RECORD_SELECTION,
],
component: <Action onClick={exportMock} />,
},
{
type: ActionType.Standard,
scope: ActionScope.RecordSelection,
key: SingleRecordActionKeys.DELETE,
label: msg`Delete`,
shortLabel: msg`Delete`,
position: 7,
Icon: IconTrash,
accent: 'default',
isPinned: true,
shouldBeRegistered: () => true,
availableOn: [
ActionViewType.INDEX_PAGE_SINGLE_RECORD_SELECTION,
ActionViewType.SHOW_PAGE,
],
component: <Action onClick={deleteMock} />,
},
];