chore: adjust layout

feat: add search/list page
fix: side effect of regex '/g'
2023-07-22 14:02:17 +08:00 · 2023-07-22 14:01:51 +08:00 · 2023-07-19 14:45:10 +08:00
7 changed files with 536 additions and 26 deletions
--- a/.eslintrc.cjs
+++ b/.eslintrc.cjs
@ -8,21 +8,29 @@ module.exports = {
        "plugin:@typescript-eslint/recommended",
        "plugin:@typescript-eslint/recommended-requiring-type-checking",
        "plugin:react-hooks/recommended",
-        "prettier",
+        "prettier"
    ],
    parser: "@typescript-eslint/parser",
    parserOptions: {
        ecmaVersion: "latest",
        sourceType: "module",
        project: true,
-        tsconfigRootDir: __dirname,
+        tsconfigRootDir: __dirname
    },
    plugins: ["react-refresh"],
    rules: {
        "react-refresh/only-export-components": [
            "warn",
-            { allowConstantExport: true },
+            { allowConstantExport: true }
        ],
        "@typescript-eslint/no-non-null-assertion": "off",
-    },
+        "@typescript-eslint/no-unused-vars": [
+            "warn",
+            {
+                "argsIgnorePattern": "^_",
+                "varsIgnorePattern": "^_",
+                "caughtErrorsIgnorePattern": "^_"
+            }
+        ]
+    }
 };
