chore: use @ant-design/pro-components

config/defaultSettings.ts

@@ -1,4 +1,4 @@
-import { Settings as LayoutSettings } from '@ant-design/pro-layout';
+import { Settings as LayoutSettings } from '@ant-design/pro-components';
 
 const Settings: LayoutSettings & {
   pwa?: boolean;

package.json

@@ -55,11 +55,7 @@
   ],
   "dependencies": {
     "@ant-design/icons": "^4.7.0",
-    "@ant-design/pro-card": "^1.19.0",
+    "@ant-design/pro-components": "1.1.0",
-    "@ant-design/pro-descriptions": "^1.10.0",
-    "@ant-design/pro-form": "^1.64.0",
-    "@ant-design/pro-layout": "^6.35.0",
-    "@ant-design/pro-table": "^2.71.0",
     "@umijs/route-utils": "^2.0.0",
     "antd": "^4.20.0",
     "classnames": "^2.3.0",

src/app.tsx

@@ -1,6 +1,5 @@
-import type { Settings as LayoutSettings } from '@ant-design/pro-layout';
+import type { Settings as LayoutSettings } from '@ant-design/pro-components';
-import { SettingDrawer } from '@ant-design/pro-layout';
+import { SettingDrawer, PageLoading } from '@ant-design/pro-components';
-import { PageLoading } from '@ant-design/pro-layout';
 import type { RunTimeLayoutConfig } from 'umi';
 import { history, Link } from 'umi';
 import RightContent from '@/components/RightContent';

src/components/Footer/index.tsx

@@ -1,6 +1,6 @@
 import { useIntl } from 'umi';
 import { GithubOutlined } from '@ant-design/icons';
-import { DefaultFooter } from '@ant-design/pro-layout';
+import { DefaultFooter } from '@ant-design/pro-components';
 
 const Footer: React.FC = () => {
   const intl = useIntl();

src/locales/bn-BD/pages.ts

@@ -23,9 +23,7 @@ export default {
   'pages.login.submit': 'প্রবেশ করুন',
   'pages.login.loginWith': 'লগইন করতে পারেন:',
   'pages.login.registerAccount': 'অ্যাকাউন্ট নিবন্ধন করুন',
-  'pages.welcome.advancedComponent': 'অ্যাডভান্সড কম্পোনেন্ট',
   'pages.welcome.link': 'স্বাগতম',
-  'pages.welcome.advancedLayout': 'অ্যাডভান্সড লেআউট',
   'pages.welcome.alertMessage': 'দ্রুত এবং শক্তিশালী ভারী শুল্ক উপাদান প্রকাশ করা হয়েছে।',
   'pages.admin.subPage.title': 'এই পৃষ্ঠাটি কেবল অ্যাডমিন দ্বারা দেখা যাবে',
   'pages.admin.subPage.alertMessage':

src/locales/en-US/pages.ts

@@ -23,9 +23,7 @@ export default {
   'pages.login.submit': 'Login',
   'pages.login.loginWith': 'Login with :',
   'pages.login.registerAccount': 'Register Account',
-  'pages.welcome.advancedComponent': 'Advanced Component',
   'pages.welcome.link': 'Welcome',
-  'pages.welcome.advancedLayout': 'Advanced Layout',
   'pages.welcome.alertMessage': 'Faster and stronger heavy-duty components have been released.',
   'pages.admin.subPage.title': 'This page can only be viewed by Admin',
   'pages.admin.subPage.alertMessage':

src/locales/fa-IR/pages.ts

@@ -20,9 +20,7 @@ export default {
   'pages.login.submit': 'ارسال',
   'pages.login.loginWith': 'وارد شوید با :',
   'pages.login.registerAccount': 'ثبت نام',
-  'pages.welcome.advancedComponent': 'مولفه پیشرفته',
   'pages.welcome.link': 'خوش آمدید',
-  'pages.welcome.advancedLayout': 'چیدمان پیشرفته',
   'pages.welcome.alertMessage': 'اجزای سنگین تر سریعتر و قوی تر آزاد شده اند.',
   'pages.admin.subPage.title': 'این صفحه فقط توسط مدیر قابل مشاهده است',
   'pages.admin.subPage.alertMessage':

src/locales/id-ID/pages.ts

@@ -21,9 +21,7 @@ export default {
   'pages.login.submit': 'Masuk',
   'pages.login.loginWith': 'Masuk dengan :',
   'pages.login.registerAccount': 'Daftar Akun',
-  'pages.welcome.advancedComponent': 'Formulir Lanjutan',
   'pages.welcome.link': 'Selamat datang',
-  'pages.welcome.advancedLayout': 'Tata letak Lanjutan',
   'pages.welcome.alertMessage':
     'Komponen heavy-duty yang lebih cepat dan lebih kuat telah dirilis.',
   'pages.admin.subPage.title': 'Halaman ini hanya dapat dilihat oleh admin',

src/locales/ja-JP/pages.ts

@@ -21,9 +21,7 @@ export default {
   'pages.login.submit': 'ログイン',
   'pages.login.loginWith': 'その他のログイン方法：',
   'pages.login.registerAccount': 'アカウント登録',
-  'pages.welcome.advancedComponent': '高度なコンポーネント',
   'pages.welcome.link': 'ようこそ',
-  'pages.welcome.advancedLayout': '高度なレイアウト',
   'pages.welcome.alertMessage': 'より高速で強力な頑丈なコンポーネントがリリースされました。',
   'pages.admin.subPage.title': 'このページは管理者のみが表示できます',
   'pages.admin.subPage.alertMessage':

src/locales/pt-BR/pages.ts

@@ -21,9 +21,7 @@ export default {
   'pages.login.submit': 'Enviar',
   'pages.login.loginWith': 'Login com :',
   'pages.login.registerAccount': 'Registra Conta',
-  'pages.welcome.advancedComponent': 'Componente Avançado',
   'pages.welcome.link': 'Bem-vindo',
-  'pages.welcome.advancedLayout': 'Layout Avançado',
   'pages.welcome.alertMessage': 'Componentes pesados mais rápidos e mais fortes foram lançados.',
   'pages.admin.subPage.title': 'Esta página só pode ser vista pelo Admin',
   'pages.admin.subPage.alertMessage':

src/locales/zh-CN/pages.ts

@@ -22,9 +22,7 @@ export default {
   'pages.login.submit': '登录',
   'pages.login.loginWith': '其他登录方式 :',
   'pages.login.registerAccount': '注册账户',
-  'pages.welcome.advancedComponent': '高级表格',
   'pages.welcome.link': '欢迎使用',
-  'pages.welcome.advancedLayout': '高级布局',
   'pages.welcome.alertMessage': '更快更强的重型组件，已经发布。',
   'pages.admin.subPage.title': ' 这个页面只有 admin 权限才能查看',
   'pages.admin.subPage.alertMessage': 'umi ui 现已发布，欢迎使用 npm run ui 启动体验。',

src/pages/Admin.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import { HeartTwoTone, SmileTwoTone } from '@ant-design/icons';
 import { Card, Typography, Alert } from 'antd';
-import { PageHeaderWrapper } from '@ant-design/pro-layout';
+import { PageHeaderWrapper } from '@ant-design/pro-components';
 import { useIntl } from 'umi';
 
 const Admin: React.FC = () => {

src/pages/TableList/components/UpdateForm.tsx

@@ -7,7 +7,7 @@ import {
   StepsForm,
   ProFormRadio,
   ProFormDateTimePicker,
-} from '@ant-design/pro-form';
+} from '@ant-design/pro-components';
 import { useIntl, FormattedMessage } from 'umi';
 
 export type FormValueType = {

src/pages/TableList/index.tsx

@@ -2,12 +2,16 @@ import { PlusOutlined } from '@ant-design/icons';
 import { Button, message, Input, Drawer } from 'antd';
 import React, { useState, useRef } from 'react';
 import { useIntl, FormattedMessage } from 'umi';
-import { PageContainer, FooterToolbar } from '@ant-design/pro-layout';
+import {
-import type { ProColumns, ActionType } from '@ant-design/pro-table';
+  PageContainer,
-import ProTable from '@ant-design/pro-table';
+  FooterToolbar,
-import { ModalForm, ProFormText, ProFormTextArea } from '@ant-design/pro-form';
+  ProDescriptions,
-import type { ProDescriptionsItemProps } from '@ant-design/pro-descriptions';
+  ProTable,
-import ProDescriptions from '@ant-design/pro-descriptions';
+  ModalForm,
+  ProFormText,
+  ProFormTextArea,
+} from '@ant-design/pro-components';
+import type { ProColumns, ActionType, ProDescriptionsItemProps } from '@ant-design/pro-components';
 import type { FormValueType } from './components/UpdateForm';
 import UpdateForm from './components/UpdateForm';
 import { rule, addRule, updateRule, removeRule } from '@/services/ant-design-pro/api';

src/pages/Welcome.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { PageContainer } from '@ant-design/pro-layout';
+import { PageContainer } from '@ant-design/pro-components';
 import { Card, Alert, Typography } from 'antd';
 import { useIntl, FormattedMessage } from 'umi';
 import styles from './Welcome.less';
@@ -32,7 +32,6 @@ const Welcome: React.FC = () => {
           }}
         />
         <Typography.Text strong>
-          <FormattedMessage id="pages.welcome.advancedComponent" defaultMessage="Advanced Form" />{' '}
           <a
             href="https://procomponents.ant.design/components/table"
             rel="noopener noreferrer"
@@ -41,23 +40,7 @@ const Welcome: React.FC = () => {
             <FormattedMessage id="pages.welcome.link" defaultMessage="Welcome" />
           </a>
         </Typography.Text>
-        <CodePreview>yarn add @ant-design/pro-table</CodePreview>
+        <CodePreview>yarn add @ant-design/pro-components</CodePreview>
-        <Typography.Text
-          strong
-          style={{
-            marginBottom: 12,
-          }}
-        >
-          <FormattedMessage id="pages.welcome.advancedLayout" defaultMessage="Advanced layout" />{' '}
-          <a
-            href="https://procomponents.ant.design/components/layout"
-            rel="noopener noreferrer"
-            target="__blank"
-          >
-            <FormattedMessage id="pages.welcome.link" defaultMessage="Welcome" />
-          </a>
-        </Typography.Text>
-        <CodePreview>yarn add @ant-design/pro-layout</CodePreview>
       </Card>
     </PageContainer>
   );

src/pages/user/Login/index.tsx

@@ -8,7 +8,12 @@ import {
 } from '@ant-design/icons';
 import { Alert, message, Tabs } from 'antd';
 import React, { useState } from 'react';
-import { ProFormCaptcha, ProFormCheckbox, ProFormText, LoginForm } from '@ant-design/pro-form';
+import {
+  ProFormCaptcha,
+  ProFormCheckbox,
+  ProFormText,
+  LoginForm,
+} from '@ant-design/pro-components';
 import { useIntl, history, FormattedMessage, SelectLang, useModel } from 'umi';
 import Footer from '@/components/Footer';
 import { login } from '@/services/ant-design-pro/api';