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

@ -18,16 +18,16 @@ import { isMicrosoftCalendarEnabledState } from '@/client-config/states/isMicros
import { isMicrosoftMessagingEnabledState } from '@/client-config/states/isMicrosoftMessagingEnabledState';
import { useTriggerApisOAuth } from '@/settings/accounts/hooks/useTriggerApiOAuth';
import { AppPath } from '@/types/AppPath';
import { ConnectedAccountProvider } from 'twenty-shared/types';
import { IconGoogle, IconMicrosoft } from 'twenty-ui/display';
import { MainButton } from 'twenty-ui/input';
import { ClickToActionLink } from 'twenty-ui/navigation';
import {
CalendarChannelVisibility,
MessageChannelVisibility,
OnboardingStatus,
useSkipSyncEmailOnboardingStepMutation,
} from '~/generated/graphql';
import { ConnectedAccountProvider } from 'twenty-shared/types';
import { ActionLink } from 'twenty-ui/navigation';
import { IconGoogle, IconMicrosoft } from 'twenty-ui/display';
import { MainButton } from 'twenty-ui/input';
const StyledSyncEmailsContainer = styled.div`
display: flex;
@ -150,9 +150,9 @@ export const SyncEmails = () => {
)}
</StyledProviderContainer>
<StyledActionLinkContainer>
<ActionLink onClick={continueWithoutSync}>
<ClickToActionLink onClick={continueWithoutSync}>
Continue without sync
</ActionLink>
</ClickToActionLink>
</StyledActionLinkContainer>
</>
);