Headless action modal (#18270)

https://github.com/user-attachments/assets/809a281f-3c38-41df-99db-e780941acf9f

packages/twenty-front/src/modules/front-components/hooks/useFrontComponentExecutionContext.ts

@@ -5,6 +5,7 @@ import {
 } from 'twenty-sdk/front-component-renderer';
 import { type AppPath, type EnqueueSnackbarParams } from 'twenty-shared/types';
 
+import { useActionMenuConfirmationModal } from '@/action-menu/confirmation-modal/hooks/useActionMenuConfirmationModal';
 import { currentUserState } from '@/auth/states/currentUserState';
 import { useCommandMenu } from '@/command-menu/hooks/useCommandMenu';
 import { useNavigateCommandMenu } from '@/command-menu/hooks/useNavigateCommandMenu';
@@ -31,6 +32,7 @@ export const useFrontComponentExecutionContext = ({
   const { requestAccessTokenRefresh } = useRequestApplicationTokenRefresh({
     frontComponentId,
   });
+  const { openConfirmationModal } = useActionMenuConfirmationModal();
   const { navigateCommandMenu } = useNavigateCommandMenu();
   const setCommandMenuSearch = useSetAtomState(commandMenuSearchState);
   const { getIcon } = useIcons();
@@ -70,6 +72,17 @@ export const useFrontComponentExecutionContext = ({
       }
     };
 
+  const openActionConfirmationModal: FrontComponentHostCommunicationApi['openActionConfirmationModal'] =
+    async ({ title, subtitle, confirmButtonText, confirmButtonAccent }) => {
+      openConfirmationModal({
+        frontComponentId,
+        title,
+        subtitle,
+        confirmButtonText,
+        confirmButtonAccent,
+      });
+    };
+
   const enqueueSnackbar: FrontComponentHostCommunicationApi['enqueueSnackbar'] =
     async ({
       message,
@@ -125,6 +138,7 @@ export const useFrontComponentExecutionContext = ({
       navigate,
       requestAccessTokenRefresh,
       openSidePanelPage,
+      openActionConfirmationModal,
       enqueueSnackbar,
       unmountFrontComponent,
       closeSidePanel,