[WIP] feat: antd5

.eslintignore

@@ -5,4 +5,7 @@ _scripts
 _test_
 .eslintrc.js
 
-node_modules
+node_modules
+.husky/**
+pnpm-lock.yaml
+.npmrc

.eslintrc.js

@@ -1,18 +1,7 @@
 module.exports = {
-  extends: [require.resolve('@umijs/fabric/dist/eslint')],
-  rules: {
-    '@typescript-eslint/camelcase': 0,
-    '@typescript-eslint/class-name-casing': 0,
-    'import/no-extraneous-dependencies': 0,
-    '@typescript-eslint/no-explicit-any': 0,
-    'import/no-unresolved': 0,
-    '@typescript-eslint/naming-convention': 0,
-  },
+  extends: [require.resolve('@umijs/max/eslint')],
   globals: {
     ANT_DESIGN_PRO_ONLY_DO_NOT_USE_IN_YOUR_PRODUCTION: true,
     page: true,
   },
-  parserOptions: {
-    project: './tsconfig.json',
-  },
 };

.github/workflows/test.yml

@@ -10,10 +10,10 @@ jobs:
         uses: actions/checkout@master
 
       - name: install
-        run: yarn
+        run: pnpm i
 
       - name: lint
-        run: yarn run lint
+        run: pnpm run lint
 
   test-js:
     runs-on: ubuntu-latest

.husky/pre-commit

@@ -0,0 +1,4 @@
+#!/usr/bin/env sh
+. "$(dirname -- "$0")/_/husky.sh"
+
+npx --no-install lint-staged

.npmrc

@@ -0,0 +1,6 @@
+registry=https://registry.npmjs.org/
+
+# Prevent jsx namespace conflicts, because Vue global types will auto install.
+# In the future, Vue 3 will fix this issue
+# See https://github.com/vuejs/core/blob/main/CHANGELOG.md#features-1
+auto-install-peers=false

.prettierignore

@@ -21,3 +21,6 @@ yarn-error.log
 CNAME
 /build
 umi-block.json
+.husky/**
+pnpm-lock.yaml
+.npmrc

.prettierrc.js

@@ -1,5 +1,15 @@
-const fabric = require('@umijs/fabric');
-
 module.exports = {
-  ...fabric.prettier,
+  singleQuote: true,
+  trailingComma: 'all',
+  printWidth: 100,
+  proseWrap: 'never',
+  endOfLine: 'lf',
+  overrides: [
+    {
+      files: '.prettierrc',
+      options: {
+        parser: 'json',
+      },
+    },
+  ],
 };

.umirc.ts

@@ -0,0 +1,14 @@
+import { defineConfig } from '@umijs/max';
+
+export default defineConfig({
+  antd: {},
+  request: {},
+  targets: {
+    ie: 11,
+  },
+  dva: {},
+  mfsu: false,
+  layout: {
+    title: 'pro-blocks',
+  },
+});

AccountCenter/package.json

@@ -15,11 +15,10 @@
     "@ant-design/icons": "^4.0.0",
     "classnames": "^2.2.6",
     "moment": "^2.24.0",
-    "numeral": "^2.0.6",
-    "react-router": "^4.3.1"
+    "numeral": "^2.0.6"
   },
   "peerDependencies": {
-    "@ant-design/pro-layout": "^6.0.0"
+    "@ant-design/pro-components":"^2.6.43"
   },
   "blockConfig": {
     "specVersion": "0.1"

AccountCenter/src/Center.style.ts

@@ -0,0 +1,69 @@
+import { createStyles } from 'antd-style';
+
+const useStyles = createStyles(({ token }) => {
+  return {
+    avatarHolder: {
+      marginBottom: '24px',
+      textAlign: 'center',
+      '& > img': { width: '104px', height: '104px', marginBottom: '20px' },
+    },
+    name: {
+      marginBottom: '4px',
+      color: token.colorTextHeading,
+      fontWeight: '500',
+      fontSize: '20px',
+      lineHeight: '28px',
+    },
+    detail: {
+      p: {
+        position: 'relative',
+        marginBottom: '8px',
+        paddingLeft: '26px',
+        '&:last-child': {
+          marginBottom: '0',
+        },
+      },
+      i: {
+        position: 'absolute',
+        top: '4px',
+        left: '0',
+        width: '14px',
+        height: '14px',
+      },
+    },
+    tagsTitle: {
+      marginBottom: '12px',
+      color: token.colorTextHeading,
+      fontWeight: '500',
+    },
+    teamTitle: {
+      marginBottom: '12px',
+      color: token.colorTextHeading,
+      fontWeight: '500',
+    },
+    tags: {
+      '.ant-tag': { marginBottom: '8px' },
+    },
+    team: {
+      '.ant-avatar': { marginRight: '12px' },
+      a: {
+        display: 'block',
+        marginBottom: '24px',
+        overflow: 'hidden',
+        color: token.colorText,
+        whiteSpace: 'nowrap',
+        textOverflow: 'ellipsis',
+        wordBreak: 'break-all',
+        transition: 'color 0.3s',
+        '&:hover': {
+          color: token.colorPrimary,
+        },
+      },
+    },
+    tabsCard: {
+      '.ant-card-head': { padding: '0 16px' },
+    },
+  };
+});
+
+export default useStyles;

AccountCenter/src/_mock.ts

@@ -1,4 +1,4 @@
-// eslint-disable-next-line import/no-extraneous-dependencies
+// @ts-nocheck
 import type { Request, Response } from 'express';
 import type { ListItemDataType } from './data.d';