# 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
34 lines
756 B
TypeScript
34 lines
756 B
TypeScript
import { ActionDisplayProps } from '@/action-menu/actions/display/components/ActionDisplay';
|
|
import { getActionLabel } from '@/action-menu/utils/getActionLabel';
|
|
import { useNavigate } from 'react-router-dom';
|
|
import { isDefined } from 'twenty-shared/utils';
|
|
import { MenuItem } from 'twenty-ui/navigation';
|
|
|
|
export const ActionDropdownItem = ({
|
|
action,
|
|
onClick,
|
|
to,
|
|
}: {
|
|
action: ActionDisplayProps;
|
|
onClick?: () => void;
|
|
to?: string;
|
|
}) => {
|
|
const navigate = useNavigate();
|
|
|
|
const handleClick = () => {
|
|
onClick?.();
|
|
if (isDefined(to)) {
|
|
navigate(to);
|
|
}
|
|
};
|
|
|
|
return (
|
|
<MenuItem
|
|
key={action.key}
|
|
LeftIcon={action.Icon}
|
|
onClick={handleClick}
|
|
text={getActionLabel(action.label)}
|
|
/>
|
|
);
|
|
};
|