refactor(component): adjust confirm modal api (#7589)

packages/frontend/core/src/components/admin-panel/admin-panel-header.tsx

@@ -39,8 +39,8 @@ export const AdminPanelHeader = ({
               title: 'Save Runtime Configurations ?',
               description:
                 'Are you sure you want to save the following changes?',
+              confirmText: 'Save',
               confirmButtonOptions: {
-                children: 'Save',
                 type: 'primary',
               },
               onConfirm: onConfirm,

packages/frontend/core/src/components/affine/auth/ai-login-required.tsx

@@ -25,8 +25,8 @@ export const AiLoginRequiredModal = () => {
           setOpen(false);
           openSignIn();
         },
+        confirmText: t['com.affine.ai.login-required.dialog-confirm'](),
         confirmButtonOptions: {
-          children: t['com.affine.ai.login-required.dialog-confirm'](),
           type: 'primary',
         },
         cancelText: t['com.affine.ai.login-required.dialog-cancel'](),

packages/frontend/core/src/components/affine/create-workspace-modal/index.tsx

@@ -104,11 +104,11 @@ const NameWorkspaceContent = ({
       title={t['com.affine.nameWorkspace.title']()}
       description={t['com.affine.nameWorkspace.description']()}
       cancelText={t['com.affine.nameWorkspace.button.cancel']()}
+      confirmText={t['com.affine.nameWorkspace.button.create']()}
       confirmButtonOptions={{
         type: 'primary',
         disabled: !workspaceName || loading,
         ['data-testid' as string]: 'create-workspace-create-button',
-        children: t['com.affine.nameWorkspace.button.create'](),
       }}
       closeButtonOptions={{
         ['data-testid' as string]: 'create-workspace-close-button',

packages/frontend/core/src/components/affine/page-history-modal/history-modal.tsx

@@ -478,10 +478,10 @@ const PageHistoryManager = ({
         ['data-testid' as string]: 'confirm-restore-history-modal',
         style: { padding: '20px 26px' },
       },
+      confirmText: t['com.affine.history.confirm-restore-modal.restore'](),
       confirmButtonOptions: {
         type: 'primary',
         ['data-testid' as string]: 'confirm-restore-history-button',
-        children: t['com.affine.history.confirm-restore-modal.restore'](),
       },
       onConfirm: handleRestore,
     });

packages/frontend/core/src/components/affine/page-properties/confirm-delete-property-modal.tsx

@@ -44,13 +44,13 @@ export const ConfirmDeletePropertyModal = ({
           removed from count doc(s). This action cannot be undone.
         </Trans>
       }
+      confirmText={t['Confirm']()}
       onConfirm={onConfirm}
       cancelButtonOptions={{
         onClick: onCancel,
       }}
       confirmButtonOptions={{
         type: 'error',
-        children: t['Confirm'](),
       }}
     />
   );

packages/frontend/core/src/components/affine/quota-reached-modal/cloud-quota-modal.tsx

@@ -108,11 +108,11 @@ export const CloudQuotaModal = () => {
         hidden: !isFreePlanOwner,
       }}
       onConfirm={handleUpgradeConfirm}
+      confirmText={
+        isFreePlanOwner ? t['com.affine.payment.upgrade']() : t['Got it']()
+      }
       confirmButtonOptions={{
         type: 'primary',
-        children: isFreePlanOwner
-          ? t['com.affine.payment.upgrade']()
-          : t['Got it'](),
       }}
     />
   );

packages/frontend/core/src/components/affine/quota-reached-modal/local-quota-modal.tsx

@@ -35,9 +35,9 @@ export const LocalQuotaModal = () => {
         hidden: true,
       }}
       onConfirm={onConfirm}
+      confirmText={t['Got it']()}
       confirmButtonOptions={{
         type: 'primary',
-        children: t['Got it'](),
       }}
     />
   );

packages/frontend/core/src/components/affine/setting-modal/general-setting/plans/ai/actions/cancel.tsx

@@ -33,9 +33,9 @@ export const AICancel = ({ ...btnProps }: AICancelProps) => {
       description:
         t['com.affine.payment.ai.action.cancel.confirm.description'](),
       reverseFooter: true,
+      confirmText:
+        t['com.affine.payment.ai.action.cancel.confirm.confirm-text'](),
       confirmButtonOptions: {
-        children:
-          t['com.affine.payment.ai.action.cancel.confirm.confirm-text'](),
         type: 'default',
       },
       cancelText:

packages/frontend/core/src/components/affine/setting-modal/general-setting/plans/ai/actions/resume.tsx

@@ -38,9 +38,9 @@ export const AIResume = ({ ...btnProps }: AIResumeProps) => {
       title: t['com.affine.payment.ai.action.resume.confirm.title'](),
       description:
         t['com.affine.payment.ai.action.resume.confirm.description'](),
+      confirmText:
+        t['com.affine.payment.ai.action.resume.confirm.confirm-text'](),
       confirmButtonOptions: {
-        children:
-          t['com.affine.payment.ai.action.resume.confirm.confirm-text'](),
         type: 'primary',
       },
       cancelText:

packages/frontend/core/src/components/affine/setting-modal/general-setting/plans/modals.tsx

@@ -46,9 +46,9 @@ export const ConfirmLoadingModal = ({
     <ConfirmModal
       title={title}
       cancelText={cancelText}
+      confirmText={confirmText}
       confirmButtonOptions={{
         type: 'primary',
-        children: confirmText,
         loading,
       }}
       open={open}

packages/frontend/core/src/components/affine/setting-modal/workspace-setting/new-workspace-setting-detail/delete-leave-workspace/delete/index.tsx

@@ -36,11 +36,11 @@ export const WorkspaceDeleteModal = ({
     <ConfirmModal
       title={`${t['com.affine.workspaceDelete.title']()}?`}
       cancelText={t['com.affine.workspaceDelete.button.cancel']()}
+      confirmText={t['com.affine.workspaceDelete.button.delete']()}
       confirmButtonOptions={{
         type: 'error',
         disabled: !allowDelete,
         ['data-testid' as string]: 'delete-workspace-confirm-button',
-        children: t['com.affine.workspaceDelete.button.delete'](),
       }}
       {...props}
     >

packages/frontend/core/src/components/affine/setting-modal/workspace-setting/new-workspace-setting-detail/delete-leave-workspace/index.tsx

@@ -134,9 +134,9 @@ export const DeleteLeaveWorkspace = () => {
           onOpenChange={setShowLeave}
           title={`${t['com.affine.deleteLeaveWorkspace.leave']()}?`}
           description={t['com.affine.deleteLeaveWorkspace.leaveDescription']()}
+          confirmText={t['Leave']()}
           confirmButtonOptions={{
             type: 'warning',
-            children: t['Leave'](),
           }}
         />
       )}

packages/frontend/core/src/components/affine/sign-out-modal/index.tsx

@@ -10,7 +10,7 @@ type SignOutConfirmModalI18NKeys =
   | 'confirm';
 
 export const SignOutModal = ({ ...props }: ConfirmModalProps) => {
-  const { title, description, cancelText, confirmButtonOptions = {} } = props;
+  const { title, description, cancelText, confirmText } = props;
   const t = useI18n();
 
   const defaultTexts = useMemo(() => {
@@ -30,10 +30,10 @@ export const SignOutModal = ({ ...props }: ConfirmModalProps) => {
       title={title ?? defaultTexts.title}
       description={description ?? defaultTexts.description}
       cancelText={cancelText ?? defaultTexts.cancelText}
+      confirmText={confirmText ?? defaultTexts.children}
       confirmButtonOptions={{
         type: 'error',
         ['data-testid' as string]: 'confirm-sign-out-button',
-        children: confirmButtonOptions.children ?? defaultTexts.children,
       }}
       contentOptions={{
         ['data-testid' as string]: 'confirm-sign-out-modal',

packages/frontend/core/src/components/blocksuite/block-suite-editor/specs/custom/spec-patchers.tsx

@@ -130,8 +130,8 @@ export function patchNotificationService(
           openConfirmModal({
             title: toReactNode(title),
             description: toReactNode(message),
+            confirmText,
             confirmButtonOptions: {
-              children: confirmText,
               type: 'primary',
             },
             cancelText,
@@ -173,13 +173,11 @@ export function patchNotificationService(
           openConfirmModal({
             title: toReactNode(title),
             description: description,
+            confirmText: confirmText ?? 'Confirm',
             confirmButtonOptions: {
-              children: confirmText ?? 'Confirm',
               type: 'primary',
             },
-            cancelButtonOptions: {
-              children: cancelText ?? 'Cancel',
-            },
+            cancelText: cancelText ?? 'Cancel',
             onConfirm: () => {
               resolve(value);
             },

packages/frontend/core/src/components/page-list/docs/page-list-header.tsx

@@ -123,9 +123,9 @@ export const CollectionPageListHeader = ({
         title: t['com.affine.collection.add-doc.confirm.title'](),
         description: t['com.affine.collection.add-doc.confirm.description'](),
         cancelText: t['Cancel'](),
+        confirmText: t['Confirm'](),
         confirmButtonOptions: {
           type: 'primary',
-          children: t['Confirm'](),
         },
         onConfirm: () => createAndAddDocument(createDocumentFn),
       });

packages/frontend/core/src/components/page-list/operation-cell.tsx

@@ -269,9 +269,9 @@ export const TrashOperationCell = ({
       title: `${t['com.affine.trashOperation.deletePermanently']()}?`,
       description: t['com.affine.trashOperation.deleteDescription'](),
       cancelText: t['Cancel'](),
+      confirmText: t['com.affine.trashOperation.delete'](),
       confirmButtonOptions: {
         type: 'error',
-        children: t['com.affine.trashOperation.delete'](),
       },
       onConfirm: onPermanentlyDeletePage,
     });
@@ -384,9 +384,9 @@ export const CollectionOperationCell = ({
       title: t['com.affine.collection.add-doc.confirm.title'](),
       description: t['com.affine.collection.add-doc.confirm.description'](),
       cancelText: t['Cancel'](),
+      confirmText: t['Confirm'](),
       confirmButtonOptions: {
         type: 'primary',
-        children: t['Confirm'](),
       },
       onConfirm: createAndAddDocument,
     });

packages/frontend/core/src/components/page-list/operation-menu-items/move-to-trash.tsx

@@ -46,10 +46,10 @@ const MoveToTrashConfirm = ({
       title={title}
       description={description}
       cancelText={t['com.affine.confirmModal.button.cancel']()}
+      confirmText={t.Delete()}
       confirmButtonOptions={{
         ['data-testid' as string]: 'confirm-delete-page',
         type: 'error',
-        children: t.Delete(),
       }}
       {...confirmModalProps}
     />

packages/frontend/core/src/components/page-list/virtualized-trash-list.tsx

@@ -73,9 +73,9 @@ export const VirtualizedTrashList = () => {
       title: `${t['com.affine.trashOperation.deletePermanently']()}?`,
       description: t['com.affine.trashOperation.deleteDescription'](),
       cancelText: t['Cancel'](),
+      confirmText: t['com.affine.trashOperation.delete'](),
       confirmButtonOptions: {
         type: 'error',
-        children: t['com.affine.trashOperation.delete'](),
       },
       onConfirm: handleMultiDelete,
     });

packages/frontend/core/src/components/pure/trash-page-footer/index.tsx

@@ -79,9 +79,9 @@ export const TrashPageFooter = () => {
         title={t['com.affine.trashOperation.delete.title']()}
         cancelText={t['com.affine.confirmModal.button.cancel']()}
         description={t['com.affine.trashOperation.delete.description']()}
+        confirmText={t['com.affine.trashOperation.delete']()}
         confirmButtonOptions={{
           type: 'error',
-          children: t['com.affine.trashOperation.delete'](),
         }}
         open={open}
         onConfirm={onConfirmDelete}

packages/frontend/core/src/components/pure/workspace-slider-bar/collections/collections-list.tsx

@@ -129,9 +129,9 @@ export const CollectionSidebarNavItem = ({
       title: t['com.affine.collection.add-doc.confirm.title'](),
       description: t['com.affine.collection.add-doc.confirm.description'](),
       cancelText: t['Cancel'](),
+      confirmText: t['Confirm'](),
       confirmButtonOptions: {
         type: 'primary',
-        children: t['Confirm'](),
       },
       onConfirm: createAndAddDocument,
     });