From 52313af043da5cd1c017de493f4398bf9d441f3f Mon Sep 17 00:00:00 2001 From: moonrailgun Date: Sat, 17 Sep 2022 23:15:56 +0800 Subject: [PATCH] =?UTF-8?q?chore:=20=E6=9B=B4=E6=96=B0react-query=E7=89=88?= =?UTF-8?q?=E6=9C=AC=E5=B9=B6=E5=A2=9E=E5=8A=A0=E5=BC=80=E5=8F=91=E5=B7=A5?= =?UTF-8?q?=E5=85=B7?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- client/shared/cache/Provider.tsx | 12 +- client/shared/cache/index.ts | 2 +- client/shared/cache/useCache.ts | 4 +- client/shared/cache/utils.ts | 2 +- client/shared/hooks/model/useUserSettings.ts | 2 +- client/shared/package.json | 3 +- pnpm-lock.yaml | 120 +++++++++---------- 7 files changed, 74 insertions(+), 71 deletions(-) diff --git a/client/shared/cache/Provider.tsx b/client/shared/cache/Provider.tsx index ec4a574b..9230362a 100644 --- a/client/shared/cache/Provider.tsx +++ b/client/shared/cache/Provider.tsx @@ -1,5 +1,7 @@ import React from 'react'; -import { QueryClientProvider } from 'react-query'; +import { QueryClientProvider } from '@tanstack/react-query'; +import { ReactQueryDevtools } from '@tanstack/react-query-devtools'; +import { isDevelopment } from '../utils/environment'; import { queryClient } from './'; /** @@ -9,6 +11,14 @@ export const CacheProvider: React.FC = React.memo((props) => { return ( {props.children} + + {/* TODO: 待放到web上 */} + {isDevelopment && ( + + )} ); }); diff --git a/client/shared/cache/index.ts b/client/shared/cache/index.ts index d3e9d3ca..17d3cf46 100644 --- a/client/shared/cache/index.ts +++ b/client/shared/cache/index.ts @@ -1,4 +1,4 @@ -import { QueryClient } from 'react-query'; +import { QueryClient } from '@tanstack/react-query'; const queryClient = new QueryClient({ defaultOptions: { diff --git a/client/shared/cache/useCache.ts b/client/shared/cache/useCache.ts index 373235ad..34ae3718 100644 --- a/client/shared/cache/useCache.ts +++ b/client/shared/cache/useCache.ts @@ -1,4 +1,4 @@ -import { useQuery } from 'react-query'; +import { useQuery, useQueryClient } from '@tanstack/react-query'; import { fetchUserInfo, getUserOnlineStatus, @@ -6,6 +6,8 @@ import { } from '../model/user'; import { isValidStr } from '../utils/string-helper'; +export { useQuery, useQueryClient }; + /** * 用户缓存 */ diff --git a/client/shared/cache/utils.ts b/client/shared/cache/utils.ts index 1ca7eda9..4d7e047b 100644 --- a/client/shared/cache/utils.ts +++ b/client/shared/cache/utils.ts @@ -1,5 +1,5 @@ /* eslint-disable @typescript-eslint/no-explicit-any */ -import type { FetchQueryOptions } from 'react-query'; +import type { FetchQueryOptions } from '@tanstack/react-query'; import { queryClient } from './'; /** diff --git a/client/shared/hooks/model/useUserSettings.ts b/client/shared/hooks/model/useUserSettings.ts index 17bdd98f..904e8ba8 100644 --- a/client/shared/hooks/model/useUserSettings.ts +++ b/client/shared/hooks/model/useUserSettings.ts @@ -1,4 +1,4 @@ -import { useQuery, useQueryClient } from 'react-query'; +import { useQuery, useQueryClient } from '../../cache/useCache'; import { getUserSettings, setUserSettings, diff --git a/client/shared/package.json b/client/shared/package.json index b9557303..1a8cab31 100644 --- a/client/shared/package.json +++ b/client/shared/package.json @@ -8,6 +8,8 @@ "private": true, "dependencies": { "@reduxjs/toolkit": "^1.7.1", + "@tanstack/react-query": "^4.3.4", + "@tanstack/react-query-devtools": "^4.3.5", "axios": "^0.21.1", "crc": "^3.8.0", "dayjs": "^1.10.6", @@ -20,7 +22,6 @@ "lodash": "^4.17.21", "react-i18next": "^11.15.1", "react-native-storage": "npm:@trpgengine/react-native-storage@^1.0.1", - "react-query": "^3.34.6", "react-redux": "^7.2.6", "regenerator-runtime": "^0.13.9", "socket.io-client": "^4.1.2", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index a918db1e..3f3a3108 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -206,6 +206,8 @@ importers: client/shared: specifiers: '@reduxjs/toolkit': ^1.7.1 + '@tanstack/react-query': ^4.3.4 + '@tanstack/react-query-devtools': ^4.3.5 '@types/crc': ^3.4.0 '@types/lodash': ^4.14.170 '@types/react': ^17.0.39 @@ -223,7 +225,6 @@ importers: react: 17.0.2 react-i18next: ^11.15.1 react-native-storage: npm:@trpgengine/react-native-storage@^1.0.1 - react-query: ^3.34.6 react-redux: ^7.2.6 regenerator-runtime: ^0.13.9 socket.io-client: ^4.1.2 @@ -231,6 +232,8 @@ importers: yup: ^0.32.9 dependencies: '@reduxjs/toolkit': 1.8.5_bjryulbxll5jujtwpu5a2wm2cy + '@tanstack/react-query': 4.3.4_react@17.0.2 + '@tanstack/react-query-devtools': 4.3.5_yaxhdf5vepihlkpjucjyrgjj3u axios: 0.21.4 crc: 3.8.0 dayjs: 1.11.5 @@ -243,7 +246,6 @@ importers: lodash: 4.17.21 react-i18next: 11.18.5_fx4b3zen7tdcdwbld3lkpcycbu react-native-storage: /@trpgengine/react-native-storage/1.0.1 - react-query: 3.39.2_react@17.0.2 react-redux: 7.2.8_react@17.0.2 regenerator-runtime: 0.13.9 socket.io-client: 4.5.1 @@ -5833,6 +5835,47 @@ packages: defer-to-connect: 2.0.1 dev: false + /@tanstack/match-sorter-utils/8.1.1: + resolution: {integrity: sha512-IdmEekEYxQsoLOR0XQyw3jD1GujBpRRYaGJYQUw1eOT1eUugWxdc7jomh1VQ1EKHcdwDLpLaCz/8y4KraU4T9A==} + engines: {node: '>=12'} + dependencies: + remove-accents: 0.4.2 + dev: false + + /@tanstack/query-core/4.3.4: + resolution: {integrity: sha512-NLAe3j5Vk1yYEtoPP5fPGPjRzkZPx67KUM3f14L3InziJZJ0wVecCh7uKfgYkbRKJSeq6PlbND7iuCGdTplN6Q==} + dev: false + + /@tanstack/react-query-devtools/4.3.5_yaxhdf5vepihlkpjucjyrgjj3u: + resolution: {integrity: sha512-Jb3HywQmvQDmyixNOzjv8xjksngguG9WjmJlBWjSBCcUFIm3GQGpeJYm62EnJmJ+lHMgDNWDr61UV7Fya8TVTA==} + peerDependencies: + '@tanstack/react-query': 4.3.4 + react: ^16.8.0 || ^17.0.0 || ^18.0.0 + react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 + dependencies: + '@tanstack/match-sorter-utils': 8.1.1 + '@tanstack/react-query': 4.3.4_react@17.0.2 + react: 17.0.2 + use-sync-external-store: 1.2.0_react@17.0.2 + dev: false + + /@tanstack/react-query/4.3.4_react@17.0.2: + resolution: {integrity: sha512-IiAo+B8bxphEpO7xwLQaCptd2rY4Ef3pW1q9J3pT66G+J/st4QpGQ+cSm9iESp9ccRy1YNUk3klk/hQtWewl6g==} + peerDependencies: + react: ^16.8.0 || ^17.0.0 || ^18.0.0 + react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 + react-native: '*' + peerDependenciesMeta: + react-dom: + optional: true + react-native: + optional: true + dependencies: + '@tanstack/query-core': 4.3.4 + react: 17.0.2 + use-sync-external-store: 1.2.0_react@17.0.2 + dev: false + /@testing-library/dom/8.17.1: resolution: {integrity: sha512-KnH2MnJUzmFNPW6RIKfd+zf2Wue8mEKX0M3cpX6aKl5ZXrJM1/c/Pc8c2xDNYQCnJO48Sm5ITbMXgqTr3h4jxQ==} engines: {node: '>=12'} @@ -8229,6 +8272,8 @@ packages: /big-integer/1.6.51: resolution: {integrity: sha512-GPEid2Y9QU1Exl1rpO9B2IPJGHPSupF5GnVIP0blYvNOMer2bTvSWs1jGOUg04hTmu67nmLsQ9TBo1puaotBHg==} engines: {node: '>=0.6'} + dev: true + optional: true /big.js/5.2.2: resolution: {integrity: sha512-vyL2OymJxmarO8gxMr0mhChsO9QGwhynfuu4+MHTAW6czfq9humCB7rKpUjDd9YUiDPU4mzpyupFSvOClAwbmQ==} @@ -8409,19 +8454,6 @@ packages: dependencies: fill-range: 7.0.1 - /broadcast-channel/3.7.0: - resolution: {integrity: sha512-cIAKJXAxGJceNZGTZSBzMxzyOn72cVgPnKx4dc6LRjQgbaJUQqhy5rzL3zbMxkMWsGKkv2hSFkPRMEXfoMZ2Mg==} - dependencies: - '@babel/runtime': 7.18.9 - detect-node: 2.1.0 - js-sha3: 0.8.0 - microseconds: 0.2.0 - nano-time: 1.0.0 - oblivious-set: 1.0.0 - rimraf: 3.0.2 - unload: 2.2.0 - dev: false - /brorand/1.1.0: resolution: {integrity: sha512-cKV8tMCEpQs4hK/ik71d6LrPOnpkpGBR0wzxqr68g2m/LB2GxVYQroAjMJZRVM1Y4BCjCKc3vAamxSzOY2RP+w==} @@ -15662,10 +15694,6 @@ packages: resolution: {integrity: sha512-HvdH2LzI/EAZcUwA8+0nKNtWHqS+ZmijLA30RwZA0bo7ToCckjK5MkGhjED9KoRcXO6BaGI3I9UIzSA1FKFPOQ==} dev: false - /js-sha3/0.8.0: - resolution: {integrity: sha512-gF1cRrHhIzNfToc802P800N8PpXS+evLLXfsVpowqmAFR9uwbi89WvXg2QspOmXL8QL86J4T1EpFu+yUkwJY3Q==} - dev: false - /js-string-escape/1.0.1: resolution: {integrity: sha512-Smw4xcfIQ5LVjAOuJCvN/zIodzA/BBSsluuoSykP+lUvScIi4U6RJLfwHet5cxFnCswUjISV8oAXaqaJDY3chg==} engines: {node: '>= 0.8'} @@ -16517,13 +16545,6 @@ packages: /markdown-escapes/1.0.4: resolution: {integrity: sha512-8z4efJYk43E0upd0NbVXwgSTQs6cT3T06etieCMEg7dRbzCbxUCK/GHlX8mhHRDcp+OLlHkPKsvqQTCvsRl2cg==} - /match-sorter/6.3.1: - resolution: {integrity: sha512-mxybbo3pPNuA+ZuCUhm5bwNkXrJTbsk5VWbR5wiwz/GC6LIiegBGn2w3O08UG/jdbYLinw51fSQ5xNU1U3MgBw==} - dependencies: - '@babel/runtime': 7.18.9 - remove-accents: 0.4.2 - dev: false - /md5.js/1.3.5: resolution: {integrity: sha512-xitP+WxNPcTTOgnTJcrhM0xvdPepipPSf3I8EIpGKeFLjt3PlJLIDG3u8EX53ZIubkb+5U2+3rELYpEhHhzdkg==} dependencies: @@ -16779,10 +16800,6 @@ packages: braces: 3.0.2 picomatch: 2.3.1 - /microseconds/0.2.0: - resolution: {integrity: sha512-n7DHHMjR1avBbSpsTBj6fmMGh2AGrifVV4e+WYc3Q9lO+xnSZ3NyhcBND3vzzatt05LFhoKFRxrIyklmLlUtyA==} - dev: false - /miller-rabin/4.0.1: resolution: {integrity: sha512-115fLhvZVqWwHPbClyntxEVfVDfl9DLLTuJvq3g2O/Oxi8AiNouAHvDSzHS0viUJc+V5vm3eq91Xwqn9dp4jRA==} hasBin: true @@ -17613,12 +17630,6 @@ packages: dev: true optional: true - /nano-time/1.0.0: - resolution: {integrity: sha512-flnngywOoQ0lLQOTRNexn2gGSNuM9bKj9RZAWSzhQ+UJYaAFG9bac4DW9VHjUAzrOaIcajHybCTHe/bkvozQqA==} - dependencies: - big-integer: 1.6.51 - dev: false - /nanoclone/0.2.1: resolution: {integrity: sha512-wynEP02LmIbLpcYw8uBKpcfF6dmg2vcpKqxeH5UcoKEYdExslsdUA4ugFauuaeYdTB76ez6gJW8XAZ6CgkXYxA==} dev: false @@ -18087,10 +18098,6 @@ packages: resolution: {integrity: sha512-eJJDYkhJFFbBBAxeh8xW+weHlkI28n2ZdQV/J/DNfWfSKlGEf2xcfAbZTv3riEXHAhL9SVOTs2pRmXiSTf78xg==} dev: true - /oblivious-set/1.0.0: - resolution: {integrity: sha512-z+pI07qxo4c2CulUHCDf9lcqDlMSo72N/4rLUpRXf6fu+q8vjt8y0xS+Tlf8NTJDdTXHbdeO1n3MlbctwEoXZw==} - dev: false - /obuf/1.1.2: resolution: {integrity: sha512-PX1wu0AmAdPqOL1mWhqmlOd8kOIZQwGZw6rh7uby9fTc5lhaOWFLX3I6R1hrF9k3zUY40e6igsLGkDXK92LJNg==} @@ -20819,24 +20826,6 @@ packages: resolution: {integrity: sha512-kzmNjIgU32mO4mmH5+iUyrqlpFQhF8K2k7eZ4fdLSOPFrD1XgEuSBv9LDEgxRXTMBqMd8ppT0x6TIzqE5pdGdw==} dev: false - /react-query/3.39.2_react@17.0.2: - resolution: {integrity: sha512-F6hYDKyNgDQfQOuR1Rsp3VRzJnWHx6aRnnIZHMNGGgbL3SBgpZTDg8MQwmxOgpCAoqZJA+JSNCydF1xGJqKOCA==} - peerDependencies: - react: ^16.8.0 || ^17.0.0 || ^18.0.0 - react-dom: '*' - react-native: '*' - peerDependenciesMeta: - react-dom: - optional: true - react-native: - optional: true - dependencies: - '@babel/runtime': 7.18.9 - broadcast-channel: 3.7.0 - match-sorter: 6.3.1 - react: 17.0.2 - dev: false - /react-reconciler/0.26.2_react@17.0.2: resolution: {integrity: sha512-nK6kgY28HwrMNwDnMui3dvm3rCFjZrcGiuwLc5COUipBK5hWHLOxMJhSnSomirqWwjPBJKV1QcbkI0VJr7Gl1Q==} engines: {node: '>=0.10.0'} @@ -24166,13 +24155,6 @@ packages: resolution: {integrity: sha512-hAZsKq7Yy11Zu1DE0OzWjw7nnLZmJZYTDZZyEFHZdUhV8FkH5MCfoU1XMaxXovpyW5nq5scPqq0ZDP9Zyl04oQ==} engines: {node: '>= 10.0.0'} - /unload/2.2.0: - resolution: {integrity: sha512-B60uB5TNBLtN6/LsgAf3udH9saB5p7gqJwcFfbOEZ8BcBHnGwCf6G/TGiEqkRAxX7zAFIUtzdrXQSdL3Q/wqNA==} - dependencies: - '@babel/runtime': 7.18.9 - detect-node: 2.1.0 - dev: false - /unpipe/1.0.0: resolution: {integrity: sha512-pjy2bYhSsufwWlKwPc+l3cN7+wuJlK6uz0YdJEOlQDbl6jo/YlPi4mb8agUkVC8BF7V8NuzeyPNqRksA3hztKQ==} engines: {node: '>= 0.8'} @@ -24416,6 +24398,14 @@ packages: use-isomorphic-layout-effect: 1.1.2_skqlhrap4das3cz5b6iqdn2lqi dev: false + /use-sync-external-store/1.2.0_react@17.0.2: + resolution: {integrity: sha512-eEgnFxGQ1Ife9bzYs6VLi8/4X6CObHMw9Qr9tPY43iKwsPw8xE8+EFsf/2cFZ5S3esXgpWgtSCtLNS41F+sKPA==} + peerDependencies: + react: ^16.8.0 || ^17.0.0 || ^18.0.0 + dependencies: + react: 17.0.2 + dev: false + /use/3.1.1: resolution: {integrity: sha512-cwESVXlO3url9YWlFW/TA9cshCEhtu7IKJ/p5soJ/gGpj7vbvFrAY/eIioQ6Dw23KjZhYgiIo8HOs1nQ2vr/oQ==} engines: {node: '>=0.10.0'}