From 0f6dd0166d0a4a770288c2159dead4e9691c9551 Mon Sep 17 00:00:00 2001 From: Alan Greene Date: Fri, 7 Oct 2022 12:00:09 +0100 Subject: [PATCH] Update React Query React Query v4 switches to a new package name, so `react-query` is now `@tanstack/react-query`. Breaking changes: - all query keys must be arrays, so for example `'properties'` is now `['properties']` - query data is read-only in the response from `useQuery` - disabled queries are 'loading' by default, need to switch to `isInitialLoading` flag to prevent blocking page in loading state in case of disabled queries, e.g. Pipeline resource on PipelineRun page when using an inline Pipeline spec as we never need to request a Pipeline resource in that case - `setLogger` removed, logger is now set as a property when defining the QueryClient Package imports and most of the key updates were achieved using the provided codemods. Some manual changes required to address the rest. Tests updated to match including fix for infrequent flake in App.test --- config_frontend/setupTests.js | 7 - package-lock.json | 384 ++++++++++-------- package.json | 3 +- src/api/index.js | 4 +- src/api/utils.js | 17 +- src/api/utils.test.js | 22 +- src/containers/App/App.js | 2 +- src/containers/App/App.test.js | 1 + .../EventListener/EventListener.stories.js | 4 +- .../ListPageLayout/ListPageLayout.stories.js | 4 +- src/containers/PipelineRun/PipelineRun.js | 2 +- src/containers/ResourceList/ResourceList.js | 2 +- src/containers/TaskRun/TaskRun.js | 2 +- .../TriggerTemplate/TriggerTemplate.js | 3 +- src/index.js | 6 +- src/utils/test.js | 7 +- 16 files changed, 262 insertions(+), 208 deletions(-) diff --git a/config_frontend/setupTests.js b/config_frontend/setupTests.js index 1c5395e927..40cf5c6cc0 100644 --- a/config_frontend/setupTests.js +++ b/config_frontend/setupTests.js @@ -11,18 +11,11 @@ See the License for the specific language governing permissions and limitations under the License. */ -import { setLogger } from 'react-query'; import fetch from 'node-fetch'; import { TextDecoder, TextEncoder } from 'util'; import { server } from './msw'; -setLogger({ - log: console.log, // eslint-disable-line no-console - warn: console.warn, // eslint-disable-line no-console - error: () => {} -}); - // Establish API mocking before all tests. beforeAll(() => server.listen({ diff --git a/package-lock.json b/package-lock.json index 880b38cc15..b49c6deca1 100644 --- a/package-lock.json +++ b/package-lock.json @@ -17,6 +17,8 @@ "@babel/runtime": "^7.19.0", "@carbon/icons-react": "^10.49.0", "@carbon/themes": "^10.55.0", + "@tanstack/react-query": "^4.10.1", + "@tanstack/react-query-devtools": "^4.10.1", "@tektoncd/dashboard-components": "*", "@tektoncd/dashboard-utils": "*", "buffer": "^6.0.3", @@ -32,7 +34,6 @@ "react-dom": "^17.0.2", "react-hot-loader": "^4.13.0", "react-intl": "^6.1.2", - "react-query": "^3.39.2", "react-router-dom": "^5.3.4", "reconnecting-websocket": "^4.4.0" }, @@ -10987,6 +10988,75 @@ "url": "https://github.com/sponsors/gregberge" } }, + "node_modules/@tanstack/match-sorter-utils": { + "version": "8.5.14", + "resolved": "https://registry.npmjs.org/@tanstack/match-sorter-utils/-/match-sorter-utils-8.5.14.tgz", + "integrity": "sha512-lVNhzTcOJ2bZ4IU+PeCPQ36vowBHvviJb2ZfdRFX5uhy7G0jM8N34zAMbmS5ZmVH8D2B7oU82OWo0e/5ZFzQrw==", + "dependencies": { + "remove-accents": "0.4.2" + }, + "engines": { + "node": ">=12" + }, + "funding": { + "type": "github", + "url": "https://github.com/sponsors/kentcdodds" + } + }, + "node_modules/@tanstack/query-core": { + "version": "4.10.1", + "resolved": "https://registry.npmjs.org/@tanstack/query-core/-/query-core-4.10.1.tgz", + "integrity": "sha512-UZRYzjgQSfYhQ+cJX0CspAbzutf8p93gR1xFjQuH3OYcb/7t3WnHkdb/qC9mbqrfWXN/JAbBTJlTU/XQHc5HbA==", + "funding": { + "type": "github", + "url": "https://github.com/sponsors/tannerlinsley" + } + }, + "node_modules/@tanstack/react-query": { + "version": "4.10.1", + "resolved": "https://registry.npmjs.org/@tanstack/react-query/-/react-query-4.10.1.tgz", + "integrity": "sha512-6GaLYAsAu/4aX6HR4krpOej9qbKWXe0X0eccikpv5hAw4CoAAPG29Pydql1nTl9cYF2zd21unVm4yApklFY0AA==", + "dependencies": { + "@tanstack/query-core": "4.10.1", + "use-sync-external-store": "^1.2.0" + }, + "funding": { + "type": "github", + "url": "https://github.com/sponsors/tannerlinsley" + }, + "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 + } + } + }, + "node_modules/@tanstack/react-query-devtools": { + "version": "4.10.1", + "resolved": "https://registry.npmjs.org/@tanstack/react-query-devtools/-/react-query-devtools-4.10.1.tgz", + "integrity": "sha512-aPsFBr9zbylnQxQoCNzPF1teN+NVGdeU1xQO515FM3gq6uISUWbqirVj/mE6HHJJpH/zi0j6HD1StD5h1XdNmg==", + "dependencies": { + "@tanstack/match-sorter-utils": "^8.1.1", + "superjson": "^1.10.0", + "use-sync-external-store": "^1.2.0" + }, + "funding": { + "type": "github", + "url": "https://github.com/sponsors/tannerlinsley" + }, + "peerDependencies": { + "@tanstack/react-query": "4.10.1", + "react": "^16.8.0 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0" + } + }, "node_modules/@tektoncd/dashboard-components": { "resolved": "packages/components", "link": true @@ -13521,7 +13591,8 @@ "node_modules/balanced-match": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz", - "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==" + "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==", + "dev": true }, "node_modules/base": { "version": "0.11.2", @@ -13619,6 +13690,8 @@ "version": "1.6.51", "resolved": "https://registry.npmjs.org/big-integer/-/big-integer-1.6.51.tgz", "integrity": "sha512-GPEid2Y9QU1Exl1rpO9B2IPJGHPSupF5GnVIP0blYvNOMer2bTvSWs1jGOUg04hTmu67nmLsQ9TBo1puaotBHg==", + "dev": true, + "optional": true, "engines": { "node": ">=0.6" } @@ -13872,6 +13945,7 @@ "version": "1.1.11", "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz", "integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==", + "dev": true, "dependencies": { "balanced-match": "^1.0.0", "concat-map": "0.0.1" @@ -13889,21 +13963,6 @@ "node": ">=8" } }, - "node_modules/broadcast-channel": { - "version": "3.7.0", - "resolved": "https://registry.npmjs.org/broadcast-channel/-/broadcast-channel-3.7.0.tgz", - "integrity": "sha512-cIAKJXAxGJceNZGTZSBzMxzyOn72cVgPnKx4dc6LRjQgbaJUQqhy5rzL3zbMxkMWsGKkv2hSFkPRMEXfoMZ2Mg==", - "dependencies": { - "@babel/runtime": "^7.7.2", - "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" - } - }, "node_modules/brorand": { "version": "1.1.0", "resolved": "https://registry.npmjs.org/brorand/-/brorand-1.1.0.tgz", @@ -15041,7 +15100,8 @@ "node_modules/concat-map": { "version": "0.0.1", "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz", - "integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s=" + "integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s=", + "dev": true }, "node_modules/concat-stream": { "version": "1.6.2", @@ -15177,6 +15237,20 @@ "integrity": "sha1-4wOogrNCzD7oylE6eZmXNNqzriw=", "dev": true }, + "node_modules/copy-anything": { + "version": "3.0.2", + "resolved": "https://registry.npmjs.org/copy-anything/-/copy-anything-3.0.2.tgz", + "integrity": "sha512-CzATjGXzUQ0EvuvgOCI6A4BGOo2bcVx8B+eC2nF862iv9fopnPQwlrbACakNCHRIJbCSBj+J/9JeDf60k64MkA==", + "dependencies": { + "is-what": "^4.1.6" + }, + "engines": { + "node": ">=12.13" + }, + "funding": { + "url": "https://github.com/sponsors/mesqueeb" + } + }, "node_modules/copy-concurrently": { "version": "1.0.5", "resolved": "https://registry.npmjs.org/copy-concurrently/-/copy-concurrently-1.0.5.tgz", @@ -16534,7 +16608,8 @@ "node_modules/detect-node": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/detect-node/-/detect-node-2.1.0.tgz", - "integrity": "sha512-T0NIuQpnTvFDATNuHN5roPwSBG83rFsuO+MXXH9/3N1eFbn4wcPjttvjMLEPWJ0RGUYgQE7cGgS3tNxbqCGM7g==" + "integrity": "sha512-T0NIuQpnTvFDATNuHN5roPwSBG83rFsuO+MXXH9/3N1eFbn4wcPjttvjMLEPWJ0RGUYgQE7cGgS3tNxbqCGM7g==", + "dev": true }, "node_modules/detect-package-manager": { "version": "2.0.1", @@ -19367,7 +19442,8 @@ "node_modules/fs.realpath": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz", - "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8=" + "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8=", + "dev": true }, "node_modules/fsevents": { "version": "2.3.2", @@ -20686,6 +20762,7 @@ "version": "1.0.6", "resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz", "integrity": "sha1-Sb1jMdfQLQwJvJEKEHW6gWW1bfk=", + "dev": true, "dependencies": { "once": "^1.3.0", "wrappy": "1" @@ -20694,7 +20771,8 @@ "node_modules/inherits": { "version": "2.0.4", "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.4.tgz", - "integrity": "sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==" + "integrity": "sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==", + "dev": true }, "node_modules/ini": { "version": "2.0.0", @@ -21458,6 +21536,17 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/is-what": { + "version": "4.1.7", + "resolved": "https://registry.npmjs.org/is-what/-/is-what-4.1.7.tgz", + "integrity": "sha512-DBVOQNiPKnGMxRMLIYSwERAS5MVY1B7xYiGnpgctsOFvVDz9f9PFXXxMcTOHuoqYp4NK9qFYQaIC1NRRxLMpBQ==", + "engines": { + "node": ">=12.13" + }, + "funding": { + "url": "https://github.com/sponsors/mesqueeb" + } + }, "node_modules/is-whitespace-character": { "version": "1.0.4", "resolved": "https://registry.npmjs.org/is-whitespace-character/-/is-whitespace-character-1.0.4.tgz", @@ -24733,11 +24822,6 @@ "integrity": "sha512-Y2/yD55y5jteOAmY50JbUZYwk3CP3wnLPEZnlR1w9oKhITrBEtAxwuWKebFf8hMrPMgbYwFoWK/lH2sBkErELw==", "dev": true }, - "node_modules/js-sha3": { - "version": "0.8.0", - "resolved": "https://registry.npmjs.org/js-sha3/-/js-sha3-0.8.0.tgz", - "integrity": "sha512-gF1cRrHhIzNfToc802P800N8PpXS+evLLXfsVpowqmAFR9uwbi89WvXg2QspOmXL8QL86J4T1EpFu+yUkwJY3Q==" - }, "node_modules/js-string-escape": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/js-string-escape/-/js-string-escape-1.0.1.tgz", @@ -25601,15 +25685,6 @@ "url": "https://github.com/sponsors/wooorm" } }, - "node_modules/match-sorter": { - "version": "6.3.1", - "resolved": "https://registry.npmjs.org/match-sorter/-/match-sorter-6.3.1.tgz", - "integrity": "sha512-mxybbo3pPNuA+ZuCUhm5bwNkXrJTbsk5VWbR5wiwz/GC6LIiegBGn2w3O08UG/jdbYLinw51fSQ5xNU1U3MgBw==", - "dependencies": { - "@babel/runtime": "^7.12.5", - "remove-accents": "0.4.2" - } - }, "node_modules/md5.js": { "version": "1.3.5", "resolved": "https://registry.npmjs.org/md5.js/-/md5.js-1.3.5.tgz", @@ -25898,11 +25973,6 @@ "node": ">=8.6" } }, - "node_modules/microseconds": { - "version": "0.2.0", - "resolved": "https://registry.npmjs.org/microseconds/-/microseconds-0.2.0.tgz", - "integrity": "sha512-n7DHHMjR1avBbSpsTBj6fmMGh2AGrifVV4e+WYc3Q9lO+xnSZ3NyhcBND3vzzatt05LFhoKFRxrIyklmLlUtyA==" - }, "node_modules/miller-rabin": { "version": "4.0.1", "resolved": "https://registry.npmjs.org/miller-rabin/-/miller-rabin-4.0.1.tgz", @@ -26069,6 +26139,7 @@ "version": "3.1.2", "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.2.tgz", "integrity": "sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==", + "dev": true, "dependencies": { "brace-expansion": "^1.1.7" }, @@ -26502,14 +26573,6 @@ "dev": true, "optional": true }, - "node_modules/nano-time": { - "version": "1.0.0", - "resolved": "https://registry.npmjs.org/nano-time/-/nano-time-1.0.0.tgz", - "integrity": "sha1-sFVPaa2J4i0JB/ehKwmTpdlhN+8=", - "dependencies": { - "big-integer": "^1.6.16" - } - }, "node_modules/nanoid": { "version": "3.3.4", "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.4.tgz", @@ -27075,11 +27138,6 @@ "integrity": "sha512-eJJDYkhJFFbBBAxeh8xW+weHlkI28n2ZdQV/J/DNfWfSKlGEf2xcfAbZTv3riEXHAhL9SVOTs2pRmXiSTf78xg==", "dev": true }, - "node_modules/oblivious-set": { - "version": "1.0.0", - "resolved": "https://registry.npmjs.org/oblivious-set/-/oblivious-set-1.0.0.tgz", - "integrity": "sha512-z+pI07qxo4c2CulUHCDf9lcqDlMSo72N/4rLUpRXf6fu+q8vjt8y0xS+Tlf8NTJDdTXHbdeO1n3MlbctwEoXZw==" - }, "node_modules/obuf": { "version": "1.1.2", "resolved": "https://registry.npmjs.org/obuf/-/obuf-1.1.2.tgz", @@ -27111,6 +27169,7 @@ "version": "1.4.0", "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz", "integrity": "sha1-WDsap3WWHUsROsF9nFC6753Xa9E=", + "dev": true, "dependencies": { "wrappy": "1" } @@ -27678,6 +27737,7 @@ "version": "1.0.1", "resolved": "https://registry.npmjs.org/path-is-absolute/-/path-is-absolute-1.0.1.tgz", "integrity": "sha1-F0uSaHNVNP+8es5r9TpanhtcX18=", + "dev": true, "engines": { "node": ">=0.10.0" } @@ -28661,31 +28721,6 @@ "resolved": "https://registry.npmjs.org/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz", "integrity": "sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA==" }, - "node_modules/react-query": { - "version": "3.39.2", - "resolved": "https://registry.npmjs.org/react-query/-/react-query-3.39.2.tgz", - "integrity": "sha512-F6hYDKyNgDQfQOuR1Rsp3VRzJnWHx6aRnnIZHMNGGgbL3SBgpZTDg8MQwmxOgpCAoqZJA+JSNCydF1xGJqKOCA==", - "dependencies": { - "@babel/runtime": "^7.5.5", - "broadcast-channel": "^3.4.1", - "match-sorter": "^6.0.2" - }, - "funding": { - "type": "github", - "url": "https://github.com/sponsors/tannerlinsley" - }, - "peerDependencies": { - "react": "^16.8.0 || ^17.0.0 || ^18.0.0" - }, - "peerDependenciesMeta": { - "react-dom": { - "optional": true - }, - "react-native": { - "optional": true - } - } - }, "node_modules/react-refresh": { "version": "0.11.0", "resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.11.0.tgz", @@ -29373,7 +29408,7 @@ "node_modules/remove-accents": { "version": "0.4.2", "resolved": "https://registry.npmjs.org/remove-accents/-/remove-accents-0.4.2.tgz", - "integrity": "sha1-CkPTqq4egNuRngeuJUsoXZ4ce7U=" + "integrity": "sha512-7pXIJqJOq5tFgG1A2Zxti3Ht8jJF337m4sowbuHsW30ZnkQFnDzy9qBNhgzX8ZLW4+UBcXiiR7SwR6pokHsxiA==" }, "node_modules/remove-trailing-separator": { "version": "1.1.0", @@ -29570,6 +29605,7 @@ "version": "3.0.2", "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-3.0.2.tgz", "integrity": "sha512-JZkJMZkAGFFPP2YqXZXPbMlMBgsxzE8ILs4lMIX/2o0L9UBw9O/Y3o6wFw/i9YLapcUJWwqbi3kdxIPdC62TIA==", + "dev": true, "dependencies": { "glob": "^7.1.3" }, @@ -29584,6 +29620,7 @@ "version": "7.2.3", "resolved": "https://registry.npmjs.org/glob/-/glob-7.2.3.tgz", "integrity": "sha512-nFR0zLpU2YCaRxwoCJvL6UvCH2JFyFVIvwTLsIf21AuHlMskA1hhTdk+LlYJtOlYt9v6dvszD2BGRqBL+iQK9Q==", + "dev": true, "dependencies": { "fs.realpath": "^1.0.0", "inflight": "^1.0.4", @@ -31403,6 +31440,17 @@ "inline-style-parser": "0.1.1" } }, + "node_modules/superjson": { + "version": "1.10.0", + "resolved": "https://registry.npmjs.org/superjson/-/superjson-1.10.0.tgz", + "integrity": "sha512-ks6I5fm5KXUbDqt4Epe1VwkKDaC9+kIj5HF7yhiHjChFne0EkFqsnTv1mdHE2IT6fq2CzLC3zeA/fw0BRIoNwA==", + "dependencies": { + "copy-anything": "^3.0.2" + }, + "engines": { + "node": ">=10" + } + }, "node_modules/supports-color": { "version": "5.5.0", "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz", @@ -32405,15 +32453,6 @@ "node": ">= 10.0.0" } }, - "node_modules/unload": { - "version": "2.2.0", - "resolved": "https://registry.npmjs.org/unload/-/unload-2.2.0.tgz", - "integrity": "sha512-B60uB5TNBLtN6/LsgAf3udH9saB5p7gqJwcFfbOEZ8BcBHnGwCf6G/TGiEqkRAxX7zAFIUtzdrXQSdL3Q/wqNA==", - "dependencies": { - "@babel/runtime": "^7.6.2", - "detect-node": "^2.0.4" - } - }, "node_modules/unpipe": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/unpipe/-/unpipe-1.0.0.tgz", @@ -32623,6 +32662,14 @@ "react-dom": ">=16.8.0" } }, + "node_modules/use-sync-external-store": { + "version": "1.2.0", + "resolved": "https://registry.npmjs.org/use-sync-external-store/-/use-sync-external-store-1.2.0.tgz", + "integrity": "sha512-eEgnFxGQ1Ife9bzYs6VLi8/4X6CObHMw9Qr9tPY43iKwsPw8xE8+EFsf/2cFZ5S3esXgpWgtSCtLNS41F+sKPA==", + "peerDependencies": { + "react": "^16.8.0 || ^17.0.0 || ^18.0.0" + } + }, "node_modules/util": { "version": "0.11.1", "resolved": "https://registry.npmjs.org/util/-/util-0.11.1.tgz", @@ -33810,7 +33857,8 @@ "node_modules/wrappy": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz", - "integrity": "sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8=" + "integrity": "sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8=", + "dev": true }, "node_modules/write-file-atomic": { "version": "3.0.3", @@ -42162,6 +42210,38 @@ "@svgr/plugin-svgo": "^6.3.1" } }, + "@tanstack/match-sorter-utils": { + "version": "8.5.14", + "resolved": "https://registry.npmjs.org/@tanstack/match-sorter-utils/-/match-sorter-utils-8.5.14.tgz", + "integrity": "sha512-lVNhzTcOJ2bZ4IU+PeCPQ36vowBHvviJb2ZfdRFX5uhy7G0jM8N34zAMbmS5ZmVH8D2B7oU82OWo0e/5ZFzQrw==", + "requires": { + "remove-accents": "0.4.2" + } + }, + "@tanstack/query-core": { + "version": "4.10.1", + "resolved": "https://registry.npmjs.org/@tanstack/query-core/-/query-core-4.10.1.tgz", + "integrity": "sha512-UZRYzjgQSfYhQ+cJX0CspAbzutf8p93gR1xFjQuH3OYcb/7t3WnHkdb/qC9mbqrfWXN/JAbBTJlTU/XQHc5HbA==" + }, + "@tanstack/react-query": { + "version": "4.10.1", + "resolved": "https://registry.npmjs.org/@tanstack/react-query/-/react-query-4.10.1.tgz", + "integrity": "sha512-6GaLYAsAu/4aX6HR4krpOej9qbKWXe0X0eccikpv5hAw4CoAAPG29Pydql1nTl9cYF2zd21unVm4yApklFY0AA==", + "requires": { + "@tanstack/query-core": "4.10.1", + "use-sync-external-store": "^1.2.0" + } + }, + "@tanstack/react-query-devtools": { + "version": "4.10.1", + "resolved": "https://registry.npmjs.org/@tanstack/react-query-devtools/-/react-query-devtools-4.10.1.tgz", + "integrity": "sha512-aPsFBr9zbylnQxQoCNzPF1teN+NVGdeU1xQO515FM3gq6uISUWbqirVj/mE6HHJJpH/zi0j6HD1StD5h1XdNmg==", + "requires": { + "@tanstack/match-sorter-utils": "^8.1.1", + "superjson": "^1.10.0", + "use-sync-external-store": "^1.2.0" + } + }, "@tektoncd/dashboard-components": { "version": "file:packages/components", "requires": { @@ -44318,7 +44398,8 @@ "balanced-match": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz", - "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==" + "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==", + "dev": true }, "base": { "version": "0.11.2", @@ -44390,7 +44471,9 @@ "big-integer": { "version": "1.6.51", "resolved": "https://registry.npmjs.org/big-integer/-/big-integer-1.6.51.tgz", - "integrity": "sha512-GPEid2Y9QU1Exl1rpO9B2IPJGHPSupF5GnVIP0blYvNOMer2bTvSWs1jGOUg04hTmu67nmLsQ9TBo1puaotBHg==" + "integrity": "sha512-GPEid2Y9QU1Exl1rpO9B2IPJGHPSupF5GnVIP0blYvNOMer2bTvSWs1jGOUg04hTmu67nmLsQ9TBo1puaotBHg==", + "dev": true, + "optional": true }, "big.js": { "version": "5.2.2", @@ -44595,6 +44678,7 @@ "version": "1.1.11", "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz", "integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==", + "dev": true, "requires": { "balanced-match": "^1.0.0", "concat-map": "0.0.1" @@ -44609,21 +44693,6 @@ "fill-range": "^7.0.1" } }, - "broadcast-channel": { - "version": "3.7.0", - "resolved": "https://registry.npmjs.org/broadcast-channel/-/broadcast-channel-3.7.0.tgz", - "integrity": "sha512-cIAKJXAxGJceNZGTZSBzMxzyOn72cVgPnKx4dc6LRjQgbaJUQqhy5rzL3zbMxkMWsGKkv2hSFkPRMEXfoMZ2Mg==", - "requires": { - "@babel/runtime": "^7.7.2", - "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" - } - }, "brorand": { "version": "1.1.0", "resolved": "https://registry.npmjs.org/brorand/-/brorand-1.1.0.tgz", @@ -45512,7 +45581,8 @@ "concat-map": { "version": "0.0.1", "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz", - "integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s=" + "integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s=", + "dev": true }, "concat-stream": { "version": "1.6.2", @@ -45623,6 +45693,14 @@ "integrity": "sha1-4wOogrNCzD7oylE6eZmXNNqzriw=", "dev": true }, + "copy-anything": { + "version": "3.0.2", + "resolved": "https://registry.npmjs.org/copy-anything/-/copy-anything-3.0.2.tgz", + "integrity": "sha512-CzATjGXzUQ0EvuvgOCI6A4BGOo2bcVx8B+eC2nF862iv9fopnPQwlrbACakNCHRIJbCSBj+J/9JeDf60k64MkA==", + "requires": { + "is-what": "^4.1.6" + } + }, "copy-concurrently": { "version": "1.0.5", "resolved": "https://registry.npmjs.org/copy-concurrently/-/copy-concurrently-1.0.5.tgz", @@ -46651,7 +46729,8 @@ "detect-node": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/detect-node/-/detect-node-2.1.0.tgz", - "integrity": "sha512-T0NIuQpnTvFDATNuHN5roPwSBG83rFsuO+MXXH9/3N1eFbn4wcPjttvjMLEPWJ0RGUYgQE7cGgS3tNxbqCGM7g==" + "integrity": "sha512-T0NIuQpnTvFDATNuHN5roPwSBG83rFsuO+MXXH9/3N1eFbn4wcPjttvjMLEPWJ0RGUYgQE7cGgS3tNxbqCGM7g==", + "dev": true }, "detect-package-manager": { "version": "2.0.1", @@ -48859,7 +48938,8 @@ "fs.realpath": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz", - "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8=" + "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8=", + "dev": true }, "fsevents": { "version": "2.3.2", @@ -49860,6 +49940,7 @@ "version": "1.0.6", "resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz", "integrity": "sha1-Sb1jMdfQLQwJvJEKEHW6gWW1bfk=", + "dev": true, "requires": { "once": "^1.3.0", "wrappy": "1" @@ -49868,7 +49949,8 @@ "inherits": { "version": "2.0.4", "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.4.tgz", - "integrity": "sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==" + "integrity": "sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==", + "dev": true }, "ini": { "version": "2.0.0", @@ -50395,6 +50477,11 @@ "call-bind": "^1.0.2" } }, + "is-what": { + "version": "4.1.7", + "resolved": "https://registry.npmjs.org/is-what/-/is-what-4.1.7.tgz", + "integrity": "sha512-DBVOQNiPKnGMxRMLIYSwERAS5MVY1B7xYiGnpgctsOFvVDz9f9PFXXxMcTOHuoqYp4NK9qFYQaIC1NRRxLMpBQ==" + }, "is-whitespace-character": { "version": "1.0.4", "resolved": "https://registry.npmjs.org/is-whitespace-character/-/is-whitespace-character-1.0.4.tgz", @@ -52928,11 +53015,6 @@ "integrity": "sha512-Y2/yD55y5jteOAmY50JbUZYwk3CP3wnLPEZnlR1w9oKhITrBEtAxwuWKebFf8hMrPMgbYwFoWK/lH2sBkErELw==", "dev": true }, - "js-sha3": { - "version": "0.8.0", - "resolved": "https://registry.npmjs.org/js-sha3/-/js-sha3-0.8.0.tgz", - "integrity": "sha512-gF1cRrHhIzNfToc802P800N8PpXS+evLLXfsVpowqmAFR9uwbi89WvXg2QspOmXL8QL86J4T1EpFu+yUkwJY3Q==" - }, "js-string-escape": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/js-string-escape/-/js-string-escape-1.0.1.tgz", @@ -53600,15 +53682,6 @@ "integrity": "sha512-8z4efJYk43E0upd0NbVXwgSTQs6cT3T06etieCMEg7dRbzCbxUCK/GHlX8mhHRDcp+OLlHkPKsvqQTCvsRl2cg==", "dev": true }, - "match-sorter": { - "version": "6.3.1", - "resolved": "https://registry.npmjs.org/match-sorter/-/match-sorter-6.3.1.tgz", - "integrity": "sha512-mxybbo3pPNuA+ZuCUhm5bwNkXrJTbsk5VWbR5wiwz/GC6LIiegBGn2w3O08UG/jdbYLinw51fSQ5xNU1U3MgBw==", - "requires": { - "@babel/runtime": "^7.12.5", - "remove-accents": "0.4.2" - } - }, "md5.js": { "version": "1.3.5", "resolved": "https://registry.npmjs.org/md5.js/-/md5.js-1.3.5.tgz", @@ -53851,11 +53924,6 @@ "picomatch": "^2.3.1" } }, - "microseconds": { - "version": "0.2.0", - "resolved": "https://registry.npmjs.org/microseconds/-/microseconds-0.2.0.tgz", - "integrity": "sha512-n7DHHMjR1avBbSpsTBj6fmMGh2AGrifVV4e+WYc3Q9lO+xnSZ3NyhcBND3vzzatt05LFhoKFRxrIyklmLlUtyA==" - }, "miller-rabin": { "version": "4.0.1", "resolved": "https://registry.npmjs.org/miller-rabin/-/miller-rabin-4.0.1.tgz", @@ -53981,6 +54049,7 @@ "version": "3.1.2", "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.2.tgz", "integrity": "sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==", + "dev": true, "requires": { "brace-expansion": "^1.1.7" } @@ -54304,14 +54373,6 @@ "dev": true, "optional": true }, - "nano-time": { - "version": "1.0.0", - "resolved": "https://registry.npmjs.org/nano-time/-/nano-time-1.0.0.tgz", - "integrity": "sha1-sFVPaa2J4i0JB/ehKwmTpdlhN+8=", - "requires": { - "big-integer": "^1.6.16" - } - }, "nanoid": { "version": "3.3.4", "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.4.tgz", @@ -54760,11 +54821,6 @@ "integrity": "sha512-eJJDYkhJFFbBBAxeh8xW+weHlkI28n2ZdQV/J/DNfWfSKlGEf2xcfAbZTv3riEXHAhL9SVOTs2pRmXiSTf78xg==", "dev": true }, - "oblivious-set": { - "version": "1.0.0", - "resolved": "https://registry.npmjs.org/oblivious-set/-/oblivious-set-1.0.0.tgz", - "integrity": "sha512-z+pI07qxo4c2CulUHCDf9lcqDlMSo72N/4rLUpRXf6fu+q8vjt8y0xS+Tlf8NTJDdTXHbdeO1n3MlbctwEoXZw==" - }, "obuf": { "version": "1.1.2", "resolved": "https://registry.npmjs.org/obuf/-/obuf-1.1.2.tgz", @@ -54790,6 +54846,7 @@ "version": "1.4.0", "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz", "integrity": "sha1-WDsap3WWHUsROsF9nFC6753Xa9E=", + "dev": true, "requires": { "wrappy": "1" } @@ -55245,7 +55302,8 @@ "path-is-absolute": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/path-is-absolute/-/path-is-absolute-1.0.1.tgz", - "integrity": "sha1-F0uSaHNVNP+8es5r9TpanhtcX18=" + "integrity": "sha1-F0uSaHNVNP+8es5r9TpanhtcX18=", + "dev": true }, "path-key": { "version": "3.1.1", @@ -55982,16 +56040,6 @@ "resolved": "https://registry.npmjs.org/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz", "integrity": "sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA==" }, - "react-query": { - "version": "3.39.2", - "resolved": "https://registry.npmjs.org/react-query/-/react-query-3.39.2.tgz", - "integrity": "sha512-F6hYDKyNgDQfQOuR1Rsp3VRzJnWHx6aRnnIZHMNGGgbL3SBgpZTDg8MQwmxOgpCAoqZJA+JSNCydF1xGJqKOCA==", - "requires": { - "@babel/runtime": "^7.5.5", - "broadcast-channel": "^3.4.1", - "match-sorter": "^6.0.2" - } - }, "react-refresh": { "version": "0.11.0", "resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.11.0.tgz", @@ -56538,7 +56586,7 @@ "remove-accents": { "version": "0.4.2", "resolved": "https://registry.npmjs.org/remove-accents/-/remove-accents-0.4.2.tgz", - "integrity": "sha1-CkPTqq4egNuRngeuJUsoXZ4ce7U=" + "integrity": "sha512-7pXIJqJOq5tFgG1A2Zxti3Ht8jJF337m4sowbuHsW30ZnkQFnDzy9qBNhgzX8ZLW4+UBcXiiR7SwR6pokHsxiA==" }, "remove-trailing-separator": { "version": "1.1.0", @@ -56694,6 +56742,7 @@ "version": "3.0.2", "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-3.0.2.tgz", "integrity": "sha512-JZkJMZkAGFFPP2YqXZXPbMlMBgsxzE8ILs4lMIX/2o0L9UBw9O/Y3o6wFw/i9YLapcUJWwqbi3kdxIPdC62TIA==", + "dev": true, "requires": { "glob": "^7.1.3" }, @@ -56702,6 +56751,7 @@ "version": "7.2.3", "resolved": "https://registry.npmjs.org/glob/-/glob-7.2.3.tgz", "integrity": "sha512-nFR0zLpU2YCaRxwoCJvL6UvCH2JFyFVIvwTLsIf21AuHlMskA1hhTdk+LlYJtOlYt9v6dvszD2BGRqBL+iQK9Q==", + "dev": true, "requires": { "fs.realpath": "^1.0.0", "inflight": "^1.0.4", @@ -58186,6 +58236,14 @@ "inline-style-parser": "0.1.1" } }, + "superjson": { + "version": "1.10.0", + "resolved": "https://registry.npmjs.org/superjson/-/superjson-1.10.0.tgz", + "integrity": "sha512-ks6I5fm5KXUbDqt4Epe1VwkKDaC9+kIj5HF7yhiHjChFne0EkFqsnTv1mdHE2IT6fq2CzLC3zeA/fw0BRIoNwA==", + "requires": { + "copy-anything": "^3.0.2" + } + }, "supports-color": { "version": "5.5.0", "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz", @@ -58954,15 +59012,6 @@ "integrity": "sha512-hAZsKq7Yy11Zu1DE0OzWjw7nnLZmJZYTDZZyEFHZdUhV8FkH5MCfoU1XMaxXovpyW5nq5scPqq0ZDP9Zyl04oQ==", "dev": true }, - "unload": { - "version": "2.2.0", - "resolved": "https://registry.npmjs.org/unload/-/unload-2.2.0.tgz", - "integrity": "sha512-B60uB5TNBLtN6/LsgAf3udH9saB5p7gqJwcFfbOEZ8BcBHnGwCf6G/TGiEqkRAxX7zAFIUtzdrXQSdL3Q/wqNA==", - "requires": { - "@babel/runtime": "^7.6.2", - "detect-node": "^2.0.4" - } - }, "unpipe": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/unpipe/-/unpipe-1.0.0.tgz", @@ -59118,6 +59167,12 @@ "resize-observer-polyfill": "^1.5.1" } }, + "use-sync-external-store": { + "version": "1.2.0", + "resolved": "https://registry.npmjs.org/use-sync-external-store/-/use-sync-external-store-1.2.0.tgz", + "integrity": "sha512-eEgnFxGQ1Ife9bzYs6VLi8/4X6CObHMw9Qr9tPY43iKwsPw8xE8+EFsf/2cFZ5S3esXgpWgtSCtLNS41F+sKPA==", + "requires": {} + }, "util": { "version": "0.11.1", "resolved": "https://registry.npmjs.org/util/-/util-0.11.1.tgz", @@ -60063,7 +60118,8 @@ "wrappy": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz", - "integrity": "sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8=" + "integrity": "sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8=", + "dev": true }, "write-file-atomic": { "version": "3.0.3", diff --git a/package.json b/package.json index 485292b50d..99f9b8d7a3 100644 --- a/package.json +++ b/package.json @@ -23,6 +23,8 @@ "@babel/runtime": "^7.19.0", "@carbon/icons-react": "^10.49.0", "@carbon/themes": "^10.55.0", + "@tanstack/react-query": "^4.10.1", + "@tanstack/react-query-devtools": "^4.10.1", "@tektoncd/dashboard-components": "*", "@tektoncd/dashboard-utils": "*", "buffer": "^6.0.3", @@ -38,7 +40,6 @@ "react-dom": "^17.0.2", "react-hot-loader": "^4.13.0", "react-intl": "^6.1.2", - "react-query": "^3.39.2", "react-router-dom": "^5.3.4", "reconnecting-websocket": "^4.4.0" }, diff --git a/src/api/index.js b/src/api/index.js index 4bc8fd47e4..76de08bcaf 100644 --- a/src/api/index.js +++ b/src/api/index.js @@ -11,7 +11,7 @@ See the License for the specific language governing permissions and limitations under the License. */ -import { useQuery } from 'react-query'; +import { useQuery } from '@tanstack/react-query'; import { labels as labelConstants } from '@tektoncd/dashboard-utils'; import { useClusterTask } from './clusterTasks'; @@ -382,7 +382,7 @@ export function useAPIResource(params) { } export function useProperties() { - return useQuery('properties', getInstallProperties, { + return useQuery(['properties'], getInstallProperties, { placeholderData: { isReadOnly: true } }); } diff --git a/src/api/utils.js b/src/api/utils.js index be0acf072c..6d896a4197 100644 --- a/src/api/utils.js +++ b/src/api/utils.js @@ -1,5 +1,5 @@ /* -Copyright 2019-2021 The Tekton Authors +Copyright 2019-2022 The Tekton Authors Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at @@ -12,7 +12,7 @@ limitations under the License. */ import React, { useContext, useEffect, useRef, useState } from 'react'; -import { useQuery, useQueryClient } from 'react-query'; +import { useQuery, useQueryClient } from '@tanstack/react-query'; import { ALL_NAMESPACES } from '@tektoncd/dashboard-utils'; import { createWebSocket, getAPIRoot } from './comms'; @@ -122,7 +122,7 @@ function getResourceVersion(resource) { } function handleCreated({ kind, payload: _, queryClient }) { - queryClient.invalidateQueries(kind); + queryClient.invalidateQueries([kind]); } function handleDeleted({ kind, payload, queryClient }) { @@ -132,7 +132,7 @@ function handleDeleted({ kind, payload, queryClient }) { // remove any matching details page cache queryClient.removeQueries([kind, { name, ...(namespace && { namespace }) }]); // remove resource from any list page caches - queryClient.setQueriesData(kind, data => { + queryClient.setQueriesData([kind], data => { if (!Array.isArray(data?.items)) { // another details page cache, but not the one we're looking for // since we've just deleted its query above @@ -159,7 +159,7 @@ function handleUpdated({ kind, payload, queryClient }) { const { metadata: { uid } } = payload; - queryClient.setQueriesData(kind, data => { + queryClient.setQueriesData([kind], data => { if (data?.metadata?.uid === uid) { // it's a details page cache (i.e. a single resource) return updateResource({ existing: data, incoming: payload }); @@ -254,12 +254,11 @@ export function useCollection({ reactQueryConfig ); + let data = []; let resourceVersion; if (query.data?.items) { resourceVersion = query.data.metadata.resourceVersion; - query.data = query.data.items; - } else { - query.data = []; + data = query.data.items; } const { isWebSocketConnected } = useWebSocket({ @@ -272,7 +271,7 @@ export function useCollection({ resourceVersion, url: webSocketURL }); - return { ...query, isWebSocketConnected }; + return { ...query, data, isWebSocketConnected }; } export function useResource({ diff --git a/src/api/utils.test.js b/src/api/utils.test.js index c00bac0174..6d56e310b6 100644 --- a/src/api/utils.test.js +++ b/src/api/utils.test.js @@ -1,5 +1,5 @@ /* -Copyright 2019-2021 The Tekton Authors +Copyright 2019-2022 The Tekton Authors Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at @@ -156,7 +156,7 @@ describe('useWebSocket', () => { const existingResource = { metadata: { uid: 'existing-id' } }; const newResource = { kind, metadata: { uid: 'new-uid' } }; - queryClient.setQueryData(kind, () => ({ + queryClient.setQueryData([kind], () => ({ items: [existingResource], metadata: {} })); @@ -178,7 +178,7 @@ describe('useWebSocket', () => { }) }); }); - expect(queryClient.invalidateQueries).toHaveBeenCalledWith(kind); + expect(queryClient.invalidateQueries).toHaveBeenCalledWith([kind]); }); it('should handle DELETED events', () => { @@ -199,7 +199,7 @@ describe('useWebSocket', () => { metadata: { name: otherName, namespace, uid: 'existing-id-3' } }; - queryClient.setQueryData(kind, () => ({ + queryClient.setQueryData([kind], () => ({ items: [resource1, resource2, resource3], metadata: {} })); @@ -224,7 +224,7 @@ describe('useWebSocket', () => { }) }); }); - expect(queryClient.getQueryData(kind)).toEqual({ + expect(queryClient.getQueryData([kind])).toEqual({ items: [resource1, resource3], metadata: {} }); @@ -256,7 +256,7 @@ describe('useWebSocket', () => { metadata: { ...existingResource.metadata, resourceVersion: '11' } }; - queryClient.setQueryData(kind, () => ({ + queryClient.setQueryData([kind], () => ({ items: [existingResource], metadata: {} })); @@ -276,7 +276,7 @@ describe('useWebSocket', () => { }) }); }); - expect(queryClient.getQueryData(kind)).toEqual({ + expect(queryClient.getQueryData([kind])).toEqual({ items: [existingResource], metadata: {} }); @@ -294,7 +294,7 @@ describe('useWebSocket', () => { }) }); }); - expect(queryClient.getQueryData(kind)).toEqual({ + expect(queryClient.getQueryData([kind])).toEqual({ items: [updatedResource], metadata: {} }); @@ -310,7 +310,7 @@ describe('useWebSocket', () => { metadata: { uid: 'existing-id' } }; - queryClient.setQueryData(kind, () => ({ + queryClient.setQueryData([kind], () => ({ items: [existingResource], metadata: {} })); @@ -328,7 +328,7 @@ describe('useWebSocket', () => { }) }); }); - expect(queryClient.getQueryData(kind)).toEqual({ + expect(queryClient.getQueryData([kind])).toEqual({ items: [existingResource], metadata: {} }); @@ -338,7 +338,7 @@ describe('useWebSocket', () => { type: 'non-message-event' }); }); - expect(queryClient.getQueryData(kind)).toEqual({ + expect(queryClient.getQueryData([kind])).toEqual({ items: [existingResource], metadata: {} }); diff --git a/src/containers/App/App.js b/src/containers/App/App.js index 0b3a405ba6..bc4e62eaa7 100644 --- a/src/containers/App/App.js +++ b/src/containers/App/App.js @@ -12,7 +12,7 @@ limitations under the License. */ import React, { useEffect, useMemo, useState } from 'react'; -import { useQuery, useQueryClient } from 'react-query'; +import { useQuery, useQueryClient } from '@tanstack/react-query'; import { hot } from 'react-hot-loader/root'; import { Link, diff --git a/src/containers/App/App.test.js b/src/containers/App/App.test.js index b5edfeabd0..74a34ebf56 100644 --- a/src/containers/App/App.test.js +++ b/src/containers/App/App.test.js @@ -34,6 +34,7 @@ describe('App', () => { const { queryAllByText, queryByText } = render(); await waitFor(() => queryByText('Tekton resources')); + await waitFor(() => queryByText('PipelineRuns')); fireEvent.click(queryAllByText('PipelineRuns')[0]); expect(queryByText('Pipelines')).toBeTruthy(); diff --git a/src/containers/EventListener/EventListener.stories.js b/src/containers/EventListener/EventListener.stories.js index cde69eedf4..862eeb5ba1 100644 --- a/src/containers/EventListener/EventListener.stories.js +++ b/src/containers/EventListener/EventListener.stories.js @@ -1,5 +1,5 @@ /* -Copyright 2019-2021 The Tekton Authors +Copyright 2019-2022 The Tekton Authors Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at @@ -12,7 +12,7 @@ limitations under the License. */ import React from 'react'; -import { QueryClient, QueryClientProvider } from 'react-query'; +import { QueryClient, QueryClientProvider } from '@tanstack/react-query'; import { createIntl } from 'react-intl'; import { EventListenerContainer } from './EventListener'; diff --git a/src/containers/ListPageLayout/ListPageLayout.stories.js b/src/containers/ListPageLayout/ListPageLayout.stories.js index e8a9fab75a..69b8829fb9 100644 --- a/src/containers/ListPageLayout/ListPageLayout.stories.js +++ b/src/containers/ListPageLayout/ListPageLayout.stories.js @@ -12,7 +12,7 @@ limitations under the License. */ import React from 'react'; -import { QueryClient, QueryClientProvider } from 'react-query'; +import { QueryClient, QueryClientProvider } from '@tanstack/react-query'; import { Table } from '@tektoncd/dashboard-components'; import ListPageLayoutContainer from './ListPageLayout'; @@ -43,7 +43,7 @@ export default { component: ListPageLayoutContainer, decorators: [ Story => { - queryClient.setQueryData('Namespace', () => ({ + queryClient.setQueryData(['Namespace'], () => ({ items: namespaces, metadata: {} })); diff --git a/src/containers/PipelineRun/PipelineRun.js b/src/containers/PipelineRun/PipelineRun.js index c5a7e73f90..d3e60c2ad2 100644 --- a/src/containers/PipelineRun/PipelineRun.js +++ b/src/containers/PipelineRun/PipelineRun.js @@ -124,7 +124,7 @@ export /* istanbul ignore next */ function PipelineRunContainer() { useClusterTasks({}); const pipelineName = pipelineRun?.spec.pipelineRef?.name; - const { data: pipeline, isLoading: isLoadingPipeline } = usePipeline( + const { data: pipeline, isInitialLoading: isLoadingPipeline } = usePipeline( { name: pipelineName, namespace }, { enabled: !!pipelineName } ); diff --git a/src/containers/ResourceList/ResourceList.js b/src/containers/ResourceList/ResourceList.js index 4733d78596..461141f9e7 100644 --- a/src/containers/ResourceList/ResourceList.js +++ b/src/containers/ResourceList/ResourceList.js @@ -49,7 +49,7 @@ export function ResourceListContainer() { const { data: resources, error: resourcesError, - isLoading: isLoadingResources + isInitialLoading: isLoadingResources } = useCustomResources( { filters, diff --git a/src/containers/TaskRun/TaskRun.js b/src/containers/TaskRun/TaskRun.js index deccd637d3..f170f0ea97 100644 --- a/src/containers/TaskRun/TaskRun.js +++ b/src/containers/TaskRun/TaskRun.js @@ -96,7 +96,7 @@ export function TaskRunContainer() { namespace }); - const { data: task, isLoading: isLoadingTask } = useTaskByKind( + const { data: task, isInitialLoading: isLoadingTask } = useTaskByKind( { kind: taskRun?.spec.taskRef?.kind, name: taskRun?.spec.taskRef?.name, diff --git a/src/containers/TriggerTemplate/TriggerTemplate.js b/src/containers/TriggerTemplate/TriggerTemplate.js index ae6dd3c141..4124cf0dbc 100644 --- a/src/containers/TriggerTemplate/TriggerTemplate.js +++ b/src/containers/TriggerTemplate/TriggerTemplate.js @@ -1,5 +1,5 @@ /* -Copyright 2019-2021 The Tekton Authors +Copyright 2019-2022 The Tekton Authors Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at @@ -126,7 +126,6 @@ export /* istanbul ignore next */ function TriggerTemplateContainer() { emptyTextAllNamespaces={emptyTextMessage} emptyTextSelectedNamespace={emptyTextMessage} /> - {resourcetemplates && ( // This is a very customised expandable table so intentionally not the one used elsewhere // although it should look the same diff --git a/src/index.js b/src/index.js index 52cd4bdc59..e371e8fa57 100644 --- a/src/index.js +++ b/src/index.js @@ -1,5 +1,5 @@ /* -Copyright 2019-2021 The Tekton Authors +Copyright 2019-2022 The Tekton Authors Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at @@ -14,8 +14,8 @@ limitations under the License. import React from 'react'; import ReactDOM from 'react-dom'; -import { QueryClient, QueryClientProvider } from 'react-query'; -import { ReactQueryDevtools } from 'react-query/devtools'; +import { QueryClient, QueryClientProvider } from '@tanstack/react-query'; +import { ReactQueryDevtools } from '@tanstack/react-query-devtools'; import './utils/polyfills'; import { getLocale, setTheme } from './utils'; diff --git a/src/utils/test.js b/src/utils/test.js index 1449b0940e..6f633bb7ec 100644 --- a/src/utils/test.js +++ b/src/utils/test.js @@ -13,7 +13,7 @@ limitations under the License. /* istanbul ignore file */ import React from 'react'; -import { QueryClient, QueryClientProvider } from 'react-query'; +import { QueryClient, QueryClientProvider } from '@tanstack/react-query'; import { render as baseRender, renderWithRouter as baseRenderWithRouter @@ -30,6 +30,11 @@ export function getQueryClient() { retry: false, staleTime: Infinity } + }, + logger: { + log: console.log, // eslint-disable-line no-console + warn: console.warn, // eslint-disable-line no-console + error: () => {} } }); }