From cd060266fcf322b55d0a1c36a22fbdbb3375bc3a Mon Sep 17 00:00:00 2001 From: Jonson Petard Date: Wed, 3 Apr 2024 04:02:50 +0800 Subject: [PATCH] refactor: use lazy load routes to improve performance --- .eslintrc.cjs | 2 +- backend/tauri/src/utils/resolve.rs | 2 +- src/index.html => index.html | 2 +- package.json | 1 + pnpm-lock.yaml | 98 ++++++----------------- src/components/layout/layout-item.tsx | 10 +-- src/components/layout/page-transition.tsx | 14 +++- src/components/profile/profile-viewer.tsx | 4 +- src/components/setting/setting-verge.tsx | 2 +- src/locales/en.json | 13 +-- src/locales/ru.json | 13 +-- src/locales/zh.json | 14 ++-- src/main.tsx | 20 +---- src/pages/404.tsx | 3 + src/pages/_app.module.scss | 10 +++ src/pages/{_layout.tsx => _app.tsx} | 61 ++++++++++---- src/pages/_routers.tsx | 57 ------------- src/router.ts | 25 ++++++ src/services/cmds.ts | 2 +- tsconfig.json | 8 +- vite.config.ts | 11 +-- 21 files changed, 169 insertions(+), 203 deletions(-) rename src/index.html => index.html (94%) create mode 100644 src/pages/404.tsx create mode 100644 src/pages/_app.module.scss rename src/pages/{_layout.tsx => _app.tsx} (79%) delete mode 100644 src/pages/_routers.tsx create mode 100644 src/router.ts diff --git a/.eslintrc.cjs b/.eslintrc.cjs index af79a90e1f..c5c9f176a6 100644 --- a/.eslintrc.cjs +++ b/.eslintrc.cjs @@ -28,7 +28,7 @@ module.exports = { alias: { map: [ ["@", "./src"], - ["@root", "./"], + ["~", "./"], ], extensions: [".tsx", ".ts", ".jsx", ".js", ".mjs", ".cjs"], }, diff --git a/backend/tauri/src/utils/resolve.rs b/backend/tauri/src/utils/resolve.rs index f2cd79f4b5..33fa7872ae 100644 --- a/backend/tauri/src/utils/resolve.rs +++ b/backend/tauri/src/utils/resolve.rs @@ -125,7 +125,7 @@ pub fn create_window(app_handle: &AppHandle) { let mut builder = tauri::window::WindowBuilder::new( app_handle, "main".to_string(), - tauri::WindowUrl::App("index.html".into()), + tauri::WindowUrl::App("/proxies".into()), ) .title("Clash Nyanpasu") .fullscreen(false) diff --git a/src/index.html b/index.html similarity index 94% rename from src/index.html rename to index.html index 451f29847e..8177b519ed 100644 --- a/src/index.html +++ b/index.html @@ -33,6 +33,6 @@
- + diff --git a/package.json b/package.json index 4ee15d2347..900c162d67 100644 --- a/package.json +++ b/package.json @@ -68,6 +68,7 @@ "@dnd-kit/utilities": "3.2.2", "@emotion/react": "11.11.4", "@emotion/styled": "11.11.5", + "@generouted/react-router": "^1.18.5", "@juggle/resize-observer": "3.4.0", "@mui/icons-material": "5.15.14", "@mui/lab": "5.0.0-alpha.169", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 4be57d805e..23c88a5667 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -23,6 +23,9 @@ dependencies: '@emotion/styled': specifier: 11.11.5 version: 11.11.5(@emotion/react@11.11.4)(@types/react@18.2.74)(react@18.2.0) + '@generouted/react-router': + specifier: ^1.18.5 + version: 1.18.5(react-router-dom@6.22.3)(react@18.2.0)(vite@5.2.7) '@juggle/resize-observer': specifier: 3.4.0 version: 3.4.0 @@ -930,7 +933,6 @@ packages: cpu: [ppc64] os: [aix] requiresBuild: true - dev: true optional: true /@esbuild/android-arm64@0.19.10: @@ -948,7 +950,6 @@ packages: cpu: [arm64] os: [android] requiresBuild: true - dev: true optional: true /@esbuild/android-arm@0.19.10: @@ -966,7 +967,6 @@ packages: cpu: [arm] os: [android] requiresBuild: true - dev: true optional: true /@esbuild/android-x64@0.19.10: @@ -984,7 +984,6 @@ packages: cpu: [x64] os: [android] requiresBuild: true - dev: true optional: true /@esbuild/darwin-arm64@0.19.10: @@ -1002,7 +1001,6 @@ packages: cpu: [arm64] os: [darwin] requiresBuild: true - dev: true optional: true /@esbuild/darwin-x64@0.19.10: @@ -1020,7 +1018,6 @@ packages: cpu: [x64] os: [darwin] requiresBuild: true - dev: true optional: true /@esbuild/freebsd-arm64@0.19.10: @@ -1038,7 +1035,6 @@ packages: cpu: [arm64] os: [freebsd] requiresBuild: true - dev: true optional: true /@esbuild/freebsd-x64@0.19.10: @@ -1056,7 +1052,6 @@ packages: cpu: [x64] os: [freebsd] requiresBuild: true - dev: true optional: true /@esbuild/linux-arm64@0.19.10: @@ -1074,7 +1069,6 @@ packages: cpu: [arm64] os: [linux] requiresBuild: true - dev: true optional: true /@esbuild/linux-arm@0.19.10: @@ -1092,7 +1086,6 @@ packages: cpu: [arm] os: [linux] requiresBuild: true - dev: true optional: true /@esbuild/linux-ia32@0.19.10: @@ -1110,7 +1103,6 @@ packages: cpu: [ia32] os: [linux] requiresBuild: true - dev: true optional: true /@esbuild/linux-loong64@0.19.10: @@ -1128,7 +1120,6 @@ packages: cpu: [loong64] os: [linux] requiresBuild: true - dev: true optional: true /@esbuild/linux-mips64el@0.19.10: @@ -1146,7 +1137,6 @@ packages: cpu: [mips64el] os: [linux] requiresBuild: true - dev: true optional: true /@esbuild/linux-ppc64@0.19.10: @@ -1164,7 +1154,6 @@ packages: cpu: [ppc64] os: [linux] requiresBuild: true - dev: true optional: true /@esbuild/linux-riscv64@0.19.10: @@ -1182,7 +1171,6 @@ packages: cpu: [riscv64] os: [linux] requiresBuild: true - dev: true optional: true /@esbuild/linux-s390x@0.19.10: @@ -1200,7 +1188,6 @@ packages: cpu: [s390x] os: [linux] requiresBuild: true - dev: true optional: true /@esbuild/linux-x64@0.19.10: @@ -1218,7 +1205,6 @@ packages: cpu: [x64] os: [linux] requiresBuild: true - dev: true optional: true /@esbuild/netbsd-x64@0.19.10: @@ -1236,7 +1222,6 @@ packages: cpu: [x64] os: [netbsd] requiresBuild: true - dev: true optional: true /@esbuild/openbsd-x64@0.19.10: @@ -1254,7 +1239,6 @@ packages: cpu: [x64] os: [openbsd] requiresBuild: true - dev: true optional: true /@esbuild/sunos-x64@0.19.10: @@ -1272,7 +1256,6 @@ packages: cpu: [x64] os: [sunos] requiresBuild: true - dev: true optional: true /@esbuild/win32-arm64@0.19.10: @@ -1290,7 +1273,6 @@ packages: cpu: [arm64] os: [win32] requiresBuild: true - dev: true optional: true /@esbuild/win32-ia32@0.19.10: @@ -1308,7 +1290,6 @@ packages: cpu: [ia32] os: [win32] requiresBuild: true - dev: true optional: true /@esbuild/win32-x64@0.19.10: @@ -1326,7 +1307,6 @@ packages: cpu: [x64] os: [win32] requiresBuild: true - dev: true optional: true /@eslint-community/eslint-utils@4.4.0(eslint@8.57.0): @@ -1399,6 +1379,20 @@ packages: resolution: {integrity: sha512-9TANp6GPoMtYzQdt54kfAyMmz1+osLlXdg2ENroU7zzrtflTLrrC/lgrIfaSe+Wu0b89GKccT7vxXA0MoAIO+Q==} dev: false + /@generouted/react-router@1.18.5(react-router-dom@6.22.3)(react@18.2.0)(vite@5.2.7): + resolution: {integrity: sha512-PY2KeXaEIRwM2Irwie6Coe0oMeFWQnc4bjxC+01VxOam3eOhFq0e1Zh0tCg8yVDPdnA/IezT35gteG2jMN21yg==} + peerDependencies: + react: '>=18' + react-router-dom: '>=6' + vite: '>=4' + dependencies: + fast-glob: 3.3.2 + generouted: 1.18.5(vite@5.2.7) + react: 18.2.0 + react-router-dom: 6.22.3(react-dom@18.2.0)(react@18.2.0) + vite: 5.2.7(@types/node@20.12.2)(sass@1.72.0) + dev: false + /@humanwhocodes/config-array@0.11.14: resolution: {integrity: sha512-3T8LkOmg45BV5FICb15QQMsyUSWrQ8AygVfC7ZG32zOalnqrilm018ZVCw0eapXux8FtA33q8PSRSstjee3jSg==} engines: {node: '>=10.10.0'} @@ -1705,12 +1699,10 @@ packages: dependencies: '@nodelib/fs.stat': 2.0.5 run-parallel: 1.2.0 - dev: true /@nodelib/fs.stat@2.0.5: resolution: {integrity: sha512-RkhPPp2zrqDAQA/2jNhnztcPAlv64XdhIp7a7454A5ovI7Bukxgt7MX7udwAu3zg1DcpPU0rz3VV1SeaqvY4+A==} engines: {node: '>= 8'} - dev: true /@nodelib/fs.walk@1.2.8: resolution: {integrity: sha512-oGB+UxlgWcgQkgwo8GcEGwemoTFt3FIO9ababBmaGwXIoBKZ+GTy0pP185beGg7Llih/NSHSV2XAs1lnznocSg==} @@ -1718,7 +1710,6 @@ packages: dependencies: '@nodelib/fs.scandir': 2.1.5 fastq: 1.15.0 - dev: true /@octokit/auth-token@4.0.0: resolution: {integrity: sha512-tY/msAuJo6ARbK6SPIxZrPBms3xPbfwBrulZe0Wtr/DIY9lje2HeV1uoebShn6mx7SjCHif6EjMvoREj+gZ+SA==} @@ -1851,7 +1842,6 @@ packages: cpu: [arm] os: [android] requiresBuild: true - dev: true optional: true /@rollup/rollup-android-arm64@4.13.0: @@ -1859,7 +1849,6 @@ packages: cpu: [arm64] os: [android] requiresBuild: true - dev: true optional: true /@rollup/rollup-darwin-arm64@4.13.0: @@ -1867,7 +1856,6 @@ packages: cpu: [arm64] os: [darwin] requiresBuild: true - dev: true optional: true /@rollup/rollup-darwin-x64@4.13.0: @@ -1875,7 +1863,6 @@ packages: cpu: [x64] os: [darwin] requiresBuild: true - dev: true optional: true /@rollup/rollup-linux-arm-gnueabihf@4.13.0: @@ -1883,7 +1870,6 @@ packages: cpu: [arm] os: [linux] requiresBuild: true - dev: true optional: true /@rollup/rollup-linux-arm64-gnu@4.13.0: @@ -1892,7 +1878,6 @@ packages: os: [linux] libc: [glibc] requiresBuild: true - dev: true optional: true /@rollup/rollup-linux-arm64-musl@4.13.0: @@ -1901,7 +1886,6 @@ packages: os: [linux] libc: [musl] requiresBuild: true - dev: true optional: true /@rollup/rollup-linux-riscv64-gnu@4.13.0: @@ -1910,7 +1894,6 @@ packages: os: [linux] libc: [glibc] requiresBuild: true - dev: true optional: true /@rollup/rollup-linux-x64-gnu@4.13.0: @@ -1919,7 +1902,6 @@ packages: os: [linux] libc: [glibc] requiresBuild: true - dev: true optional: true /@rollup/rollup-linux-x64-musl@4.13.0: @@ -1928,7 +1910,6 @@ packages: os: [linux] libc: [musl] requiresBuild: true - dev: true optional: true /@rollup/rollup-win32-arm64-msvc@4.13.0: @@ -1936,7 +1917,6 @@ packages: cpu: [arm64] os: [win32] requiresBuild: true - dev: true optional: true /@rollup/rollup-win32-ia32-msvc@4.13.0: @@ -1944,7 +1924,6 @@ packages: cpu: [ia32] os: [win32] requiresBuild: true - dev: true optional: true /@rollup/rollup-win32-x64-msvc@4.13.0: @@ -1952,7 +1931,6 @@ packages: cpu: [x64] os: [win32] requiresBuild: true - dev: true optional: true /@shikijs/core@1.2.3: @@ -2320,7 +2298,6 @@ packages: resolution: {integrity: sha512-zQ0NYO87hyN6Xrclcqp7f8ZbXNbRfoGWNcMvHTPQp9UUrwI0mI7XBz+cu7/W6/VClYo2g63B0cjull/srU7LgQ==} dependencies: undici-types: 5.26.5 - dev: true /@types/parse-json@4.0.0: resolution: {integrity: sha512-//oorEZjL6sbPcKUaCdIGlIUeH26mgzimjBB77G6XRgnDl/L5wOnpyBGRe/Mmf5CVW3PwEBE1NjiMZ/ssFh4wA==} @@ -2629,7 +2606,6 @@ packages: dependencies: normalize-path: 3.0.0 picomatch: 2.3.1 - dev: true /argparse@2.0.1: resolution: {integrity: sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==} @@ -2844,7 +2820,6 @@ packages: /binary-extensions@2.2.0: resolution: {integrity: sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==} engines: {node: '>=8'} - dev: true /bplist-parser@0.2.0: resolution: {integrity: sha512-z0M+byMThzQmD9NILRniCUXYsYpjwnlO8N5uCFaCqIOpqRsJCrQL9NK3JsD67CN5a08nF5oIL2bD6loTdHOuKw==} @@ -2871,7 +2846,6 @@ packages: engines: {node: '>=8'} dependencies: fill-range: 7.0.1 - dev: true /browserslist@4.23.0: resolution: {integrity: sha512-QW8HiM1shhT2GuzkvklfjcKDiWFXHOeFCIA/huJPwHsslwcydgk7X+z2zXpEijP98UCY7HbubZt5J2Zgvf0CaQ==} @@ -3003,7 +2977,6 @@ packages: readdirp: 3.6.0 optionalDependencies: fsevents: 2.3.3 - dev: true /cli-cursor@4.0.0: resolution: {integrity: sha512-VGtlMu3x/4DOtIUwEkRezxUZ2lBacNJCHash0N0WeZDBS+7Ux1dm3XWAgWYxLJFMMdOeXMHXorshEFhbMSGelg==} @@ -3670,7 +3643,6 @@ packages: '@esbuild/win32-arm64': 0.20.2 '@esbuild/win32-ia32': 0.20.2 '@esbuild/win32-x64': 0.20.2 - dev: true /escalade@3.1.1: resolution: {integrity: sha512-k0er2gUkLf8O0zKJiAhmkTnJlTvINGv7ygDNPbeIsX/TJjGJZHuh9B2UxbsaEkmlEo9MfhrSzmhIlhRlI2GXnw==} @@ -4073,7 +4045,6 @@ packages: glob-parent: 5.1.2 merge2: 1.4.1 micromatch: 4.0.5 - dev: true /fast-json-stable-stringify@2.1.0: resolution: {integrity: sha512-lhd/wF+Lk98HZoTCtlVraHtfh5XYijIjalXck7saUtuanSDyLMxnHhSXEDJqHxD7msR8D0uCmqlkwjCV8xvwHw==} @@ -4092,7 +4063,6 @@ packages: resolution: {integrity: sha512-wBrocU2LCXXa+lWBt8RoIRD89Fi8OdABODa/kEnyeyjS5aZO5/GNvI5sEINADqP/h8M29UHTHUb53sUu5Ihqdw==} dependencies: reusify: 1.0.4 - dev: true /fetch-blob@3.1.5: resolution: {integrity: sha512-N64ZpKqoLejlrwkIAnb9iLSA3Vx/kjgzpcDhygcqJ2KKjky8nCgUQ+dzXtbrLaWZGZNmNfQTsiQ0weZ1svglHg==} @@ -4121,7 +4091,6 @@ packages: engines: {node: '>=8'} dependencies: to-regex-range: 5.0.1 - dev: true /find-root@1.1.0: resolution: {integrity: sha512-NKfW6bec6GfKc0SGx1e07QZY9PE99u0Bft/0rzSD5k3sO/vwkVUpDUKVm5Gpp5Ue3YfShPFTX2070tDs5kB9Ng==} @@ -4247,7 +4216,6 @@ packages: engines: {node: ^8.16.0 || ^10.6.0 || >=11.0.0} os: [darwin] requiresBuild: true - dev: true optional: true /function-bind@1.1.2: @@ -4267,6 +4235,14 @@ packages: resolution: {integrity: sha512-xckBUXyTIqT97tq2x2AMb+g163b5JFysYk0x4qxNFwbfQkmNZoiRHb6sPzI9/QV33WeuvVYBUIiD4NzNIyqaRQ==} dev: true + /generouted@1.18.5(vite@5.2.7): + resolution: {integrity: sha512-mmtOmmTLojF52jZpXZD0J+rdxI5CkQrmvWqMat1KUazrx+jtpCiDqspp+ItrNnmke2fnbdQGp/3mhqqspxqqKA==} + peerDependencies: + vite: '>=3' + dependencies: + vite: 5.2.7(@types/node@20.12.2)(sass@1.72.0) + dev: false + /gensync@1.0.0-beta.2: resolution: {integrity: sha512-3hN7NaskYvMDLQY55gnW3NQ+mesEAepTqlg+VEbj7zzqEMBVNhzcGYYeqFo/TlYz6eQiFcp1HcsCZO+nGgS8zg==} engines: {node: '>=6.9.0'} @@ -4350,7 +4326,6 @@ packages: engines: {node: '>= 6'} dependencies: is-glob: 4.0.3 - dev: true /glob-parent@6.0.2: resolution: {integrity: sha512-XxwI8EOhVQgWp6iDL+3b0r86f4d6AX6zSU55HfB4ydCEuXLXc5FcYeOu+nnGftS4TEju/11rt4KJPTMgbfmv4A==} @@ -4634,7 +4609,6 @@ packages: /immutable@4.0.0: resolution: {integrity: sha512-zIE9hX70qew5qTUjSS7wi1iwj/l7+m54KWU247nhM3v806UdGj1yDndXj+IOYxxtW9zyLI+xqFNZjTuDaLUqFw==} - dev: true /import-fresh@3.3.0: resolution: {integrity: sha512-veYYhQa+D1QBKznvhUHxb8faxlrwUnxseDAbAp457E0wLNio2bOSKnjYDhMj+YiAq61xrMGhQk9iXVk5FzgQMw==} @@ -4746,7 +4720,6 @@ packages: engines: {node: '>=8'} dependencies: binary-extensions: 2.2.0 - dev: true /is-boolean-object@1.1.2: resolution: {integrity: sha512-gDYaKHJmnj4aWxyj6YHyXVpdQawtVLHU5cb+eztPGczf6cjuTdwve5ZIEfgXqH4e57An1D1AKf8CZ3kYrQRqYA==} @@ -4799,7 +4772,6 @@ packages: /is-extglob@2.1.1: resolution: {integrity: sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ==} engines: {node: '>=0.10.0'} - dev: true /is-finalizationregistry@1.0.2: resolution: {integrity: sha512-0by5vtUJs8iFQb5TYUHHPudOR+qXYIMKtiUzvLIZITZUjknFmziyBJuLhVRc+Ds0dREFlskDNJKYIdIzu/9pfw==} @@ -4836,7 +4808,6 @@ packages: engines: {node: '>=0.10.0'} dependencies: is-extglob: 2.1.1 - dev: true /is-hexadecimal@2.0.1: resolution: {integrity: sha512-DgZQp241c8oO6cA1SbTEWiXeoxV42vlcJxgH+B3hi1AiqqKruZR3ZGF8In3fj4+/y/7rHvlOZLZtgJ/4ttYGZg==} @@ -4874,7 +4845,6 @@ packages: /is-number@7.0.0: resolution: {integrity: sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==} engines: {node: '>=0.12.0'} - dev: true /is-obj@2.0.0: resolution: {integrity: sha512-drqDG3cbczxxEJRoOXcOjtdp1J/lyp1mNn0xaznRs8+muBhgQcrnbspox5X5fOw0HnMnbfDzvnEMEtqDEJEo8w==} @@ -5414,7 +5384,6 @@ packages: /merge2@1.4.1: resolution: {integrity: sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==} engines: {node: '>= 8'} - dev: true /micromark-core-commonmark@2.0.0: resolution: {integrity: sha512-jThOz/pVmAYUtkroV3D5c1osFXAMv9e0ypGDOIZuCeAe91/sD6BoE2Sjzt30yuXtwOYUmySOhMas/PVyh02itA==} @@ -5597,7 +5566,6 @@ packages: dependencies: braces: 3.0.2 picomatch: 2.3.1 - dev: true /mime-db@1.52.0: resolution: {integrity: sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==} @@ -5680,7 +5648,6 @@ packages: resolution: {integrity: sha512-eSRppjcPIatRIMC1U6UngP8XFcz8MQWGQdt1MTBQ7NaAmvXDfvNxbvWV3x2y6CdEUciCSsDHDQZbhYaB8QEo2g==} engines: {node: ^10 || ^12 || ^13.7 || ^14 || >=15.0.1} hasBin: true - dev: true /natural-compare@1.4.0: resolution: {integrity: sha512-OWND8ei3VtNC9h7V60qff3SVobHr996CTwgxubgyQYEpg290h9J0buyECNNJexkFm5sOajh5G116RYA1c8ZMSw==} @@ -5726,7 +5693,6 @@ packages: /normalize-path@3.0.0: resolution: {integrity: sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==} engines: {node: '>=0.10.0'} - dev: true /normalize-range@0.1.2: resolution: {integrity: sha512-bdok/XvKII3nUpklnV6P2hxtMNrCboOjAcyBuQnWEhO665FwrSNRxU+AqpsyvO6LgGYPspN+lu5CLtw4jPRKNA==} @@ -5977,12 +5943,10 @@ packages: /picocolors@1.0.0: resolution: {integrity: sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==} - dev: true /picomatch@2.3.1: resolution: {integrity: sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==} engines: {node: '>=8.6'} - dev: true /pidtree@0.6.0: resolution: {integrity: sha512-eG2dWTVw5bzqGRztnHExczNxt5VGsE6OwTeCG3fdUf9KBsZzO3R5OIIIzWR+iZA0NtZ+RDVdaoE2dK1cn6jH4g==} @@ -6092,7 +6056,6 @@ packages: nanoid: 3.3.7 picocolors: 1.0.0 source-map-js: 1.2.0 - dev: true /prelude-ls@1.2.1: resolution: {integrity: sha512-vkcDPrRZo1QZLbn5RLGPpg/WmIQ65qoWWhcGKf/b5eplkkarX0m9z8ppCat4mlOqUsWpyNuYgO3VRyrYHSzX5g==} @@ -6144,7 +6107,6 @@ packages: /queue-microtask@1.2.3: resolution: {integrity: sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A==} - dev: true /react-dom@18.2.0(react@18.2.0): resolution: {integrity: sha512-6IMTriUmvsjHUjNtEDudZfuDQUoWXVxKHhlEGSk81n4YFS+r/Kl99wXiwlVXtPBtJenozv2P+hxDsw9eA7Xo6g==} @@ -6306,7 +6268,6 @@ packages: engines: {node: '>=8.10.0'} dependencies: picomatch: 2.3.1 - dev: true /recoil@0.7.7(react-dom@18.2.0)(react@18.2.0): resolution: {integrity: sha512-8Og5KPQW9LwC577Vc7Ug2P0vQshkv1y3zG3tSSkWMqkWSwHmE+by06L8JtnGocjW6gcCvfwB3YtrJG6/tWivNQ==} @@ -6440,7 +6401,6 @@ packages: /reusify@1.0.4: resolution: {integrity: sha512-U9nH88a3fc/ekCF1l0/UP1IosiuIjyTh7hBvXVMHYgVcfGvt897Xguj2UOLDeI5BG2m7/uwyaLVT6fbtCwTyzw==} engines: {iojs: '>=1.0.0', node: '>=0.10.0'} - dev: true /rfdc@1.3.0: resolution: {integrity: sha512-V2hovdzFbOi77/WajaSMXk2OLm+xNIeQdMMuB7icj7bk6zi2F8GGAxigcnDFpJHbNyNcgyJDiP+8nOrY5cZGrA==} @@ -6482,7 +6442,6 @@ packages: '@rollup/rollup-win32-ia32-msvc': 4.13.0 '@rollup/rollup-win32-x64-msvc': 4.13.0 fsevents: 2.3.3 - dev: true /run-applescript@5.0.0: resolution: {integrity: sha512-XcT5rBksx1QdIhlFOCtgZkB99ZEouFZ1E2Kc2LHqNW13U3/74YGdkQRmThTwxy4QIyookibDKYZOPqX//6BlAg==} @@ -6495,7 +6454,6 @@ packages: resolution: {integrity: sha512-5l4VyZR86LZ/lDxZTR6jqL8AFE2S0IFLMP26AbjsLVADxHdhB/c0GUsH+y39UfCi3dzz8OlQuPmnaJOMoDHQBA==} dependencies: queue-microtask: 1.2.3 - dev: true /safe-array-concat@1.0.1: resolution: {integrity: sha512-6XbUAseYE2KtOuGueyeobCySj9L4+66Tn6KQMOPQJrAJEowYKW/YR/MGJZl7FdydUdaFu4LYyDZjxf4/Nmo23Q==} @@ -6557,7 +6515,6 @@ packages: chokidar: 3.5.3 immutable: 4.0.0 source-map-js: 1.0.2 - dev: true /scheduler@0.23.0: resolution: {integrity: sha512-CtuThmgHNg7zIZWAXi3AsyIzA3n4xx7aNyjwC2VJldO2LMVDhFK+63xGqq6CsJH4rTAt6/M+N4GhZiDYPx9eUw==} @@ -6701,12 +6658,10 @@ packages: /source-map-js@1.0.2: resolution: {integrity: sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==} engines: {node: '>=0.10.0'} - dev: true /source-map-js@1.2.0: resolution: {integrity: sha512-itJW8lvSA0TXEphiRoawsCksnlf8SyvmFzIhltqAHluXd88pkCd+cXJVHTDwdCr0IzwptSm035IHQktUu1QUMg==} engines: {node: '>=0.10.0'} - dev: true /source-map@0.5.7: resolution: {integrity: sha512-LbrmJOMUSdEVxIKvdcJzQC+nQhe8FUZQTXQy6+I75skNgn3OoQ0DZA8YnFa7gp8tqtL3KPf1kmo0R5DoApeSGQ==} @@ -7072,7 +7027,6 @@ packages: engines: {node: '>=8.0'} dependencies: is-number: 7.0.0 - dev: true /tr46@0.0.3: resolution: {integrity: sha512-N3WMsuqV66lT30CrXNbEjx4GEwlow3v6rr4mCcv6prnfwhS01rkgyFdjPNBYd9br7LpXV1+Emh01fHnq2Gdgrw==} @@ -7239,7 +7193,6 @@ packages: /undici-types@5.26.5: resolution: {integrity: sha512-JlCMO+ehdEIKqlFxk6IfVoAUVmgz7cU7zD/h9XZ0qzeosSHmUJVOzSQvvYSYWXkFXC+IfLKSIffhv0sVZup6pA==} - dev: true /undici@5.28.2: resolution: {integrity: sha512-wh1pHJHnUeQV5Xa8/kyQhO7WFa8M34l026L5P/+2TYiakvGy5Rdc8jWZVyG7ieht/0WgJLEd3kcU5gKx+6GC8w==} @@ -7422,7 +7375,6 @@ packages: sass: 1.72.0 optionalDependencies: fsevents: 2.3.3 - dev: true /void-elements@3.1.0: resolution: {integrity: sha512-Dhxzh5HZuiHQhbvTW9AMetFfBHDMYpo23Uo9btPXgdYP+3T5S+p+jgNy7spra+veYhBP2dCSgxR/i2Y02h5/6w==} diff --git a/src/components/layout/layout-item.tsx b/src/components/layout/layout-item.tsx index a3daa23473..784c109a1d 100644 --- a/src/components/layout/layout-item.tsx +++ b/src/components/layout/layout-item.tsx @@ -1,8 +1,8 @@ -import { alpha, ListItem, ListItemButton, ListItemText } from "@mui/material"; -import { useMatch, useResolvedPath, useNavigate } from "react-router-dom"; -import type { LinkProps } from "react-router-dom"; - -export const LayoutItem = (props: LinkProps) => { +import { useNavigate, type Params, type Path } from "@/router"; +import type { LinkProps } from "@generouted/react-router/client"; +import { ListItem, ListItemButton, ListItemText, alpha } from "@mui/material"; +import { useMatch, useResolvedPath } from "react-router-dom"; +export const LayoutItem = (props: LinkProps) => { const { to, children } = props; const resolved = useResolvedPath(to); diff --git a/src/components/layout/page-transition.tsx b/src/components/layout/page-transition.tsx index dda9013f1e..d28e3b0fce 100644 --- a/src/components/layout/page-transition.tsx +++ b/src/components/layout/page-transition.tsx @@ -1,6 +1,8 @@ import { useVerge } from "@/hooks/use-verge"; import { classNames } from "@/utils"; import { motion, type HTMLMotionProps } from "framer-motion"; +import { useState } from "react"; +import { useOutlet } from "react-router-dom"; type Props = { children?: React.ReactNode; @@ -71,7 +73,14 @@ function overrideVariantsTransition( ); } -export default function PageTransition({ children }: Props) { +const AnimatedOutlet: React.FC = () => { + const o = useOutlet(); + const [outlet] = useState(o); + + return <>{outlet}; +}; + +export default function PageTransition() { const { verge } = useVerge(); const { theme_setting } = verge ?? {}; const variants = overrideVariantsTransition( @@ -85,12 +94,13 @@ export default function PageTransition({ children }: Props) { return ( - {children} + ); } diff --git a/src/components/profile/profile-viewer.tsx b/src/components/profile/profile-viewer.tsx index 15b48c40ef..2deaeae1b9 100644 --- a/src/components/profile/profile-viewer.tsx +++ b/src/components/profile/profile-viewer.tsx @@ -11,7 +11,6 @@ import { TextField, styled, } from "@mui/material"; -import { version } from "@root/package.json"; import { useLockFn } from "ahooks"; import { forwardRef, @@ -22,8 +21,9 @@ import { } from "react"; import { Controller, useForm } from "react-hook-form"; import { useTranslation } from "react-i18next"; -import { FileInput } from "./file-input"; +import { version } from "~/package.json"; import MDYSwitch from "../common/mdy-switch"; +import { FileInput } from "./file-input"; interface Props { onChange: () => void; diff --git a/src/components/setting/setting-verge.tsx b/src/components/setting/setting-verge.tsx index e5e2cd4ff9..bd507e85e4 100644 --- a/src/components/setting/setting-verge.tsx +++ b/src/components/setting/setting-verge.tsx @@ -21,13 +21,13 @@ import { Tooltip, Typography, } from "@mui/material"; -import { version } from "@root/package.json"; import { open } from "@tauri-apps/api/dialog"; import { relaunch } from "@tauri-apps/api/process"; import { checkUpdate } from "@tauri-apps/api/updater"; import { useAsyncEffect, useLockFn } from "ahooks"; import { useRef, useState } from "react"; import { useTranslation } from "react-i18next"; +import { version } from "~/package.json"; import MDYSwitch from "../common/mdy-switch"; import { ConfigViewer } from "./mods/config-viewer"; import { GuardState } from "./mods/guard-state"; diff --git a/src/locales/en.json b/src/locales/en.json index b438976e17..ab79eb82f5 100644 --- a/src/locales/en.json +++ b/src/locales/en.json @@ -1,10 +1,11 @@ { - "Label-Proxies": "Proxies", - "Label-Profiles": "Profiles", - "Label-Connections": "Connections", - "Label-Logs": "Logs", - "Label-Rules": "Rules", - "Label-Settings": "Settings", + "label_proxies": "Proxies", + "label_profiles": "Profiles", + "label_connections": "Connections", + "label_logs": "Logs", + "label_rules": "Rules", + "label_settings": "Settings", + "label_providers": "Providers", "Connections": "Connections", "Upload Total": "Upload Total", "Download Total": "Download Total", diff --git a/src/locales/ru.json b/src/locales/ru.json index 0ad1e882e6..9eeac2a283 100644 --- a/src/locales/ru.json +++ b/src/locales/ru.json @@ -1,10 +1,11 @@ { - "Label-Proxies": "Прокси", - "Label-Profiles": "Профили", - "Label-Connections": "Соединения", - "Label-Logs": "Логи", - "Label-Rules": "Правила", - "Label-Settings": "Настройки", + "label_proxies": "прокси", + "label_profiles": "профили", + "label_connections": "связи", + "label_logs": "журналы", + "label_rules": "правила", + "label_settings": "настройки", + "label_providers": "поставщики", "Connections": "Соединения", "Logs": "Логи", diff --git a/src/locales/zh.json b/src/locales/zh.json index 9eadc16369..ed84b973b4 100644 --- a/src/locales/zh.json +++ b/src/locales/zh.json @@ -1,11 +1,11 @@ { - "Label-Proxies": "代 理", - "Label-Profiles": "配 置", - "Label-Connections": "连 接", - "Label-Logs": "日 志", - "Label-Rules": "规 则", - "Label-Settings": "设 置", - "Label-Providers": "资 源", + "label_proxies": "代 理", + "label_profiles": "配 置", + "label_connections": "连 接", + "label_logs": "日 志", + "label_rules": "规 则", + "label_settings": "设 置", + "label_providers": "资 源", "Connections": "连接", "Upload Total": "上传总量", diff --git a/src/main.tsx b/src/main.tsx index 1e2fcfbc82..7c2ad8e4dd 100644 --- a/src/main.tsx +++ b/src/main.tsx @@ -9,29 +9,15 @@ if (!window.ResizeObserver) { import React from "react"; import { createRoot } from "react-dom/client"; -import { BrowserRouter } from "react-router-dom"; +import { Routes } from "@generouted/react-router/lazy"; import { RecoilRoot } from "recoil"; -import { BaseErrorBoundary } from "./components/base"; -import Layout from "./pages/_layout"; import "./services/i18n"; - -const mainElementId = "root"; -const container = document.getElementById(mainElementId); - -if (!container) { - throw new Error( - `No container '${mainElementId}' found to render application`, - ); -} +const container = document.getElementById("root")!; createRoot(container).render( - - - - - + , ); diff --git a/src/pages/404.tsx b/src/pages/404.tsx new file mode 100644 index 0000000000..70f7911c5d --- /dev/null +++ b/src/pages/404.tsx @@ -0,0 +1,3 @@ +export default function NotFoundPage() { + return

Not Found

; +} diff --git a/src/pages/_app.module.scss b/src/pages/_app.module.scss new file mode 100644 index 0000000000..26d29fd670 --- /dev/null +++ b/src/pages/_app.module.scss @@ -0,0 +1,10 @@ +.oops { + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; +} + +.dark { + color: bisque; +} diff --git a/src/pages/_layout.tsx b/src/pages/_app.tsx similarity index 79% rename from src/pages/_layout.tsx rename to src/pages/_app.tsx index 5273d11612..52f537180c 100644 --- a/src/pages/_layout.tsx +++ b/src/pages/_app.tsx @@ -1,6 +1,5 @@ import LogoSvg from "@/assets/image/logo.svg?react"; import { LayoutControl } from "@/components/layout/layout-control"; -import { LayoutItem } from "@/components/layout/layout-item"; import { LayoutTraffic } from "@/components/layout/layout-traffic"; import { UpdateButton } from "@/components/layout/update-button"; import { useCustomTheme } from "@/components/layout/use-custom-theme"; @@ -8,7 +7,7 @@ import { NotificationType, useNotification } from "@/hooks/use-notification"; import { useVerge } from "@/hooks/use-verge"; import { getAxios } from "@/services/api"; import getSystem from "@/utils/get-system"; -import { List, Paper, ThemeProvider, alpha } from "@mui/material"; +import { List, Paper, ThemeProvider, alpha, useTheme } from "@mui/material"; import { emit, listen } from "@tauri-apps/api/event"; import { appWindow } from "@tauri-apps/api/window"; import dayjs from "dayjs"; @@ -17,17 +16,32 @@ import "dayjs/locale/zh-cn"; import relativeTime from "dayjs/plugin/relativeTime"; import { AnimatePresence } from "framer-motion"; import i18next from "i18next"; -import React, { useEffect } from "react"; +import { useEffect } from "react"; import { useTranslation } from "react-i18next"; -import { useLocation, useNavigate, useRoutes } from "react-router-dom"; import { SWRConfig, mutate } from "swr"; -import { routers } from "./_routers"; +// import { routers } from "./_routers"; +import { LayoutItem } from "@/components/layout/layout-item"; +import PageTransition from "@/components/layout/page-transition"; +import { classNames } from "@/utils"; +import { Modals } from "@generouted/react-router/lazy"; +import { useNavigate, type Path } from "../router"; +import styles from "./_app.module.scss"; dayjs.extend(relativeTime); const OS = getSystem(); -export default function Layout() { +export const routes = { + proxies: "/proxies", + profiles: "/profiles", + connections: "/connections", + rules: "/rules", + logs: "/logs", + settings: "/settings", + providers: "/providers", +}; + +export default function App() { const { t } = useTranslation(); const { theme } = useCustomTheme(); @@ -36,9 +50,9 @@ export default function Layout() { const { theme_blur, language } = verge || {}; const navigate = useNavigate(); - const location = useLocation(); - const routes = useRoutes(routers); - if (!routes) return null; + // const location = useLocation(); + // const routes = useRoutes(routers); + // if (!routes) return null; useEffect(() => { window.addEventListener("keydown", (e) => { @@ -95,7 +109,7 @@ export default function Layout() { if (url.pathname.startsWith("//")) url.pathname = url.pathname.slice(1); switch (url.pathname) { case "/subscribe-remote-profile": - navigate("/profile", { + navigate("/profiles", { state: { subscribe: { url: url.searchParams.get("url"), @@ -166,9 +180,9 @@ export default function Layout() { - {routers.map((router) => ( - - {t(router.label)} + {Object.entries(routes).map(([name, to]) => ( + + {t(`label_${name}`)} ))} @@ -188,11 +202,30 @@ export default function Layout() {
- {React.cloneElement(routes, { key: location.pathname })} + {/* {React.cloneElement(routes, { key: location.pathname })} */} + +
); } + +export const Catch = () => { + const theme = useTheme(); + return ( +
+

Oops!

+

Something went wrong... Caught at _app error boundary

+
+ ); +}; + +export const Pending = () =>
Loading from _app...
; diff --git a/src/pages/_routers.tsx b/src/pages/_routers.tsx deleted file mode 100644 index cec355cf85..0000000000 --- a/src/pages/_routers.tsx +++ /dev/null @@ -1,57 +0,0 @@ -import { BaseErrorBoundary } from "@/components/base"; -import PageTransition from "@/components/layout/page-transition"; -import type { RouteObject } from "react-router-dom"; -import ConnectionsPage from "./connections"; -import LogsPage from "./logs"; -import ProfilesPage from "./profiles"; -import ProvidersPage from "./providers"; -import ProxiesPage from "./proxies"; -import RulesPage from "./rules"; -import SettingsPage from "./settings"; - -export const routers = ( - [ - { - label: "Label-Proxies", - path: "/", - element: , - }, - { - label: "Label-Profiles", - path: "/profile", - element: , - }, - { - label: "Label-Connections", - path: "/connections", - element: , - }, - { - label: "Label-Rules", - path: "/rules", - element: , - }, - { - label: "Label-Logs", - path: "/logs", - element: , - }, - { - label: "Label-Settings", - path: "/settings", - element: , - }, - { - label: "Label-Providers", - path: "/providers", - element: , - }, - ] satisfies Array -).map((router) => ({ - ...router, - element: ( - - {router.element} - - ), -})); diff --git a/src/router.ts b/src/router.ts new file mode 100644 index 0000000000..56f4dff4a6 --- /dev/null +++ b/src/router.ts @@ -0,0 +1,25 @@ +// Generouted, changes to this file will be overriden +/* eslint-disable */ + +import { components, hooks, utils } from "@generouted/react-router/client"; + +export type Path = + | `/connections` + | `/logs` + | `/profiles` + | `/providers` + | `/proxies` + | `/rules` + | `/settings`; + +export type Params = {}; + +export type ModalPath = never; + +export const { Link, Navigate } = components(); +export const { useModals, useNavigate, useParams } = hooks< + Path, + Params, + ModalPath +>(); +export const { redirect } = utils(); diff --git a/src/services/cmds.ts b/src/services/cmds.ts index fd882a9562..fd825604a7 100644 --- a/src/services/cmds.ts +++ b/src/services/cmds.ts @@ -1,8 +1,8 @@ import { NotificationType, useNotification } from "@/hooks/use-notification"; -import type { ManifestVersion } from "@root/scripts/generate-latest-version"; import { invoke } from "@tauri-apps/api/tauri"; import dayjs from "dayjs"; import { t } from "i18next"; +import type { ManifestVersion } from "~/scripts/generate-latest-version"; import type { IProxies } from "./api"; export async function getClashLogs() { const regex = /time="(.+?)"\s+level=(.+?)\s+msg="(.+?)"/; diff --git a/tsconfig.json b/tsconfig.json index 3425f7bbcc..b70f52bec1 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -4,9 +4,9 @@ "target": "ESNext", "useDefineForClassFields": true, "lib": ["DOM", "DOM.Iterable", "ESNext"], - "allowJs": false, + "allowJs": true, "skipLibCheck": true, - "esModuleInterop": false, + "esModuleInterop": true, "allowSyntheticDefaultImports": true, "strict": true, "forceConsistentCasingInFileNames": true, @@ -15,10 +15,10 @@ "resolveJsonModule": true, "isolatedModules": true, "noEmit": true, - "jsx": "react-jsx", + "jsx": "preserve", "paths": { "@/*": ["src/*"], - "@root/*": ["./*"], + "~/*": ["./*"], }, }, "include": ["./src"], diff --git a/vite.config.ts b/vite.config.ts index a6a87336fc..f69c836aa1 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -1,5 +1,5 @@ +import generouted from "@generouted/react-router/plugin"; import react from "@vitejs/plugin-react"; -import path from "path"; import { defineConfig } from "vite"; import monaco from "vite-plugin-monaco-editor"; import svgr from "vite-plugin-svgr"; @@ -9,24 +9,25 @@ export default defineConfig(({ command }) => { const isDev = command === "serve"; return { - root: "src", + // root: "/", server: { port: 3000 }, plugins: [ svgr(), react(), + generouted(), monaco({ languageWorkers: ["editorWorkerService", "typescript"] }), ], esbuild: { drop: isDev ? undefined : ["console", "debugger"], }, build: { - outDir: "../dist", + outDir: "dist", emptyOutDir: true, }, resolve: { alias: { - "@": path.resolve("./src"), - "@root": path.resolve("."), + "@": "/src", + "~/": "/", }, }, define: {