feat(web): use App replace confirm

2026-03-25 18:31:52 +08:00
parent c4b83b1f9c
commit 0bae290e0c
12 changed files with 75 additions and 87 deletions
--- a/web/src/components/SliderInput/index.tsx
+++ b/web/src/components/SliderInput/index.tsx
@@ -1,8 +1,8 @@
 /*
 * @Author: ZhaoYing 
 * @Date: 2026-02-02 15:26:44 
- * @Last Modified by:   ZhaoYing 
- * @Last Modified time: 2026-02-02 15:26:44 
+ * @Last Modified by: ZhaoYing
+ * @Last Modified time: 2026-03-25 18:14:20
 */
 /**
 * SliderInput Component
@@ -107,7 +107,7 @@ const SliderInput: FC<SliderInputProps> = ({
    <div className={`rb:w-full ${className}`}>
      {/* Optional label */}
      {label && (
-        <div className="rb:text-sm rb:font-medium rb:text-[#475467]">
+        <div className="rb:text-[#5B6167] rb:leading-5 rb:mb-1">
          {label}
        </div>
      )}
@@ -127,7 +127,7 @@ const SliderInput: FC<SliderInputProps> = ({
          />
        </Col>
        {/* Input number component */}
-        <Col flex="120px">
+        <Col flex="80px">
          <InputNumber
            min={min}
            max={max}
@@ -135,7 +135,7 @@ const SliderInput: FC<SliderInputProps> = ({
            value={internalValue}
            onChange={handleInputChange}
            disabled={disabled}
-            className={`rb:w-full ${inputClassName}`}
+            className={`rb:w-full! ${inputClassName}`}
            controls
          />
        </Col>
--- a/web/src/components/Upload/UploadFiles.tsx
+++ b/web/src/components/Upload/UploadFiles.tsx
@@ -10,7 +10,6 @@ import { useTranslation } from 'react-i18next';
 import { cookieUtils } from '@/utils/request'
 import { fileUpload } from '@/api/fileStorage'

-const { confirm } = Modal;
 const { Dragger } = Upload;

 interface UploadFilesProps extends Omit<UploadProps, 'onChange'> {
@@ -91,14 +90,14 @@ const UploadFiles = forwardRef<UploadFilesRef, UploadFilesProps>(({
  ...props
 }, ref) => {
  const { t } = useTranslation();
-  const { message } = App.useApp()
+  const { message, modal } = App.useApp()
  const [fileList, setFileList] = useState<UploadFile[]>(propFileList);
  const [accept, setAccept] = useState<string | undefined>();

  // 处理文件移除
  const handleRemove = (file: UploadFile) => {
    // 显示确认弹窗
-    confirm({
+    modal.confirm({
      title: `${t('common.confirmRemoveFile')}`,
      okText: `${t('common.confirm')}`,
      okType: 'danger',
--- a/web/src/views/EmotionEngine/index.tsx
+++ b/web/src/views/EmotionEngine/index.tsx
@@ -2,7 +2,7 @@
 * @Author: ZhaoYing 
 * @Date: 2026-02-03 16:56:54 
 * @Last Modified by: ZhaoYing
- * @Last Modified time: 2026-03-25 11:42:26
+ * @Last Modified time: 2026-03-25 18:28:18
 */
 /**
 * Emotion Engine Configuration Page
@@ -11,7 +11,7 @@
 */

 import React, { useState, useEffect } from 'react';
-import { Row, Col, Form, Button, message, Space, Flex, Tooltip } from 'antd';
+import { Row, Col, Form, Button, App, Space, Flex, Tooltip } from 'antd';
 import { useParams } from 'react-router-dom';
 import { useTranslation } from 'react-i18next';
 import clsx from 'clsx';
@@ -67,7 +67,7 @@ const EmotionEngine: React.FC = () => {
  const { id } = useParams();
  const [configData, setConfigData] = useState<ConfigForm>({} as ConfigForm);
  const [form] = Form.useForm<ConfigForm>();
-  const [messageApi, contextHolder] = message.useMessage();
+  const { message: messageApi } = App.useApp();
  const [loading, setLoading] = useState(false)

  const values = Form.useWatch([], form);
@@ -284,7 +284,6 @@ const EmotionEngine: React.FC = () => {
          </Flex>
        </RbCard>
      </Col>
-      {contextHolder}
    </Row>
  );
 };
--- a/web/src/views/ForgettingEngine/index.tsx
+++ b/web/src/views/ForgettingEngine/index.tsx
@@ -1,8 +1,8 @@
 /*
 * @Author: ZhaoYing 
 * @Date: 2026-02-03 17:00:12 
- * @Last Modified by: ZhaoYing
- * @Last Modified time: 2026-03-16 15:41:54
+ * @Last Modified by:   ZhaoYing 
+ * @Last Modified time: 2026-03-25 18:29:00 
 */
 /**
 * Forgetting Engine Configuration Page
@@ -11,7 +11,7 @@
 */

 import React, { useState, useEffect } from 'react';
-import { Row, Col, Form, Button, Space, message, Flex, Tooltip } from 'antd';
+import { Row, Col, Form, Button, Space, App, Flex, Tooltip } from 'antd';
 import { useParams } from 'react-router-dom';
 import { useTranslation } from 'react-i18next';

@@ -107,7 +107,7 @@ const ForgettingEngine: React.FC = () => {
  const { id } = useParams();
  const [configData, setConfigData] = useState<ConfigForm>();
  const [form] = Form.useForm<ConfigForm>();
-  const [messageApi, contextHolder] = message.useMessage();
+  const { message: messageApi } = App.useApp();
  const [loading, setLoading] = useState(false)

  const values = Form.useWatch([], form);
@@ -238,7 +238,6 @@ const ForgettingEngine: React.FC = () => {
          />
        </RbCard>
      </Col>
-      {contextHolder}
    </Row>
  );
 };
--- a/web/src/views/KnowledgeBase/[knowledgeBaseId]/CreateDataset.tsx
+++ b/web/src/views/KnowledgeBase/[knowledgeBaseId]/CreateDataset.tsx
@@ -1,5 +1,5 @@
 import {  useMemo,useRef, useState, useEffect } from 'react';
-import { Button, Flex, Radio, Steps, Modal, Input, Spin, message, Checkbox, Select, Form, Progress} from 'antd';
+import { Button, Flex, Radio, Steps, Modal, Input, Checkbox, Select, Form, Progress, App } from 'antd';
 import { useTranslation } from 'react-i18next';
 import { useLocation, useNavigate, useParams } from 'react-router-dom';
 import './Private.css';
@@ -15,7 +15,7 @@ import exitIcon from '@/assets/images/knowledgeBase/exit.png';

 import SliderInput from '@/components/SliderInput';
 import DelimiterSelector from '../components/DelimiterSelector';
-const { confirm } = Modal
+
 const { TextArea } = Input;

  const style: React.CSSProperties = {
@@ -28,12 +28,13 @@ const { TextArea } = Input;
    columnGap: 14, // Wider gap between dot and text
    width: '100%',
    border: '1px solid #E5E5E5',
-    borderRadius: 8,
+    borderRadius: 12,
    padding: 16,
  };
  const getActiveRadioStyle = (active: boolean): React.CSSProperties => ({
    ...radioWrapperBaseStyle,
    border: active ? '1px solid #171719' : radioWrapperBaseStyle.border,
+    backgroundColor: active ? '#FAFAFA' : 'transparent',
  });


@@ -65,6 +66,7 @@ interface ContentFormData {
 const CreateDataset = () => {
  const { t } = useTranslation();
  const navigate = useNavigate();
+  const { modal, message: messageApi } = App.useApp()
  const { knowledgeBaseId: routeKnowledgeBaseId } = useParams<{ knowledgeBaseId: string }>();
  const location = useLocation();
  const locationState = (location.state ?? {}) as CreateDatasetLocationState;
@@ -93,7 +95,6 @@ const CreateDataset = () => {
  const [parameterSettings, setParameterSettings] = useState<ParameterSettings>('defaultSettings');
  const [pdfEnhancementEnabled, setPdfEnhancementEnabled] = useState<boolean>(true);
  const [pdfEnhancementMethod, setPdfEnhancementMethod] = useState<string>('deepdoc');
-  const [messageApi, contextHolder] = message.useMessage();
  const fileType = ['pdf', 'doc', 'docx', 'xls', 'xlsx', 'csv', 'md', 'htm', 'html', 'json', 'ppt', 'pptx', 'txt','png','jpg','mp3','mp4','mov','wav']
  const steps = useMemo(
    () => [
@@ -184,7 +185,7 @@ const CreateDataset = () => {
    }

    // 显示确认弹框
-    confirm({
+    modal.confirm({
      title: t('knowledgeBase.startUploadConfirmTitle') || 'Start processing documents',
      content: t('knowledgeBase.startUploadConfirmContent') || 'Document processing will proceed in the background. You can choose to return to the list page immediately or stay on this page to view processing progress.',
      okText: t('knowledgeBase.returnToList') || 'Return to list',
@@ -231,7 +232,7 @@ const CreateDataset = () => {
    }
  };
  const handleDelete = (record: AnyObject) => {
-        confirm({
+       modal.confirm({
            title: t('common.deleteWarning'),
            content: t('common.deleteWarningContent', { content: record.name }),
          onOk: async () => {
@@ -548,8 +549,6 @@ const CreateDataset = () => {
  }, [location.pathname]);

  return (<>
-      {contextHolder}
-    
    <div className='rb:p-3 rb:pt-2 rb:h-full rb:flex rb:flex-col'>
      {/* <Typography.Title level={4} className='rb:!m-0 rb:!mb-4'>
        {t('knowledgeBase.createA') + ' ' + t('knowledgeBase.dataset')}
@@ -558,10 +557,10 @@ const CreateDataset = () => {
          <img src={exitIcon} alt='exit' className='rb:w-4 rb:h-4' />
          <span className='rb:text-gray-500 rb:text-sm'>{t('common.exit')}</span>
      </div>
-      <div className='rb:px-24 rb:py-5  rb:bg-white rb:rounded-lg'>
+      <div className='rb:px-24 rb:py-5  rb:bg-white rb:rounded-xl'>
          <Steps current={current} items={steps} className="custom-steps" />
      </div>  
-      <div className='rb:bg-white rb:rounded-lg rb:flex-1 rb:mt-3'>
+      <div className='rb:bg-white rb:rounded-xl rb:flex-1 rb:mt-3'>

        {current === 0 && (
          <div className='rb:flex rb:w-full rb:p-6'>
@@ -672,7 +671,7 @@ const CreateDataset = () => {
        {current === 1 && (
          <div className='rb:flex rb:flex-col rb:mt-10 rb:px-40'>
              {rechunkFileIds.length > 0 && (
-                <div className='rb:bg-[#F0F3F8] rb:border rb:border-[#DFE4ED] rb:rounded rb:px-3 rb:py-2 rb:mb-4 rb:text-xs rb:text-gray-600 rb:flex rb:flex-wrap rb:gap-2'>
+                <div className='rb:bg-[#F0F3F8] rb:border rb:border-[#DFE4ED] rb:rounded-[8px] rb:px-3 rb:py-2 rb:mb-4 rb:text-xs rb:text-gray-600 rb:flex rb:items-center rb:flex-wrap rb:gap-2'>
                    <span className='rb:text-gray-700 rb:font-medium'>{t('knowledgeBase.rechunking')}:</span>
                    {rechunkFileIds.map((id) => (
                      <span key={id} className='rb:px-2 rb:py-0.5 rb:bg-white rb:border rb:border-[#DFE4ED] rb:rounded'>{id}</span>
@@ -684,8 +683,8 @@ const CreateDataset = () => {
              </div>
              <div className='rb:mt-4'>
                <div 
-                  className={`rb:flex rb:items-center rb:w-full rb:border rb:rounded-lg rb:p-4 rb:cursor-pointer ${
-                    pdfEnhancementEnabled ? 'rb:border-blue-500' : 'rb:border-gray-300'
+                  className={`rb:flex rb:items-center rb:justify-between rb:w-full rb:border rb:rounded-xl rb:p-4 rb:cursor-pointer ${
+                  pdfEnhancementEnabled ? 'rb:border-[#171719] rb:bg-[#FAFAFA]' : 'rb-border'
                  }`}
                  // onClick={() => setPdfEnhancementEnabled(!pdfEnhancementEnabled)}
                >
@@ -693,24 +692,25 @@ const CreateDataset = () => {
                    checked={pdfEnhancementEnabled}
                    onChange={(e) => setPdfEnhancementEnabled(e.target.checked)}
                    className='rb:mr-3'
-                  />
-                  <span className='rb:text-base rb:font-medium rb:text-gray-800 rb:pl-[22px]'>
-                    {t('knowledgeBase.pdfEnhancementAnalysis')}
-                  </span>
+                  >
+                    <span className='rb:text-base rb:font-medium rb:text-gray-800 rb:pl-[22px]'>
+                      {t('knowledgeBase.pdfEnhancementAnalysis')}
+                    </span>
+                  </Checkbox>
                  {pdfEnhancementEnabled && (
-                  <div className='rb:ml-10'>
-                    <Select
-                      value={pdfEnhancementMethod}
-                      onChange={(value) => setPdfEnhancementMethod(value)}
-                      className='rb:w-48'
-                      options={[
-                        { value: 'deepdoc', label: 'DeepDoc' },
-                        { value: 'mineru', label: 'MinerU' },
-                        { value: 'textln', label: 'TextLN' }
-                      ]}
-                    />
-                  </div>
-                )}
+                    <div className='rb:ml-10'>
+                      <Select
+                        value={pdfEnhancementMethod}
+                        onChange={(value) => setPdfEnhancementMethod(value)}
+                        className='rb:w-[300px]'
+                        options={[
+                          { value: 'deepdoc', label: 'DeepDoc' },
+                          { value: 'mineru', label: 'MinerU' },
+                          { value: 'textln', label: 'TextLN' }
+                        ]}
+                      />
+                    </div>
+                  )}
                </div>
                
              </div>
@@ -766,12 +766,14 @@ const CreateDataset = () => {
                  </Radio>
              </Radio.Group>
              {parameterSettings === 'customSettings' && ( 
-                <div className='rb:flex rb:flex-col rb:mt-5'> 
-                    <div className='rb:w-full rb:text-sm rb:font-medium rb:text-gray-800 rb:mb-3'>
-                        {t('knowledgeBase.delimiter')}
-                    </div>
-                    <DelimiterSelector value={delimiter} onChange={setDelimiter} className='rb:mb-5'/>
-                    <SliderInput label={t('knowledgeBase.suggestedBlockSize')} max={1024} min={1} step={1} value={blockSize} onChange={handleChange} />
+                <div className='rb:grid rb:grid-cols-2 rb:mt-5 rb-border rb:rounded-xl rb:px-6 rb:py-4 rb:gap-10'> 
+                <div>
+                  <div className='rb:w-full rb:text-[#5B6167] rb:leading-5 rb:mb-2'>
+                    {t('knowledgeBase.delimiter')}
+                  </div>
+                  <DelimiterSelector value={delimiter} onChange={setDelimiter} />
+                  </div>
+                  <SliderInput label={t('knowledgeBase.suggestedBlockSize')} max={1024} min={1} step={1} value={blockSize} onChange={handleChange} />
                </div>
                
              )}
--- a/web/src/views/KnowledgeBase/[knowledgeBaseId]/Private.tsx
+++ b/web/src/views/KnowledgeBase/[knowledgeBaseId]/Private.tsx
@@ -2,7 +2,7 @@
 import { useEffect, useState, useRef, useCallback, type FC } from 'react';
 import { useNavigate, useParams, useLocation } from 'react-router-dom';
 import { useTranslation } from 'react-i18next';
-import { Switch, Button, Dropdown, Space, Modal, message, Radio, Tooltip } from 'antd';
+import { Switch, Button, Dropdown, Space, Radio, Tooltip, App } from 'antd';
 import type { MenuProps } from 'antd';
 import SearchInput from '@/components/SearchInput'
 import Table, { type TableRef } from '@/components/Table'
@@ -39,12 +39,11 @@ import { formatDateTime } from '@/utils/format';
 import KnowledgeGraphCard from '../components/KnowledgeGraphCard';
 import { useBreadcrumbManager, type BreadcrumbItem } from '@/hooks/useBreadcrumbManager';
 import './Private.css'
-const { confirm } = Modal
 // Tree node data type

 const Private: FC = () => {
  const { t } = useTranslation();
-  const [messageApi, contextHolder] = message.useMessage();
+  const { modal, message: messageApi } = App.useApp()
  const navigate = useNavigate();
  const location = useLocation();
  const { knowledgeBaseId } = useParams<{ knowledgeBaseId: string }>();
@@ -501,7 +500,7 @@ const Private: FC = () => {
    downloadFile(targetFileId, fileName);
  }
  const handleDelete = (item: any) => {
-      confirm({
+      modal.confirm({
        title: t('common.deleteWarning'),
        content: t('common.deleteWarningContent', { content: item.file_name }),
        onOk: () => {
@@ -765,7 +764,6 @@ const Private: FC = () => {

  return (
    <>
-    {contextHolder}
    <div className="rb:flex rb:h-full rb:bg-white rb:rounded-xl">
      {folder && (
        <div className="rb:w-64 rb:py-4 rb:flex-shrink-0 rb:h-[calc(100%+40px)] rb:border-r rb:border-[#EAECEE] rb:p-4 rb:bg-transparent">
--- a/web/src/views/KnowledgeBase/components/CreateImageDataset.tsx
+++ b/web/src/views/KnowledgeBase/components/CreateImageDataset.tsx
@@ -1,7 +1,7 @@
 import { forwardRef, useImperativeHandle, useState, useRef } from 'react';
 import { useNavigate } from 'react-router-dom';

-import { Form, message } from 'antd';
+import { Form, App } from 'antd';
 import { useTranslation } from 'react-i18next';
 import type { UploadFile } from 'antd';
 import type { CreateSetModalRef, CreateSetMoealRefProps } from '@/views/KnowledgeBase/types';
@@ -19,8 +19,8 @@ const CreateImageDataset = forwardRef<CreateSetModalRef, CreateSetMoealRefProps>
  ({ refreshTable }, ref) => {
    const { t } = useTranslation();
    const navigate = useNavigate();
+    const { message: messageApi } = App.useApp();
    const [visible, setVisible] = useState(false);
-    const [messageApi, contextHolder] = message.useMessage();

    const [form] = Form.useForm<ImageDatasetFormData>();
    const [loading, setLoading] = useState(false);
@@ -227,7 +227,6 @@ const CreateImageDataset = forwardRef<CreateSetModalRef, CreateSetMoealRefProps>
    };
    return (
      <>
-      {contextHolder}
      <RbModal
        title={`${t('knowledgeBase.createA')} ${t('knowledgeBase.mediaDataSet')}`}
        open={visible}
--- a/web/src/views/KnowledgeBase/components/CreateModal.tsx
+++ b/web/src/views/KnowledgeBase/components/CreateModal.tsx
@@ -1,5 +1,5 @@
 import { forwardRef, useEffect, useImperativeHandle, useMemo, useState } from 'react';
-import { Form, Input, Select, Modal, Tabs, Switch, Radio, Button, message } from 'antd';
+import { Form, Input, Select, Modal, Tabs, Switch, Radio, Button, App } from 'antd';
 import { useTranslation } from 'react-i18next';
 import type { KnowledgeBaseListItem, KnowledgeBaseFormData, CreateModalRef, CreateModalRefProps } from '@/views/KnowledgeBase/types';
 import { 
@@ -26,7 +26,7 @@ const CreateModal = forwardRef<CreateModalRef, CreateModalRefProps>(({
  refreshTable
 }, ref) => {
  const { t } = useTranslation();
-  const [messageApi, contextHolder] = message.useMessage();
+  const { modal, message: messageApi } = App.useApp()
  const [visible, setVisible] = useState(false);
  const [modelTypeList, setModelTypeList] = useState<string[]>([]);
  const [modelOptionsByType, setModelOptionsByType] = useState<Record<string, { label: string; value: string }[]>>({});
@@ -335,7 +335,7 @@ const CreateModal = forwardRef<CreateModalRef, CreateModalRefProps>(({
    
    // If original type is 'rebuild' and knowledge graph is enabled, show confirmation dialog
    if (originalType === 'rebuild' && isGraphragEnabled) {
-      confirm({
+      modal.confirm({
        title: t('knowledgeBase.rebuildConfirmTitle'),
        content: t('knowledgeBase.rebuildConfirmContent'),
        onOk: async() => {
@@ -478,7 +478,7 @@ const CreateModal = forwardRef<CreateModalRef, CreateModalRefProps>(({
      // Get previous value from original datasets object
      const previousValue = (datasets as any)[fieldKey];
      
-      confirm({
+      modal.confirm({
        title: t('common.updateWarning'),
        content: t('knowledgeBase.updateEmbeddingContent'),
        onOk: () => {
@@ -880,7 +880,6 @@ const CreateModal = forwardRef<CreateModalRef, CreateModalRefProps>(({
          items={tabItems}
        />
      </Form>
-      {contextHolder}
    </RbModal>
  );
 });
--- a/web/src/views/KnowledgeBase/components/ShareModal.tsx
+++ b/web/src/views/KnowledgeBase/components/ShareModal.tsx
@@ -3,13 +3,12 @@
 * @Version: 0.0.1
 * @Author: yujiangping
 * @Date: 2025-11-10 18:52:55
- * @LastEditors: yujiangping
- * @LastEditTime: 2026-03-09 16:39:07
+ * @LastEditors: ZhaoYing
+ * @LastEditTime: 2026-03-25 18:30:28
 */
 import { forwardRef, useImperativeHandle, useState, useRef } from 'react';
-import { Switch } from 'antd';
+import { Switch, App } from 'antd';
 import { useTranslation } from 'react-i18next';
-import { message } from 'antd';
 import type { ShareModalRef, ShareModalRefProps, KnowledgeBase, SpaceItem} from '@/views/KnowledgeBase/types';
 import RbModal from '@/components/RbModal'
 // import betchControlIcon from '@/assets/images/knowledgeBase/betch-control.png';
@@ -23,7 +22,7 @@ import ShareSpaceModal from './ShareSpaceModal'
 const ShareModal = forwardRef<ShareModalRef,ShareModalRefProps>(({ handleShare: onShare }, ref) => {
  const { t } = useTranslation();
  const shareSpaceModalRef = useRef<ShareSpaceModalRef>(null);
-  const [messageApi, contextHolder] = message.useMessage();
+  const { message: messageApi } = App.useApp()
  const [visible, setVisible] = useState(false);
  const [loading, setLoading] = useState(false)
  const [curIndex, setCurIndex] = useState(9999);
@@ -101,7 +100,6 @@ const ShareModal = forwardRef<ShareModalRef,ShareModalRefProps>(({ handleShare:

  return (
    <>
-    {contextHolder}
    <RbModal
      title={t('knowledgeBase.shareSpace')}
      open={visible}
--- a/web/src/views/KnowledgeBase/components/ShareSpaceModal.tsx
+++ b/web/src/views/KnowledgeBase/components/ShareSpaceModal.tsx
@@ -3,13 +3,12 @@
 * @Version: 0.0.1
 * @Author: yujiangping
 * @Date: 2025-11-10 18:52:55
- * @LastEditors: yujiangping
- * @LastEditTime: 2026-03-09 16:34:51
+ * @LastEditors: ZhaoYing
+ * @LastEditTime: 2026-03-25 18:30:28
 */
 import { forwardRef, useImperativeHandle, useState } from 'react';
-import { Switch } from 'antd';
 import { useTranslation } from 'react-i18next';
-import { message } from 'antd';
+import { App } from 'antd';
 import type { ShareModalRef, ShareModalRefProps, KnowledgeBase} from '@/views/KnowledgeBase/types';
 import RbModal from '@/components/RbModal'
 // import betchControlIcon from '@/assets/images/knowledgeBase/betch-control.png';
@@ -21,7 +20,7 @@ import type { SpaceItem } from '@/views/KnowledgeBase/types';
 import { formatDateTime } from '@/utils/format';
 const ShareModal = forwardRef<ShareModalRef,ShareModalRefProps>(({ handleShare: onShare }, ref) => {
  const { t } = useTranslation();
-  const [messageApi, contextHolder] = message.useMessage();
+  const { message: messageApi } = App.useApp()
  const [visible, setVisible] = useState(false);
  const [loading, setLoading] = useState(false)
  const [curIndex, setCurIndex] = useState(-1);
@@ -97,7 +96,6 @@ const ShareModal = forwardRef<ShareModalRef,ShareModalRefProps>(({ handleShare:

  return (
    <>
-    {contextHolder}
    <RbModal
      title={t('knowledgeBase.toWorkspace')}
      open={visible}
--- a/web/src/views/KnowledgeBase/index.tsx
+++ b/web/src/views/KnowledgeBase/index.tsx
@@ -1,5 +1,5 @@
 import { useEffect, useState, useRef, useMemo, useCallback, type FC } from 'react';
-import { Row, Col, Button, Dropdown, Modal, message, Tooltip } from 'antd'
+import { Row, Col, Button, Dropdown, Tooltip, App } from 'antd'
 import type { MenuProps } from 'antd';
 import { EllipsisOutlined, RightOutlined, DownOutlined } from '@ant-design/icons';
 import { useNavigate, useLocation } from 'react-router-dom';
@@ -16,7 +16,7 @@ import RbCard from '@/components/RbCard/Card'
 import SearchInput from '@/components/SearchInput'
 import Empty from '@/components/Empty'
 import { getKnowledgeBaseList, getModelList, getModelTypeList, deleteKnowledgeBase, getKnowledgeBaseTypeList } from '@/api/knowledgeBase'
-const { confirm } = Modal;
+
 import InfiniteScroll from 'react-infinite-scroll-component';

 import { useBreadcrumbManager, type BreadcrumbItem } from '@/hooks/useBreadcrumbManager';
@@ -29,6 +29,7 @@ type ModelMenuInfo = {
 const KnowledgeBaseManagement: FC = () => {
  const { t } = useTranslation();
  const navigate = useNavigate();
+  const { modal, message: messageApi } = App.useApp()
  const location = useLocation();
  const [loading, setLoading] = useState(false);
  const [data, setData] = useState<KnowledgeBaseListItem[]>([])
@@ -43,7 +44,6 @@ const KnowledgeBaseManagement: FC = () => {
  const [knowledgeBaseTypes, setKnowledgeBaseTypes] = useState<string[]>([]);
  const modelListCache = useRef<Record<string, string>>({});
  const modalRef = useRef<CreateModalRef>(null)
-  const [messageApi, contextHolder] = message.useMessage();
  const processedStateRef = useRef<any>(null);
  
  // 使用面包屑管理 Hook
@@ -386,7 +386,7 @@ const KnowledgeBaseManagement: FC = () => {

  // 处理删除
  const handleDelete = (item: KnowledgeBaseListItem) => {
-    confirm({
+    modal.confirm({
      title: t('common.deleteWarning'),
      content: t('common.deleteWarningContent', { content: item.name }),
      onOk: () => {
@@ -528,7 +528,6 @@ const KnowledgeBaseManagement: FC = () => {

  return (
    <>
-      {contextHolder}
      <div className="rb:flex rb:justify-between rb:px-2 rb:mb-4">
        <SearchInput
          placeholder={t('knowledgeBase.searchPlaceholder')}
--- a/web/src/views/MemberManagement/components/MemberModal.tsx
+++ b/web/src/views/MemberManagement/components/MemberModal.tsx
@@ -2,7 +2,7 @@
 * @Author: ZhaoYing 
 * @Date: 2026-02-03 16:42:17 
 * @Last Modified by:   ZhaoYing 
- * @Last Modified time: 2026-02-03 16:42:17 
+ * @Last Modified time: 2026-03-25 18:30:48 
 */
 /**
 * Member Modal
@@ -39,7 +39,7 @@ const MemberModal = forwardRef<MemberModalRef, MemberModalProps>(({
  refreshTable
 }, ref) => {
  const { t } = useTranslation();
-  const { message } = App.useApp()
+  const { message, modal } = App.useApp()
  const initialForm = {
    // role: 'member',
  }
@@ -47,7 +47,6 @@ const MemberModal = forwardRef<MemberModalRef, MemberModalProps>(({
  const [editingUser, setEditingUser] = useState<Member | null>(null);
  const [form] = Form.useForm<MemberModalData>();
  const [loading, setLoading] = useState(false)
-  const [modal, contextHolder] = Modal.useModal();

  const roleOptions = [
    'member',
@@ -179,7 +178,6 @@ const MemberModal = forwardRef<MemberModalRef, MemberModalProps>(({
          </Select>
        </FormItem>
      </Form>
-      {contextHolder}
    </RbModal>
  );
 });