feat: use dtinsight/react-icons replace ant-design/icons

Author: LuckyFBB

.dumi/pages/index/index.tsx

@@ -1,9 +1,9 @@
 import React from 'react';
-import { GithubOutlined } from '@ant-design/icons';
 import { Button } from 'antd';
 import { Helmet, Link } from 'dumi';
 
 import './index.scss';
+import GithubOutlined from '../../theme/common/GithubOutlined';
 
 export default function Homepage() {
     return (

.dumi/theme/common/GithubOutlined.tsx

@@ -0,0 +1,18 @@
+import React from 'react';
+
+const GithubOutlined = () => {
+    return (
+        <span className="anticon">
+            <svg
+                xmlns="http://www.w3.org/2000/svg"
+                width="1em"
+                height="1em"
+                viewBox="0 0 1024 1024"
+            >
+                <path d="M511.6 76.3C264.3 76.2 64 276.4 64 523.5 64 718.9 189.3 885 363.8 946c23.5 5.9 19.9-10.8 19.9-22.2v-77.5c-135.7 15.9-141.2-73.9-150.3-88.9C215 726 171.5 718 184.5 703c30.9-15.9 62.4 4 98.9 57.9 26.4 39.1 77.9 32.5 104 26 5.7-23.5 17.9-44.5 34.7-60.8-140.6-25.2-199.2-111-199.2-213 0-49.5 16.3-95 48.3-131.7-20.4-60.5 1.9-112.3 4.9-120 58.1-5.2 118.5 41.6 123.2 45.3 33-8.9 70.7-13.6 112.9-13.6 42.4 0 80.2 4.9 113.5 13.9 11.3-8.6 67.3-48.8 121.3-43.9 2.9 7.7 24.7 58.3 5.5 118 32.4 36.8 48.9 82.7 48.9 132.3 0 102.2-59 188.1-200 212.9a127.5 127.5 0 0 1 38.1 91v112.5c.8 9 0 17.9 15 17.9 177.1-59.7 304.6-227 304.6-424.1 0-247.2-200.4-447.3-447.5-447.3z" />
+            </svg>
+        </span>
+    );
+};
+
+export default GithubOutlined;

.dumi/theme/slots/Header/index.tsx

@@ -1,5 +1,5 @@
 import React, { useState } from 'react';
-import { CloseOutlined, GithubOutlined, MenuOutlined } from '@ant-design/icons';
+import { MenuCloseOutlined, HamburgerOutlined } from '@dtinsight/react-icons';
 import { Button, Tooltip } from 'antd';
 import { useRouteMeta } from 'dumi';
 import LangSwitch from 'dumi/theme-default/slots/LangSwitch';
@@ -11,6 +11,7 @@ import SearchBar from 'dumi/theme-default/slots/SearchBar';
 import { useMobile } from '../../hooks';
 import 'dumi/theme-default/slots/Header/index.less';
 import './index.scss';
+import GithubOutlined from '../../common/GithubOutlined';
 
 export default function Header() {
     const { frontmatter } = useRouteMeta();
@@ -64,7 +65,7 @@ export default function Header() {
                         setShowMenu((v) => !v);
                     }}
                 >
-                    {showMenu ? <CloseOutlined /> : <MenuOutlined />}
+                    {showMenu ? <MenuCloseOutlined /> : <HamburgerOutlined />}
                 </button>
             </div>
         </div>

jest.config.js

@@ -13,5 +13,6 @@ module.exports = {
         '@babel/polyfill/lib/noConflict': '<rootDir>/tests/styleMock.js',
         '^lodash-es$': 'lodash',
         'react-markdown': '<rootDir>/node_modules/react-markdown/react-markdown.min.js',
+        '@dtinsight/react-icons': '<rootDir>/tests/iconMock.js',
     },
 };

package.json

@@ -111,7 +111,6 @@
         "typescript": "~4.5.2"
     },
     "dependencies": {
-        "@ant-design/icons": "^4.7.0",
         "@dtinsight/dt-utils": "^1.3.1",
         "@dtinsight/react-icons": "^1.0.0",
         "@handsontable/react": "2.1.0",

pnpm-lock.yaml

@@ -115,7 +115,7 @@ describe('test BlockHeader render', () => {
         const { container } = render(<BlockHeader {...props3} />);
         const wrap = container.firstChild!;
         const tooltipWrap = wrap.firstChild!.firstChild!.lastChild;
-        expect(tooltipWrap!.firstChild).toHaveClass('anticon-question-circle');
+        expect(tooltipWrap!.firstChild).toHaveAttribute('data-mock-icon', 'QuestionOutlined');
     });
 
     test('should render BlockHeader description success', () => {

src/blockHeader/__tests__/blockHeader.test.tsx

@@ -1,10 +1,10 @@
 import React, { useEffect } from 'react';
-import { DeleteOutlined, EditOutlined, PlusSquareOutlined } from '@ant-design/icons';
+import { DeleteOutlined, EditOutlined, PlusSquareOutlined } from '@dtinsight/react-icons';
 import { Menu } from 'antd';
 import { Catalogue, EllipsisText } from 'dt-react-component';
 import { CatalogueProps } from 'dt-react-component/catalogue/components/catalogue';
 import { ITreeNode, useTreeData } from 'dt-react-component/catalogue/useTreeData';
-import { cloneDeep } from 'lodash';
+import { cloneDeep } from 'lodash-es';
 import shortid from 'shortid';
 
 import {

src/catalogue/demos/config.tsx

@@ -1,10 +1,10 @@
 import React, { useEffect } from 'react';
-import { DeleteOutlined, EditOutlined, PlusSquareOutlined } from '@ant-design/icons';
+import { DeleteOutlined, EditOutlined, PlusSquareOutlined } from '@dtinsight/react-icons';
 import { Menu } from 'antd';
 import { Catalogue } from 'dt-react-component';
 import { CatalogueProps } from 'dt-react-component/catalogue/components/catalogue';
 import { ITreeNode, useTreeData } from 'dt-react-component/catalogue/useTreeData';
-import { cloneDeep } from 'lodash';
+import { cloneDeep } from 'lodash-es';
 import shortid from 'shortid';
 
 import {

src/catalogue/demos/drag.tsx

@@ -1,9 +1,9 @@
 import React, { useEffect } from 'react';
-import { DeleteOutlined, EditOutlined, PlusSquareOutlined } from '@ant-design/icons';
+import { DeleteOutlined, EditOutlined, PlusSquareOutlined } from '@dtinsight/react-icons';
 import { Menu } from 'antd';
 import { Catalogue } from 'dt-react-component';
 import { ITreeNode, useTreeData } from 'dt-react-component/catalogue/useTreeData';
-import { cloneDeep } from 'lodash';
+import { cloneDeep } from 'lodash-es';
 import shortid from 'shortid';
 
 import {