--- a/package.json
+++ b/package.json
@ -11,6 +11,7 @@
    },
    "dependencies": {
        "@ant-design/icons": "^5.1.4",
+        "@ant-design/pro-components": "^2.6.7",
        "@sentry/react": "^7.58.1",
        "@sentry/vite-plugin": "^2.4.0",
        "antd": "^5.7.0",
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@ -8,6 +8,9 @@ dependencies:
  '@ant-design/icons':
    specifier: ^5.1.4
    version: 5.1.4(react-dom@18.2.0)(react@18.2.0)
+  '@ant-design/pro-components':
+    specifier: ^2.6.7
+    version: 2.6.7(antd@5.7.0)(rc-field-form@1.34.2)(react-dom@18.2.0)(react@18.2.0)
  '@sentry/react':
    specifier: ^7.58.1
    version: 7.58.1(react@18.2.0)
@ -148,6 +151,265 @@ packages:
      react-dom: 18.2.0(react@18.2.0)
    dev: false

+  /@ant-design/pro-card@2.5.6(antd@5.7.0)(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-/TjmXasTIo0tYIo90uSDXvp4MyXqdUAGKANkoboYx01D4Ykr/d8wNO2IM41ubS9ywDDaCWAqwdlw58GJKVpI9Q==}
+    peerDependencies:
+      antd: '>=4.23.0 || >=5.0.0'
+      react: '>=17.0.0'
+    dependencies:
+      '@ant-design/icons': 5.1.4(react-dom@18.2.0)(react@18.2.0)
+      '@ant-design/pro-provider': 2.11.1(antd@5.7.0)(react-dom@18.2.0)(react@18.2.0)
+      '@ant-design/pro-utils': 2.12.5(antd@5.7.0)(react-dom@18.2.0)(react@18.2.0)
+      '@babel/runtime': 7.22.6
+      antd: 5.7.0(react-dom@18.2.0)(react@18.2.0)
+      classnames: 2.3.2
+      omit.js: 2.0.2
+      rc-resize-observer: 1.3.1(react-dom@18.2.0)(react@18.2.0)
+      rc-util: 5.34.1(react-dom@18.2.0)(react@18.2.0)
+      react: 18.2.0
+    transitivePeerDependencies:
+      - react-dom
+    dev: false
+
+  /@ant-design/pro-components@2.6.7(antd@5.7.0)(rc-field-form@1.34.2)(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-gExeszVr+m6EK7oAifrvmu5w4+3KkHDwcli3hT1W3mqAT+zXVjX4uJXlfT78hxGKcPmHz11HVZIA5yKvhkljaQ==}
+    peerDependencies:
+      antd: '>=4.23.0 || >=5.0.0'
+      react: '>=17.0.0'
+      react-dom: '>=17.0.0'
+    dependencies:
+      '@ant-design/pro-card': 2.5.6(antd@5.7.0)(react-dom@18.2.0)(react@18.2.0)
+      '@ant-design/pro-descriptions': 2.4.7(antd@5.7.0)(rc-field-form@1.34.2)(react-dom@18.2.0)(react@18.2.0)
+      '@ant-design/pro-field': 2.10.6(antd@5.7.0)(react-dom@18.2.0)(react@18.2.0)
+      '@ant-design/pro-form': 2.16.1(antd@5.7.0)(rc-field-form@1.34.2)(react-dom@18.2.0)(react@18.2.0)
+      '@ant-design/pro-layout': 7.16.3(antd@5.7.0)(react-dom@18.2.0)(react@18.2.0)
+      '@ant-design/pro-list': 2.5.7(antd@5.7.0)(rc-field-form@1.34.2)(react-dom@18.2.0)(react@18.2.0)
+      '@ant-design/pro-provider': 2.11.1(antd@5.7.0)(react-dom@18.2.0)(react@18.2.0)
+      '@ant-design/pro-skeleton': 2.1.6(antd@5.7.0)(react-dom@18.2.0)(react@18.2.0)
+      '@ant-design/pro-table': 3.10.1(antd@5.7.0)(rc-field-form@1.34.2)(react-dom@18.2.0)(react@18.2.0)
+      '@ant-design/pro-utils': 2.12.5(antd@5.7.0)(react-dom@18.2.0)(react@18.2.0)
+      '@babel/runtime': 7.22.6
+      antd: 5.7.0(react-dom@18.2.0)(react@18.2.0)
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+    transitivePeerDependencies:
+      - '@types/lodash.merge'
+      - rc-field-form
+    dev: false
+
+  /@ant-design/pro-descriptions@2.4.7(antd@5.7.0)(rc-field-form@1.34.2)(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-Rn0JU6mxOWjhQZRSchCw6UL6g29DIXuYLZooPjub3drwSAx15BW3hKvDqN20Zq6Xq2xIChZ8moTO+kesbCRuSA==}
+    peerDependencies:
+      antd: '>=4.23.0 || >=5.0.0'
+      react: '>=17.0.0'
+    dependencies:
+      '@ant-design/pro-field': 2.10.6(antd@5.7.0)(react-dom@18.2.0)(react@18.2.0)
+      '@ant-design/pro-form': 2.16.1(antd@5.7.0)(rc-field-form@1.34.2)(react-dom@18.2.0)(react@18.2.0)
+      '@ant-design/pro-skeleton': 2.1.6(antd@5.7.0)(react-dom@18.2.0)(react@18.2.0)
+      '@ant-design/pro-utils': 2.12.5(antd@5.7.0)(react-dom@18.2.0)(react@18.2.0)
+      '@babel/runtime': 7.22.6
+      antd: 5.7.0(react-dom@18.2.0)(react@18.2.0)
+      rc-resize-observer: 0.2.6(react-dom@18.2.0)(react@18.2.0)
+      rc-util: 5.34.1(react-dom@18.2.0)(react@18.2.0)
+      react: 18.2.0
+      use-json-comparison: 1.0.6(react@18.2.0)
+    transitivePeerDependencies:
+      - '@types/lodash.merge'
+      - rc-field-form
+      - react-dom
+    dev: false
+
+  /@ant-design/pro-field@2.10.6(antd@5.7.0)(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-2MpcB/WyhtCahbPPZe01KJ9e2Kd0cvlUUjJe8jK/kP4HwAZ5eu64URblHSKO6a2rDVRk22yEfOFBa6QmW++ugQ==}
+    peerDependencies:
+      antd: '>=4.23.0 || >=5.0.0'
+      react: '>=17.0.0'
+    dependencies:
+      '@ant-design/icons': 5.1.4(react-dom@18.2.0)(react@18.2.0)
+      '@ant-design/pro-provider': 2.11.1(antd@5.7.0)(react-dom@18.2.0)(react@18.2.0)
+      '@ant-design/pro-utils': 2.12.5(antd@5.7.0)(react-dom@18.2.0)(react@18.2.0)
+      '@babel/runtime': 7.22.6
+      '@chenshuai2144/sketch-color': 1.0.9(react@18.2.0)
+      antd: 5.7.0(react-dom@18.2.0)(react@18.2.0)
+      classnames: 2.3.2
+      dayjs: 1.11.9
+      lodash.tonumber: 4.0.3
+      omit.js: 2.0.2
+      rc-util: 5.34.1(react-dom@18.2.0)(react@18.2.0)
+      react: 18.2.0
+      swr: 2.2.0(react@18.2.0)
+    transitivePeerDependencies:
+      - react-dom
+    dev: false
+
+  /@ant-design/pro-form@2.16.1(antd@5.7.0)(rc-field-form@1.34.2)(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-7l5dMQEj7YnJ1MfwdNbRwgP9UYzb9KovFXYYsorShgCMoQT6kZuUlZ6WW8FlYZM0H5zGTNEOxMDtebemcNEXUg==}
+    peerDependencies:
+      '@types/lodash.merge': ^4.6.7
+      antd: '>=4.23.0 || >=5.0.0'
+      rc-field-form: ^1.22.0
+      react: '>=17.0.0'
+      react-dom: '>=17.0.0'
+    peerDependenciesMeta:
+      '@types/lodash.merge':
+        optional: true
+    dependencies:
+      '@ant-design/icons': 5.1.4(react-dom@18.2.0)(react@18.2.0)
+      '@ant-design/pro-field': 2.10.6(antd@5.7.0)(react-dom@18.2.0)(react@18.2.0)
+      '@ant-design/pro-provider': 2.11.1(antd@5.7.0)(react-dom@18.2.0)(react@18.2.0)
+      '@ant-design/pro-utils': 2.12.5(antd@5.7.0)(react-dom@18.2.0)(react@18.2.0)
+      '@babel/runtime': 7.22.6
+      '@chenshuai2144/sketch-color': 1.0.9(react@18.2.0)
+      '@umijs/use-params': 1.0.9(react@18.2.0)
+      antd: 5.7.0(react-dom@18.2.0)(react@18.2.0)
+      classnames: 2.3.2
+      lodash.merge: 4.6.2
+      omit.js: 2.0.2
+      rc-field-form: 1.34.2(react-dom@18.2.0)(react@18.2.0)
+      rc-resize-observer: 1.3.1(react-dom@18.2.0)(react@18.2.0)
+      rc-util: 5.34.1(react-dom@18.2.0)(react@18.2.0)
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+      use-json-comparison: 1.0.6(react@18.2.0)
+      use-media-antd-query: 1.1.0(react@18.2.0)
+    dev: false
+
+  /@ant-design/pro-layout@7.16.3(antd@5.7.0)(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-4iTA52/U0JlOKBsNkAHRVxnLUQbP0yhhIAY7TIOKg9R+64VidEtRlKUikigrNZEO3VUNo3zJ00BiywpHmD92Ug==}
+    peerDependencies:
+      antd: '>=4.23.0 || >=5.0.0'
+      react: '>=17.0.0'
+      react-dom: '>=17.0.0'
+    dependencies:
+      '@ant-design/icons': 5.1.4(react-dom@18.2.0)(react@18.2.0)
+      '@ant-design/pro-provider': 2.11.1(antd@5.7.0)(react-dom@18.2.0)(react@18.2.0)
+      '@ant-design/pro-utils': 2.12.5(antd@5.7.0)(react-dom@18.2.0)(react@18.2.0)
+      '@babel/runtime': 7.22.6
+      '@umijs/route-utils': 4.0.1
+      '@umijs/use-params': 1.0.9(react@18.2.0)
+      antd: 5.7.0(react-dom@18.2.0)(react@18.2.0)
+      classnames: 2.3.2
+      lodash.merge: 4.6.2
+      omit.js: 2.0.2
+      path-to-regexp: 2.4.0
+      rc-resize-observer: 1.3.1(react-dom@18.2.0)(react@18.2.0)
+      rc-util: 5.34.1(react-dom@18.2.0)(react@18.2.0)
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+      swr: 2.2.0(react@18.2.0)
+      use-json-comparison: 1.0.6(react@18.2.0)
+      use-media-antd-query: 1.1.0(react@18.2.0)
+      warning: 4.0.3
+    dev: false
+
+  /@ant-design/pro-list@2.5.7(antd@5.7.0)(rc-field-form@1.34.2)(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-9H2ebA5KB3YB221Ez+mULHKiRwNbTeUqyhp4RRg1pHWD1nvjFiMFb0S+K0dI/EP0OLqOWxvU5CfmucH7k3G9BA==}
+    peerDependencies:
+      antd: '>=4.23.0 || >=5.0.0'
+      react: '>=17.0.0'
+      react-dom: '>=17.0.0'
+    dependencies:
+      '@ant-design/icons': 5.1.4(react-dom@18.2.0)(react@18.2.0)
+      '@ant-design/pro-card': 2.5.6(antd@5.7.0)(react-dom@18.2.0)(react@18.2.0)
+      '@ant-design/pro-field': 2.10.6(antd@5.7.0)(react-dom@18.2.0)(react@18.2.0)
+      '@ant-design/pro-table': 3.10.1(antd@5.7.0)(rc-field-form@1.34.2)(react-dom@18.2.0)(react@18.2.0)
+      '@ant-design/pro-utils': 2.12.5(antd@5.7.0)(react-dom@18.2.0)(react@18.2.0)
+      '@babel/runtime': 7.22.6
+      antd: 5.7.0(react-dom@18.2.0)(react@18.2.0)
+      classnames: 2.3.2
+      dayjs: 1.11.9
+      rc-resize-observer: 1.3.1(react-dom@18.2.0)(react@18.2.0)
+      rc-util: 4.21.1
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+      use-media-antd-query: 1.1.0(react@18.2.0)
+    transitivePeerDependencies:
+      - '@types/lodash.merge'
+      - rc-field-form
+    dev: false
+
+  /@ant-design/pro-provider@2.11.1(antd@5.7.0)(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-A7zXZ+58IGVuIAGvo8Hia9Wz0TFfFMo+tIv16Pu2RF9sMdGg4pE5M87qT7+45TkKodWpnpBd4cIte3jfY5v/LQ==}
+    peerDependencies:
+      antd: '>=4.23.0 || >=5.0.0'
+      react: '>=17.0.0'
+      react-dom: '>=17.0.0'
+    dependencies:
+      '@ant-design/cssinjs': 1.11.1(react-dom@18.2.0)(react@18.2.0)
+      '@babel/runtime': 7.22.6
+      '@ctrl/tinycolor': 3.6.0
+      antd: 5.7.0(react-dom@18.2.0)(react@18.2.0)
+      rc-util: 5.34.1(react-dom@18.2.0)(react@18.2.0)
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+      swr: 2.2.0(react@18.2.0)
+    dev: false
+
+  /@ant-design/pro-skeleton@2.1.6(antd@5.7.0)(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-IQD1rjMvHA2Ca8Ez/w8JWAEpGJSjCUwlm0Xm0KU02xOKw3YNGE8HC8TdZ9TbA3VJIzvi6g/J/UQWImWRgkRFbA==}
+    peerDependencies:
+      antd: '>=4.23.0 || >=5.0.0'
+      react: '>=17.0.0'
+      react-dom: '>=17.0.0'
+    dependencies:
+      '@babel/runtime': 7.22.6
+      antd: 5.7.0(react-dom@18.2.0)(react@18.2.0)
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+      use-media-antd-query: 1.1.0(react@18.2.0)
+    dev: false
+
+  /@ant-design/pro-table@3.10.1(antd@5.7.0)(rc-field-form@1.34.2)(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-jFJavMiYJI7AYSxwlk9ebQlzS5SWpALrDMLJ4s8VCj6L8Q0R3PkwQIBDzRYbM4w/eJ62Io3/hQktWpronhQBKw==}
+    peerDependencies:
+      antd: '>=4.23.0 || >=5.0.0'
+      rc-field-form: ^1.22.0
+      react: '>=17.0.0'
+      react-dom: '>=17.0.0'
+    dependencies:
+      '@ant-design/icons': 5.1.4(react-dom@18.2.0)(react@18.2.0)
+      '@ant-design/pro-card': 2.5.6(antd@5.7.0)(react-dom@18.2.0)(react@18.2.0)
+      '@ant-design/pro-field': 2.10.6(antd@5.7.0)(react-dom@18.2.0)(react@18.2.0)
+      '@ant-design/pro-form': 2.16.1(antd@5.7.0)(rc-field-form@1.34.2)(react-dom@18.2.0)(react@18.2.0)
+      '@ant-design/pro-provider': 2.11.1(antd@5.7.0)(react-dom@18.2.0)(react@18.2.0)
+      '@ant-design/pro-utils': 2.12.5(antd@5.7.0)(react-dom@18.2.0)(react@18.2.0)
+      '@babel/runtime': 7.22.6
+      '@dnd-kit/core': 6.0.8(react-dom@18.2.0)(react@18.2.0)
+      '@dnd-kit/sortable': 7.0.2(@dnd-kit/core@6.0.8)(react@18.2.0)
+      '@dnd-kit/utilities': 3.2.1(react@18.2.0)
+      antd: 5.7.0(react-dom@18.2.0)(react@18.2.0)
+      classnames: 2.3.2
+      dayjs: 1.11.9
+      omit.js: 2.0.2
+      rc-field-form: 1.34.2(react-dom@18.2.0)(react@18.2.0)
+      rc-resize-observer: 1.3.1(react-dom@18.2.0)(react@18.2.0)
+      rc-util: 5.34.1(react-dom@18.2.0)(react@18.2.0)
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+      use-json-comparison: 1.0.6(react@18.2.0)
+    transitivePeerDependencies:
+      - '@types/lodash.merge'
+    dev: false
+
+  /@ant-design/pro-utils@2.12.5(antd@5.7.0)(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-3/f4sghGELYc4/1fwlGx5o8+szs7SAXTpaXxJaA6C0BfkiuHqosOwCt2dhikdNSKXb3UIbvV0cLcm4qKPuXGRA==}
+    peerDependencies:
+      antd: '>=4.23.0 || >=5.0.0'
+      react: '>=17.0.0'
+      react-dom: '>=17.0.0'
+    dependencies:
+      '@ant-design/icons': 5.1.4(react-dom@18.2.0)(react@18.2.0)
+      '@ant-design/pro-provider': 2.11.1(antd@5.7.0)(react-dom@18.2.0)(react@18.2.0)
+      '@babel/runtime': 7.22.6
+      antd: 5.7.0(react-dom@18.2.0)(react@18.2.0)
+      classnames: 2.3.2
+      dayjs: 1.11.9
+      rc-util: 5.34.1(react-dom@18.2.0)(react@18.2.0)
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+      swr: 2.2.0(react@18.2.0)
+    dev: false
+
  /@ant-design/react-slick@1.0.1(react@18.2.0):
    resolution: {integrity: sha512-ARM0TmpGdDuUVE10NwUCENQlJSInNKo5NiBjL5szu5BxWNEHNwQMcDrlVCqFbkvFLy+2CvywW8Y59QJtC0YDag==}
    peerDependencies:
@ -168,11 +430,64 @@ packages:
      regenerator-runtime: 0.13.11
    dev: false

+  /@chenshuai2144/sketch-color@1.0.9(react@18.2.0):
+    resolution: {integrity: sha512-obzSy26cb7Pm7OprWyVpgMpIlrZpZ0B7vbrU0RMbvRg0YAI890S5Xy02Aj1Nhl4+KTbi1lVYHt6HQP8Hm9s+1w==}
+    peerDependencies:
+      react: '>=16.12.0'
+    dependencies:
+      react: 18.2.0
+      reactcss: 1.2.3(react@18.2.0)
+      tinycolor2: 1.6.0
+    dev: false
+
  /@ctrl/tinycolor@3.6.0:
    resolution: {integrity: sha512-/Z3l6pXthq0JvMYdUFyX9j0MaCltlIn6mfh9jLyQwg5aPKxkyNa0PTHtU1AlFXLNk55ZuAeJRcpvq+tmLfKmaQ==}
    engines: {node: '>=10'}
    dev: false

+  /@dnd-kit/accessibility@3.0.1(react@18.2.0):
+    resolution: {integrity: sha512-HXRrwS9YUYQO9lFRc/49uO/VICbM+O+ZRpFDe9Pd1rwVv2PCNkRiTZRdxrDgng/UkvdC3Re9r2vwPpXXrWeFzg==}
+    peerDependencies:
+      react: '>=16.8.0'
+    dependencies:
+      react: 18.2.0
+      tslib: 2.6.0
+    dev: false
+
+  /@dnd-kit/core@6.0.8(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-lYaoP8yHTQSLlZe6Rr9qogouGUz9oRUj4AHhDQGQzq/hqaJRpFo65X+JKsdHf8oUFBzx5A+SJPUvxAwTF2OabA==}
+    peerDependencies:
+      react: '>=16.8.0'
+      react-dom: '>=16.8.0'
+    dependencies:
+      '@dnd-kit/accessibility': 3.0.1(react@18.2.0)
+      '@dnd-kit/utilities': 3.2.1(react@18.2.0)
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+      tslib: 2.6.0
+    dev: false
+
+  /@dnd-kit/sortable@7.0.2(@dnd-kit/core@6.0.8)(react@18.2.0):
+    resolution: {integrity: sha512-wDkBHHf9iCi1veM834Gbk1429bd4lHX4RpAwT0y2cHLf246GAvU2sVw/oxWNpPKQNQRQaeGXhAVgrOl1IT+iyA==}
+    peerDependencies:
+      '@dnd-kit/core': ^6.0.7
+      react: '>=16.8.0'
+    dependencies:
+      '@dnd-kit/core': 6.0.8(react-dom@18.2.0)(react@18.2.0)
+      '@dnd-kit/utilities': 3.2.1(react@18.2.0)
+      react: 18.2.0
+      tslib: 2.6.0
+    dev: false
+
+  /@dnd-kit/utilities@3.2.1(react@18.2.0):
+    resolution: {integrity: sha512-OOXqISfvBw/1REtkSK2N3Fi2EQiLMlWUlqnOK/UpOISqBZPWpE6TqL+jcPtMOkE8TqYGiURvRdPSI9hltNUjEA==}
+    peerDependencies:
+      react: '>=16.8.0'
+    dependencies:
+      react: 18.2.0
+      tslib: 2.6.0
+    dev: false
+
  /@emotion/hash@0.8.0:
    resolution: {integrity: sha512-kBJtf7PH6aWwZ6fka3zQ0p6SBYzx4fl1LoZXE2RrnYST9Xljm7WfKJrU4g/Xr3Beg72MLrp1AWNUmuYJTL7Cow==}
    dev: false
@ -1050,6 +1365,18 @@ packages:
      eslint-visitor-keys: 3.4.1
    dev: true

+  /@umijs/route-utils@4.0.1:
+    resolution: {integrity: sha512-+1ixf1BTOLuH+ORb4x8vYMPeIt38n9q0fJDwhv9nSxrV46mxbLF0nmELIo9CKQB2gHfuC4+hww6xejJ6VYnBHQ==}
+    dev: false
+
+  /@umijs/use-params@1.0.9(react@18.2.0):
+    resolution: {integrity: sha512-QlN0RJSBVQBwLRNxbxjQ5qzqYIGn+K7USppMoIOVlf7fxXHsnQZ2bEsa6Pm74bt6DVQxpUE8HqvdStn6Y9FV1w==}
+    peerDependencies:
+      react: '*'
+    dependencies:
+      react: 18.2.0
+    dev: false
+
  /@vitejs/plugin-react-swc@3.3.2(vite@4.4.0):
    resolution: {integrity: sha512-VJFWY5sfoZerQRvJrh518h3AcQt6f/yTuWn4/TRB+dqmYU0NX1qz7qM5Wfd+gOQqUzQW4gxKqKN3KpE/P3+zrA==}
    peerDependencies:
@ -1096,6 +1423,12 @@ packages:
    engines: {node: '>=0.4.0'}
    hasBin: true

+  /add-dom-event-listener@1.1.0:
+    resolution: {integrity: sha512-WCxx1ixHT0GQU9hb0KI/mhgRQhnU+U3GvwY6ZvVjYq8rsihIGoaIOUbY0yMPBxLH5MDtr0kz3fisWGNcbWW7Jw==}
+    dependencies:
+      object-assign: 4.1.1
+    dev: false
+
  /agent-base@6.0.2:
    resolution: {integrity: sha512-RZNwNclF7+MS/8bDg70amg32dyeZGZxiDuQmZxKLAlQjr3jGyLx+4Kkk58UO7D2QdgFIQCovuSuZESne6RG6XQ==}
    engines: {node: '>= 6.0.0'}
@ -2183,7 +2516,10 @@ packages:

  /lodash.merge@4.6.2:
    resolution: {integrity: sha512-0KpjqXRVvrYyCsX1swR/XTK0va6VQkQM6MNo7PqW77ByjAhoARA8EfrP1N4+KlKj8YS0ZUCtRT/YUuhyYDujIQ==}
-    dev: true
+
+  /lodash.tonumber@4.0.3:
+    resolution: {integrity: sha512-SY0SwuPOHRwKcCNTdsntPYb+Zddz5mDUIVFABzRMqmAiL41pMeyoQFGxYAw5zdc9NnH4pbJqiqqp5ckfxa+zSA==}
+    dev: false

  /lodash@4.17.21:
    resolution: {integrity: sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==}
@ -2751,6 +3087,10 @@ packages:
    engines: {node: '>=0.10.0'}
    dev: false

+  /omit.js@2.0.2:
+    resolution: {integrity: sha512-hJmu9D+bNB40YpL9jYebQl4lsTW6yEHRTroJzNLqQJYHm7c+NQnJGfZmIWh8S3q3KoaxV1aLhV6B3+0N0/kyJg==}
+    dev: false
+
  /once@1.4.0:
    resolution: {integrity: sha512-lNaJgI+2Q5URQBkccEKHTQOPaXdUxnZZElQTZY0MFUAuaEqe1E+Nyvgdz/aIyNi6Z9MzO5dv1H8n58/GELp3+w==}
    dependencies:
@ -2825,6 +3165,10 @@ packages:
      minipass: 7.0.2
    dev: false

+  /path-to-regexp@2.4.0:
+    resolution: {integrity: sha512-G6zHoVqC6GGTQkZwF4lkuEyMbVOjoBKAEybQUypI1WTkqinCOrq2x6U2+phkJ1XsEMTy4LjtwPI7HW+NVrRR2w==}
+    dev: false
+
  /path-type@4.0.0:
    resolution: {integrity: sha512-gDKb8aZMDeD/tZWs9P6+q0J9Mwkdl6xMV8TjnGP3qJVJ06bdMgkbBlLU8IdfOsIsFz2BW1rNVT3XuNEl8zPAvw==}
    engines: {node: '>=8'}
@ -3223,6 +3567,20 @@ packages:
      react-dom: 18.2.0(react@18.2.0)
    dev: false

+  /rc-resize-observer@0.2.6(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-YX6nYnd6fk7zbuvT6oSDMKiZjyngjHoy+fz+vL3Tez38d/G5iGdaDJa2yE7345G6sc4Mm1IGRUIwclvltddhmA==}
+    peerDependencies:
+      react: '>=16.9.0'
+      react-dom: '>=16.9.0'
+    dependencies:
+      '@babel/runtime': 7.22.6
+      classnames: 2.3.2
+      rc-util: 5.34.1(react-dom@18.2.0)(react@18.2.0)
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+      resize-observer-polyfill: 1.5.1
+    dev: false
+
  /rc-resize-observer@1.3.1(react-dom@18.2.0)(react@18.2.0):
    resolution: {integrity: sha512-iFUdt3NNhflbY3mwySv5CA1TC06zdJ+pfo0oc27xpf4PIOvfZwZGtD9Kz41wGYqC4SLio93RVAirSSpYlV/uYg==}
    peerDependencies:
@ -3416,6 +3774,16 @@ packages:
      react-dom: 18.2.0(react@18.2.0)
    dev: false

+  /rc-util@4.21.1:
+    resolution: {integrity: sha512-Z+vlkSQVc1l8O2UjR3WQ+XdWlhj5q9BMQNLk2iOBch75CqPfrJyGtcWMcnhRlNuDu0Ndtt4kLVO8JI8BrABobg==}
+    dependencies:
+      add-dom-event-listener: 1.1.0
+      prop-types: 15.8.1
+      react-is: 16.13.1
+      react-lifecycles-compat: 3.0.4
+      shallowequal: 1.1.0
+    dev: false
+
  /rc-util@5.34.1(react-dom@18.2.0)(react@18.2.0):
    resolution: {integrity: sha512-SqiUT8Ssgh5C+hu4y887xwCrMNcxLm6ScOo8AFlWYYF3z9uNNiPpwwSjvicqOlWd79rNw1g44rnP7tz9MrO1ZQ==}
    peerDependencies:
@ -3461,6 +3829,10 @@ packages:
    resolution: {integrity: sha512-xWGDIW6x921xtzPkhiULtthJHoJvBbF3q26fzloPCK0hsvxtPVelvftw3zjbHWSkR2km9Z+4uxbDDK/6Zw9B8w==}
    dev: false

+  /react-lifecycles-compat@3.0.4:
+    resolution: {integrity: sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA==}
+    dev: false
+
  /react-markdown@8.0.7(@types/react@18.2.14)(react@18.2.0):
    resolution: {integrity: sha512-bvWbzG4MtOU62XqBx3Xx+zB2raaFFsq4mYiAzfjXJMEz2sixgeAfraA3tvzULF02ZdOMUOKTBFFaZJDDrq+BJQ==}
    peerDependencies:
@ -3531,6 +3903,15 @@ packages:
      loose-envify: 1.4.0
    dev: false

+  /reactcss@1.2.3(react@18.2.0):
+    resolution: {integrity: sha512-KiwVUcFu1RErkI97ywr8nvx8dNOpT03rbnma0SSalTYjkrPYaEajR4a/MRt6DZ46K6arDRbWMNHF+xH7G7n/8A==}
+    peerDependencies:
+      react: '*'
+    dependencies:
+      lodash: 4.17.21
+      react: 18.2.0
+    dev: false
+
  /readdirp@3.6.0:
    resolution: {integrity: sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==}
    engines: {node: '>=8.10.0'}
@ -3702,6 +4083,10 @@ packages:
      lru-cache: 6.0.0
    dev: true

+  /shallowequal@1.1.0:
+    resolution: {integrity: sha512-y0m1JoUZSlPAjXVtPPW70aZWfIL/dSP7AFkRnniLCrK/8MDKog3TySTBmckD+RObVxH0v4Tox67+F14PdED2oQ==}
+    dev: false
+
  /shebang-command@2.0.0:
    resolution: {integrity: sha512-kHxr2zZpYtdmrN1qDjrrX/Z1rR1kG8Dx+gkpK1G4eXmvXswmcE1hTWBWYUzlraYw1/yZp6YuDY77YtvbN0dmDA==}
    engines: {node: '>=8'}
@ -3781,6 +4166,15 @@ packages:
      has-flag: 4.0.0
    dev: true

+  /swr@2.2.0(react@18.2.0):
+    resolution: {integrity: sha512-AjqHOv2lAhkuUdIiBu9xbuettzAzWXmCEcLONNKJRba87WAefz8Ca9d6ds/SzrPc235n1IxWYdhJ2zF3MNUaoQ==}
+    peerDependencies:
+      react: ^16.11.0 || ^17.0.0 || ^18.0.0
+    dependencies:
+      react: 18.2.0
+      use-sync-external-store: 1.2.0(react@18.2.0)
+    dev: false
+
  /symbol-tree@3.2.4:
    resolution: {integrity: sha512-9QNk5KwDF+Bvz+PyObkmSYjI5ksVUYtjW7AU22r2NKcfLJcXp96hkDWU3+XndOsUb+AQ9QhfzfCT2O+CNWT5Tw==}
    dev: false
@ -3794,6 +4188,10 @@ packages:
    engines: {node: '>=12.22'}
    dev: false

+  /tinycolor2@1.6.0:
+    resolution: {integrity: sha512-XPaBkWQJdsf3pLKJV9p4qN/S+fm2Oj8AIPo1BTUhg5oxkvm9+SVEGFdhyOz7tTdUTfvxMiAs4sp6/eZO2Ew+pw==}
+    dev: false
+
  /to-regex-range@5.0.1:
    resolution: {integrity: sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==}
    engines: {node: '>=8.0'}
@ -3836,6 +4234,10 @@ packages:
  /tslib@1.14.1:
    resolution: {integrity: sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==}

+  /tslib@2.6.0:
+    resolution: {integrity: sha512-7At1WUettjcSRHXCyYtTselblcHl9PJFFVKiCAy/bY97+BPZXSQ2wbq0P9s8tK2G7dFQfNnlJnPAiArVBVBsfA==}
+    dev: false
+
  /tsutils@3.21.0(typescript@5.0.2):
    resolution: {integrity: sha512-mHKK3iUXL+3UF6xL5k0PEhKRUBKPBCv/+RkEOpjRWxxx27KKRBmmA60A9pgOUvMi8GKhRMPEmjBRPzs2W7O1OA==}
    engines: {node: '>= 6'}
@ -3947,6 +4349,30 @@ packages:
      requires-port: 1.0.0
    dev: false

+  /use-json-comparison@1.0.6(react@18.2.0):
+    resolution: {integrity: sha512-xPadt5yMRbEmVfOSGFSMqjjICrq7nLbfSH3rYIXsrtcuFX7PmbYDN/ku8ObBn3v8o/yZelO1OxUS5+5TI3+fUw==}
+    peerDependencies:
+      react: '>=16.9.0'
+    dependencies:
+      react: 18.2.0
+    dev: false
+
+  /use-media-antd-query@1.1.0(react@18.2.0):
+    resolution: {integrity: sha512-B6kKZwNV4R+l4Rl11sWO7HqOay9alzs1Vp1b4YJqjz33YxbltBCZtt/yxXxkXN9rc1S7OeEL/GbwC30Wmqhw6Q==}
+    peerDependencies:
+      react: '>=16.9.0'
+    dependencies:
+      react: 18.2.0
+    dev: false
+
+  /use-sync-external-store@1.2.0(react@18.2.0):
+    resolution: {integrity: sha512-eEgnFxGQ1Ife9bzYs6VLi8/4X6CObHMw9Qr9tPY43iKwsPw8xE8+EFsf/2cFZ5S3esXgpWgtSCtLNS41F+sKPA==}
+    peerDependencies:
+      react: ^16.8.0 || ^17.0.0 || ^18.0.0
+    dependencies:
+      react: 18.2.0
+    dev: false
+
  /uvu@0.5.6:
    resolution: {integrity: sha512-+g8ENReyr8YsOc6fv/NVJs2vFdHBnBNdfE49rshrTzDWOlUx4Gq7KOS2GD8eqhy2j+Ejq29+SbKH8yjkAqXqoA==}
    engines: {node: '>=8'}
@ -4031,6 +4457,12 @@ packages:
      xml-name-validator: 4.0.0
    dev: false

+  /warning@4.0.3:
+    resolution: {integrity: sha512-rpJyN222KWIvHJ/F53XSZv0Zl/accqHR8et1kpaMTD/fLCRxtV8iX8czMzY7sVZupTI3zcUTg8eycS2kNF9l6w==}
+    dependencies:
+      loose-envify: 1.4.0
+    dev: false
+
  /web-namespaces@2.0.1:
    resolution: {integrity: sha512-bKr1DkiNa2krS7qxNtdrtHAmzuYGFQLiQ13TsorsdT6ULTkPLKuu5+GsFpDlg6JFjUTwX2DyhMPG2be8uPrqsQ==}
    dev: false
--- a/src/pages/pages.tsx
+++ b/src/pages/pages.tsx
@ -1,4 +1,6 @@
 export { Root } from "./root";
 export { ErrorPage } from "./error-page";
+
 export { HomePage } from "./home";
 export { ProblemLoader, ProblemPage } from "./problem";
+export { SearchPage } from "./search";
--- a/src/pages/root.tsx
+++ b/src/pages/root.tsx
@ -1,8 +1,7 @@
 import { Link, Outlet, useLocation, useNavigation } from "react-router-dom";
-import { Layout, Menu, MenuProps, Skeleton, theme } from "antd";
+import { Layout, Menu, MenuProps, Skeleton } from "antd";

 import { NavConfigs } from "../routes.tsx";
-import { useEffect, useState } from "react";

 const { Header, Footer, Content } = Layout;

@ -14,22 +13,12 @@ const navItems: MenuProps["items"] = NavConfigs.map((c) => {
 });

 function Root() {
-    const {
-        token: { colorBgContainer },
-    } = theme.useToken();
-
    const nav = useNavigation();
    const location = useLocation();

-    const [curTab, setCurTab] = useState("home");
-
-    useEffect(() => {
-        setCurTab(
-            NavConfigs.filter((c) => c.regex.test(location.pathname))
+    const curTab = NavConfigs.filter((c) => c.regex.test(location.pathname))
        .map((c) => c.key)
-                .concat(["home"])[0],
-        );
-    }, [location]);
+        .concat("home")[0];

    return (
        <>
@ -46,14 +35,14 @@ function Root() {
                <Layout>
                    <Content
                        style={{
-                            background: colorBgContainer,
+                            background: "#F8F8F8",
                            display: "flex",
                            justifyContent: "center",
                            paddingTop: "30px",
                            paddingBottom: "30px",
                        }}
                    >
-                        <div style={{ width: "90%" }}>
+                        <div style={{ width: "85%" }}>
                            <Skeleton loading={nav.state === "loading"} active>
                                <Outlet />
                            </Skeleton>
--- a/src/pages/search.tsx
+++ b/src/pages/search.tsx
@ -0,0 +1,76 @@
+import { ProColumns, ProTable } from "@ant-design/pro-components";
+
+import { ProblemApi } from "../api/problem.ts";
+import { Link } from "react-router-dom";
+
+interface ProblemList {
+    id: number;
+    title: string;
+    provider: string;
+}
+
+const columns: ProColumns<ProblemList>[] = [
+    {
+        title: "ID",
+        hideInSearch: true,
+        dataIndex: "id",
+        align: "center",
+    },
+    {
+        title: "Name",
+        dataIndex: "title",
+        align: "left",
+    },
+    {
+        title: "Provider",
+        hideInSearch: true,
+        dataIndex: "provider",
+        align: "center",
+    },
+    {
+        title: "Action",
+        hideInSearch: true,
+        dataIndex: "action",
+        render: (_node, entity) => {
+            return <Link to={`/problem/${entity.id}`}>View</Link>;
+        },
+    },
+];
+
+export function SearchPage() {
+    const request = async (params: Record<string, string>) => {
+        try {
+            const info = await ProblemApi.Search({
+                search: params.title || "",
+            });
+            const data = info.map((i) => {
+                return {
+                    id: i.meta.ID,
+                    title: i.title,
+                    provider: i.provider.nick_name,
+                };
+            });
+            return { success: true, data: data, total: data.length };
+        } catch (e) {
+            console.log(e);
+            return { success: false, data: [], total: 0 };
+        }
+    };
+
+    return (
+        <ProTable<ProblemList>
+            cardBordered
+            columns={columns}
+            request={request}
+            rowKey={(record) => record.id}
+            pagination={{
+                pageSize: 10,
+            }}
+            search={{
+                labelWidth: "auto",
+            }}
+            dateFormatter="string"
+            headerTitle="Problem Lists"
+        />
+    );
+}
--- a/src/routes.tsx
+++ b/src/routes.tsx
@ -1,5 +1,7 @@
 import { HomePage } from "./pages/home.tsx";
+
 import { ProblemLoader, ProblemPage } from "./pages/pages.tsx";
+import { SearchPage } from "./pages/pages.tsx";

 const RouteConfigs = [
    {
@ -7,8 +9,8 @@ const RouteConfigs = [
        element: <HomePage />,
    },
    {
-        path: "problem",
-        element: <div>problems</div>,
+        path: "search",
+        element: <SearchPage />,
    },
    {
        path: "problem/:id",
@ -26,13 +28,13 @@ const NavConfigs = [
        key: "home",
        to: "/home",
        label: "Home",
-        regex: /^\/$|^\/home$/gi,
+        regex: /^\/$|^\/home$/i,
    },
    {
        key: "problem",
        to: "/search/",
        label: "Problem",
-        regex: /^\/+(problem|search)($|\/.*)/gi,
+        regex: /^\/+(problem|search)($|\/.*)/i,
    },
 ];
Author	SHA1	Message	Date
Paul Pan	a723b02f19	chore: adjust layout	2023-07-22 14:02:17 +08:00
Paul Pan	8c16c19fa6	feat: add search/list page	2023-07-22 14:01:51 +08:00
Paul Pan	f858c91a12	fix: side effect of regex '/g'	2023-07-19 14:45:10 +08:00