From b515be32ca14ba30b7d4ffd790d845e492682145 Mon Sep 17 00:00:00 2001 From: sphinxrave <62570796+sphinxrave@users.noreply.github.com> Date: Wed, 18 Oct 2023 20:33:45 -0700 Subject: [PATCH 01/11] make eslint run prettier --- packages/react/.eslintrc.cjs | 3 +- packages/react/package-lock.json | 251 ++++++++++++++----------------- packages/react/package.json | 5 +- 3 files changed, 118 insertions(+), 141 deletions(-) diff --git a/packages/react/.eslintrc.cjs b/packages/react/.eslintrc.cjs index e9cdb92ec..70318acbe 100644 --- a/packages/react/.eslintrc.cjs +++ b/packages/react/.eslintrc.cjs @@ -8,7 +8,7 @@ module.exports = { "plugin:tailwindcss/recommended", "prettier", ], - plugins: ["react-refresh"], + plugins: ["react-refresh", "prettier"], settings: { tailwindcss: { whitelist: [ @@ -29,6 +29,7 @@ module.exports = { }, rules: { + "prettier/prettier": 2, // Means error "react-refresh/only-export-components": [ "warn", { allowConstantExport: true }, diff --git a/packages/react/package-lock.json b/packages/react/package-lock.json index 7277f6bf9..3770453cc 100644 --- a/packages/react/package-lock.json +++ b/packages/react/package-lock.json @@ -22,8 +22,8 @@ "@radix-ui/react-tabs": "^1.0.4", "@radix-ui/react-toast": "^1.1.5", "@react-oauth/google": "^0.11.1", - "@tanstack/react-query": "^4.36.1", - "@tanstack/react-query-devtools": "^4.36.1", + "@tanstack/react-query": "^5.0.0", + "@tanstack/react-query-devtools": "^5.0.1", "axios": "^1.5.1", "class-variance-authority": "^0.7.0", "classnames": "^2.3.2", @@ -72,6 +72,7 @@ "cross-env": "^7.0.3", "eslint": "^8.51.0", "eslint-config-prettier": "^9.0.0", + "eslint-plugin-prettier": "^5.0.1", "eslint-plugin-react-hooks": "^4.6.0", "eslint-plugin-react-refresh": "^0.4.3", "eslint-plugin-tailwindcss": "3.13.0", @@ -2451,45 +2452,38 @@ "integrity": "sha512-myfUej5naTBWnqOCc/MdVOLVjXUXtIA+NpDrDBKJtLLg2shUjBu3cZmB/85RyitKc55+lUUyl7oRfLOvkr2hsw==", "dev": true }, - "node_modules/@tanstack/match-sorter-utils": { - "version": "8.8.4", - "resolved": "https://registry.npmjs.org/@tanstack/match-sorter-utils/-/match-sorter-utils-8.8.4.tgz", - "integrity": "sha512-rKH8LjZiszWEvmi01NR72QWZ8m4xmXre0OOwlRGnjU01Eqz/QnN+cqpty2PJ0efHblq09+KilvyR7lsbzmXVEw==", - "dependencies": { - "remove-accents": "0.4.2" - }, - "engines": { - "node": ">=12" - }, + "node_modules/@tanstack/query-core": { + "version": "5.0.0", + "resolved": "https://registry.npmjs.org/@tanstack/query-core/-/query-core-5.0.0.tgz", + "integrity": "sha512-Y1BpiA6BblJd/UlVqxEVeAG7IACn568YJuTTItAiecBI7En+33g780kg+/8lhgl+BzcUPN7o+NjBrSRGJoemyQ==", "funding": { "type": "github", - "url": "https://github.com/sponsors/kentcdodds" + "url": "https://github.com/sponsors/tannerlinsley" } }, - "node_modules/@tanstack/query-core": { - "version": "4.36.1", - "resolved": "https://registry.npmjs.org/@tanstack/query-core/-/query-core-4.36.1.tgz", - "integrity": "sha512-DJSilV5+ytBP1FbFcEJovv4rnnm/CokuVvrBEtW/Va9DvuJ3HksbXUJEpI0aV1KtuL4ZoO9AVE6PyNLzF7tLeA==", + "node_modules/@tanstack/query-devtools": { + "version": "5.0.0", + "resolved": "https://registry.npmjs.org/@tanstack/query-devtools/-/query-devtools-5.0.0.tgz", + "integrity": "sha512-WATg9+nreAmtTRHzxvCFN6j4ucUVbkJNd8ErcYmf7Y6GsJw/BGscd4rWS7cdAP7zfTcPjHjGaRB041pcv8dNvA==", "funding": { "type": "github", "url": "https://github.com/sponsors/tannerlinsley" } }, "node_modules/@tanstack/react-query": { - "version": "4.36.1", - "resolved": "https://registry.npmjs.org/@tanstack/react-query/-/react-query-4.36.1.tgz", - "integrity": "sha512-y7ySVHFyyQblPl3J3eQBWpXZkliroki3ARnBKsdJchlgt7yJLRDUcf4B8soufgiYt3pEQIkBWBx1N9/ZPIeUWw==", + "version": "5.0.0", + "resolved": "https://registry.npmjs.org/@tanstack/react-query/-/react-query-5.0.0.tgz", + "integrity": "sha512-diQoC8FNBcO5Uf5yuaJlXthTtbO1xM8kzOX+pSBUMT9n/cqQ/u1wJGCtukvhDWA+6j07WmIj4bfqNbd2KOB6jQ==", "dependencies": { - "@tanstack/query-core": "4.36.1", - "use-sync-external-store": "^1.2.0" + "@tanstack/query-core": "5.0.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": "^18.0.0", + "react-dom": "^18.0.0", "react-native": "*" }, "peerDependenciesMeta": { @@ -2502,22 +2496,20 @@ } }, "node_modules/@tanstack/react-query-devtools": { - "version": "4.36.1", - "resolved": "https://registry.npmjs.org/@tanstack/react-query-devtools/-/react-query-devtools-4.36.1.tgz", - "integrity": "sha512-WYku83CKP3OevnYSG8Y/QO9g0rT75v1om5IvcWUwiUZJ4LanYGLVCZ8TdFG5jfsq4Ej/lu2wwDAULEUnRIMBSw==", + "version": "5.0.1", + "resolved": "https://registry.npmjs.org/@tanstack/react-query-devtools/-/react-query-devtools-5.0.1.tgz", + "integrity": "sha512-AM1Cx29jnryisTDLetjQB5eg46ax8th1/qADqfV/leWmKEQGCVohkT+JmpXEGQJ4X6MzJYiyoC6YQBdS82jR+w==", "dependencies": { - "@tanstack/match-sorter-utils": "^8.7.0", - "superjson": "^1.10.0", - "use-sync-external-store": "^1.2.0" + "@tanstack/query-devtools": "5.0.0" }, "funding": { "type": "github", "url": "https://github.com/sponsors/tannerlinsley" }, "peerDependencies": { - "@tanstack/react-query": "^4.36.1", - "react": "^16.8.0 || ^17.0.0 || ^18.0.0", - "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0" + "@tanstack/react-query": "^5.0.0", + "react": "^18.0.0", + "react-dom": "^18.0.0" } }, "node_modules/@types/babel__core": { @@ -4450,6 +4442,35 @@ "eslint": ">=7.0.0" } }, + "node_modules/eslint-plugin-prettier": { + "version": "5.0.1", + "resolved": "https://registry.npmjs.org/eslint-plugin-prettier/-/eslint-plugin-prettier-5.0.1.tgz", + "integrity": "sha512-m3u5RnR56asrwV/lDC4GHorlW75DsFfmUcjfCYylTUs85dBRnB7VM6xG8eCMJdeDRnppzmxZVf1GEPJvl1JmNg==", + "dev": true, + "dependencies": { + "prettier-linter-helpers": "^1.0.0", + "synckit": "^0.8.5" + }, + "engines": { + "node": "^14.18.0 || >=16.0.0" + }, + "funding": { + "url": "https://opencollective.com/prettier" + }, + "peerDependencies": { + "@types/eslint": ">=8.0.0", + "eslint": ">=8.0.0", + "prettier": ">=3.0.0" + }, + "peerDependenciesMeta": { + "@types/eslint": { + "optional": true + }, + "eslint-config-prettier": { + "optional": true + } + } + }, "node_modules/eslint-plugin-react-hooks": { "version": "4.6.0", "resolved": "https://registry.npmjs.org/eslint-plugin-react-hooks/-/eslint-plugin-react-hooks-4.6.0.tgz", @@ -4705,6 +4726,12 @@ "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz", "integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==" }, + "node_modules/fast-diff": { + "version": "1.3.0", + "resolved": "https://registry.npmjs.org/fast-diff/-/fast-diff-1.3.0.tgz", + "integrity": "sha512-VxPP4NqbUjj6MaAOafWeUn2cXWLcCtljklUtZf0Ind4XQ+QPtmA0b18zZy0jIQx+ExRVCR/ZQpBmik5lXshNsw==", + "dev": true + }, "node_modules/fast-equals": { "version": "4.0.3", "resolved": "https://registry.npmjs.org/fast-equals/-/fast-equals-4.0.3.tgz", @@ -6668,6 +6695,18 @@ "url": "https://github.com/prettier/prettier?sponsor=1" } }, + "node_modules/prettier-linter-helpers": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/prettier-linter-helpers/-/prettier-linter-helpers-1.0.0.tgz", + "integrity": "sha512-GbK2cP9nraSSUF9N2XwUwqfzlAFlMNYYl+ShE/V+H8a9uNl/oUqB1w2EL54Jh0OlyRSd8RfWYJ3coVS4TROP2w==", + "dev": true, + "dependencies": { + "fast-diff": "^1.1.2" + }, + "engines": { + "node": ">=6.0.0" + } + }, "node_modules/prop-types": { "version": "15.8.1", "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.8.1.tgz", @@ -7058,11 +7097,6 @@ "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.14.0.tgz", "integrity": "sha512-srw17NI0TUWHuGa5CFGGmhfNIeja30WMBfbslPNhf6JrqQlLN5gcrvig1oqPxiVaXb0oW0XRKtH6Nngs5lKCIA==" }, - "node_modules/remove-accents": { - "version": "0.4.2", - "resolved": "https://registry.npmjs.org/remove-accents/-/remove-accents-0.4.2.tgz", - "integrity": "sha512-7pXIJqJOq5tFgG1A2Zxti3Ht8jJF337m4sowbuHsW30ZnkQFnDzy9qBNhgzX8ZLW4+UBcXiiR7SwR6pokHsxiA==" - }, "node_modules/reserved-words": { "version": "0.1.2", "resolved": "https://registry.npmjs.org/reserved-words/-/reserved-words-0.1.2.tgz", @@ -7725,42 +7759,6 @@ "url": "https://github.com/sponsors/isaacs" } }, - "node_modules/superjson": { - "version": "1.13.3", - "resolved": "https://registry.npmjs.org/superjson/-/superjson-1.13.3.tgz", - "integrity": "sha512-mJiVjfd2vokfDxsQPOwJ/PtanO87LhpYY88ubI5dUB1Ab58Txbyje3+jpm+/83R/fevaq/107NNhtYBLuoTrFg==", - "dependencies": { - "copy-anything": "^3.0.2" - }, - "engines": { - "node": ">=10" - } - }, - "node_modules/superjson/node_modules/copy-anything": { - "version": "3.0.5", - "resolved": "https://registry.npmjs.org/copy-anything/-/copy-anything-3.0.5.tgz", - "integrity": "sha512-yCEafptTtb4bk7GLEQoM8KVJpxAfdBJYaXyzQEgQQQgYrZiDp8SJmGKlYza6CYjEDNstAdNdKA3UuoULlEbS6w==", - "dependencies": { - "is-what": "^4.1.8" - }, - "engines": { - "node": ">=12.13" - }, - "funding": { - "url": "https://github.com/sponsors/mesqueeb" - } - }, - "node_modules/superjson/node_modules/is-what": { - "version": "4.1.15", - "resolved": "https://registry.npmjs.org/is-what/-/is-what-4.1.15.tgz", - "integrity": "sha512-uKua1wfy3Yt+YqsD6mTUEa2zSi3G1oPlqTflgaPJ7z63vUGN5pxFpnQfeSLMFnJDEsdvOtkp1rUWkYjB4YfhgA==", - "engines": { - "node": ">=12.13" - }, - "funding": { - "url": "https://github.com/sponsors/mesqueeb" - } - }, "node_modules/supports-color": { "version": "5.5.0", "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz", @@ -8282,14 +8280,6 @@ } } }, - "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/usehooks-ts": { "version": "2.9.1", "resolved": "https://registry.npmjs.org/usehooks-ts/-/usehooks-ts-2.9.1.tgz", @@ -9860,36 +9850,30 @@ "integrity": "sha512-myfUej5naTBWnqOCc/MdVOLVjXUXtIA+NpDrDBKJtLLg2shUjBu3cZmB/85RyitKc55+lUUyl7oRfLOvkr2hsw==", "dev": true }, - "@tanstack/match-sorter-utils": { - "version": "8.8.4", - "resolved": "https://registry.npmjs.org/@tanstack/match-sorter-utils/-/match-sorter-utils-8.8.4.tgz", - "integrity": "sha512-rKH8LjZiszWEvmi01NR72QWZ8m4xmXre0OOwlRGnjU01Eqz/QnN+cqpty2PJ0efHblq09+KilvyR7lsbzmXVEw==", - "requires": { - "remove-accents": "0.4.2" - } - }, "@tanstack/query-core": { - "version": "4.36.1", - "resolved": "https://registry.npmjs.org/@tanstack/query-core/-/query-core-4.36.1.tgz", - "integrity": "sha512-DJSilV5+ytBP1FbFcEJovv4rnnm/CokuVvrBEtW/Va9DvuJ3HksbXUJEpI0aV1KtuL4ZoO9AVE6PyNLzF7tLeA==" + "version": "5.0.0", + "resolved": "https://registry.npmjs.org/@tanstack/query-core/-/query-core-5.0.0.tgz", + "integrity": "sha512-Y1BpiA6BblJd/UlVqxEVeAG7IACn568YJuTTItAiecBI7En+33g780kg+/8lhgl+BzcUPN7o+NjBrSRGJoemyQ==" + }, + "@tanstack/query-devtools": { + "version": "5.0.0", + "resolved": "https://registry.npmjs.org/@tanstack/query-devtools/-/query-devtools-5.0.0.tgz", + "integrity": "sha512-WATg9+nreAmtTRHzxvCFN6j4ucUVbkJNd8ErcYmf7Y6GsJw/BGscd4rWS7cdAP7zfTcPjHjGaRB041pcv8dNvA==" }, "@tanstack/react-query": { - "version": "4.36.1", - "resolved": "https://registry.npmjs.org/@tanstack/react-query/-/react-query-4.36.1.tgz", - "integrity": "sha512-y7ySVHFyyQblPl3J3eQBWpXZkliroki3ARnBKsdJchlgt7yJLRDUcf4B8soufgiYt3pEQIkBWBx1N9/ZPIeUWw==", + "version": "5.0.0", + "resolved": "https://registry.npmjs.org/@tanstack/react-query/-/react-query-5.0.0.tgz", + "integrity": "sha512-diQoC8FNBcO5Uf5yuaJlXthTtbO1xM8kzOX+pSBUMT9n/cqQ/u1wJGCtukvhDWA+6j07WmIj4bfqNbd2KOB6jQ==", "requires": { - "@tanstack/query-core": "4.36.1", - "use-sync-external-store": "^1.2.0" + "@tanstack/query-core": "5.0.0" } }, "@tanstack/react-query-devtools": { - "version": "4.36.1", - "resolved": "https://registry.npmjs.org/@tanstack/react-query-devtools/-/react-query-devtools-4.36.1.tgz", - "integrity": "sha512-WYku83CKP3OevnYSG8Y/QO9g0rT75v1om5IvcWUwiUZJ4LanYGLVCZ8TdFG5jfsq4Ej/lu2wwDAULEUnRIMBSw==", + "version": "5.0.1", + "resolved": "https://registry.npmjs.org/@tanstack/react-query-devtools/-/react-query-devtools-5.0.1.tgz", + "integrity": "sha512-AM1Cx29jnryisTDLetjQB5eg46ax8th1/qADqfV/leWmKEQGCVohkT+JmpXEGQJ4X6MzJYiyoC6YQBdS82jR+w==", "requires": { - "@tanstack/match-sorter-utils": "^8.7.0", - "superjson": "^1.10.0", - "use-sync-external-store": "^1.2.0" + "@tanstack/query-devtools": "5.0.0" } }, "@types/babel__core": { @@ -11362,6 +11346,16 @@ "dev": true, "requires": {} }, + "eslint-plugin-prettier": { + "version": "5.0.1", + "resolved": "https://registry.npmjs.org/eslint-plugin-prettier/-/eslint-plugin-prettier-5.0.1.tgz", + "integrity": "sha512-m3u5RnR56asrwV/lDC4GHorlW75DsFfmUcjfCYylTUs85dBRnB7VM6xG8eCMJdeDRnppzmxZVf1GEPJvl1JmNg==", + "dev": true, + "requires": { + "prettier-linter-helpers": "^1.0.0", + "synckit": "^0.8.5" + } + }, "eslint-plugin-react-hooks": { "version": "4.6.0", "resolved": "https://registry.npmjs.org/eslint-plugin-react-hooks/-/eslint-plugin-react-hooks-4.6.0.tgz", @@ -11471,6 +11465,12 @@ "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz", "integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==" }, + "fast-diff": { + "version": "1.3.0", + "resolved": "https://registry.npmjs.org/fast-diff/-/fast-diff-1.3.0.tgz", + "integrity": "sha512-VxPP4NqbUjj6MaAOafWeUn2cXWLcCtljklUtZf0Ind4XQ+QPtmA0b18zZy0jIQx+ExRVCR/ZQpBmik5lXshNsw==", + "dev": true + }, "fast-equals": { "version": "4.0.3", "resolved": "https://registry.npmjs.org/fast-equals/-/fast-equals-4.0.3.tgz", @@ -12791,6 +12791,15 @@ "integrity": "sha512-L/4pUDMxcNa8R/EthV08Zt42WBO4h1rarVtK0K+QJG0X187OLo7l699jWw0GKuwzkPQ//jMFA/8Xm6Fh3J/DAg==", "dev": true }, + "prettier-linter-helpers": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/prettier-linter-helpers/-/prettier-linter-helpers-1.0.0.tgz", + "integrity": "sha512-GbK2cP9nraSSUF9N2XwUwqfzlAFlMNYYl+ShE/V+H8a9uNl/oUqB1w2EL54Jh0OlyRSd8RfWYJ3coVS4TROP2w==", + "dev": true, + "requires": { + "fast-diff": "^1.1.2" + } + }, "prop-types": { "version": "15.8.1", "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.8.1.tgz", @@ -13052,11 +13061,6 @@ "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.14.0.tgz", "integrity": "sha512-srw17NI0TUWHuGa5CFGGmhfNIeja30WMBfbslPNhf6JrqQlLN5gcrvig1oqPxiVaXb0oW0XRKtH6Nngs5lKCIA==" }, - "remove-accents": { - "version": "0.4.2", - "resolved": "https://registry.npmjs.org/remove-accents/-/remove-accents-0.4.2.tgz", - "integrity": "sha512-7pXIJqJOq5tFgG1A2Zxti3Ht8jJF337m4sowbuHsW30ZnkQFnDzy9qBNhgzX8ZLW4+UBcXiiR7SwR6pokHsxiA==" - }, "reserved-words": { "version": "0.1.2", "resolved": "https://registry.npmjs.org/reserved-words/-/reserved-words-0.1.2.tgz", @@ -13531,29 +13535,6 @@ } } }, - "superjson": { - "version": "1.13.3", - "resolved": "https://registry.npmjs.org/superjson/-/superjson-1.13.3.tgz", - "integrity": "sha512-mJiVjfd2vokfDxsQPOwJ/PtanO87LhpYY88ubI5dUB1Ab58Txbyje3+jpm+/83R/fevaq/107NNhtYBLuoTrFg==", - "requires": { - "copy-anything": "^3.0.2" - }, - "dependencies": { - "copy-anything": { - "version": "3.0.5", - "resolved": "https://registry.npmjs.org/copy-anything/-/copy-anything-3.0.5.tgz", - "integrity": "sha512-yCEafptTtb4bk7GLEQoM8KVJpxAfdBJYaXyzQEgQQQgYrZiDp8SJmGKlYza6CYjEDNstAdNdKA3UuoULlEbS6w==", - "requires": { - "is-what": "^4.1.8" - } - }, - "is-what": { - "version": "4.1.15", - "resolved": "https://registry.npmjs.org/is-what/-/is-what-4.1.15.tgz", - "integrity": "sha512-uKua1wfy3Yt+YqsD6mTUEa2zSi3G1oPlqTflgaPJ7z63vUGN5pxFpnQfeSLMFnJDEsdvOtkp1rUWkYjB4YfhgA==" - } - } - }, "supports-color": { "version": "5.5.0", "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz", @@ -13898,12 +13879,6 @@ "tslib": "^2.0.0" } }, - "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": {} - }, "usehooks-ts": { "version": "2.9.1", "resolved": "https://registry.npmjs.org/usehooks-ts/-/usehooks-ts-2.9.1.tgz", diff --git a/packages/react/package.json b/packages/react/package.json index 993b2304b..b5088193a 100644 --- a/packages/react/package.json +++ b/packages/react/package.json @@ -28,8 +28,8 @@ "@radix-ui/react-tabs": "^1.0.4", "@radix-ui/react-toast": "^1.1.5", "@react-oauth/google": "^0.11.1", - "@tanstack/react-query": "^4.36.1", - "@tanstack/react-query-devtools": "^4.36.1", + "@tanstack/react-query": "^5.0.0", + "@tanstack/react-query-devtools": "^5.0.1", "axios": "^1.5.1", "class-variance-authority": "^0.7.0", "classnames": "^2.3.2", @@ -78,6 +78,7 @@ "cross-env": "^7.0.3", "eslint": "^8.51.0", "eslint-config-prettier": "^9.0.0", + "eslint-plugin-prettier": "^5.0.1", "eslint-plugin-react-hooks": "^4.6.0", "eslint-plugin-react-refresh": "^0.4.3", "eslint-plugin-tailwindcss": "3.13.0", From 6236ce1392f9e379692572ffc700293e66feeb84 Mon Sep 17 00:00:00 2001 From: sphinxrave <62570796+sphinxrave@users.noreply.github.com> Date: Wed, 18 Oct 2023 20:33:51 -0700 Subject: [PATCH 02/11] and migrate to react-query v5 --- packages/react/src/services/@types.d.ts | 4 ++ .../react/src/services/channel.service.ts | 35 +++++++----- packages/react/src/services/live.service.ts | 13 ++--- packages/react/src/services/orgs.service.ts | 14 ++--- .../react/src/services/playlist.service.ts | 57 ++++++++----------- packages/react/src/services/user.service.ts | 40 +++++++------ packages/react/src/services/video.service.ts | 21 +++---- 7 files changed, 93 insertions(+), 91 deletions(-) create mode 100644 packages/react/src/services/@types.d.ts diff --git a/packages/react/src/services/@types.d.ts b/packages/react/src/services/@types.d.ts new file mode 100644 index 000000000..db9c0db16 --- /dev/null +++ b/packages/react/src/services/@types.d.ts @@ -0,0 +1,4 @@ +interface CommonQueryConfig { + refetchInterval?: number; + enabled?: boolean; +} diff --git a/packages/react/src/services/channel.service.ts b/packages/react/src/services/channel.service.ts index 30a5d3bfe..5554b1434 100644 --- a/packages/react/src/services/channel.service.ts +++ b/packages/react/src/services/channel.service.ts @@ -1,11 +1,9 @@ import { useClient } from "@/hooks/useClient"; import { - UseInfiniteQueryOptions, UseQueryOptions, useInfiniteQuery, useQuery, } from "@tanstack/react-query"; -import { AxiosError } from "axios"; interface UseChannelsParams { limit?: number; @@ -20,31 +18,42 @@ interface UseChannelsParams { export function useChannels( params: UseChannelsParams, - config?: UseInfiniteQueryOptions, + // config: infer ) { const client = useClient(); - return useInfiniteQuery({ + return useInfiniteQuery({ queryKey: ["channels", params], queryFn: async ({ pageParam = 0 }) => await client("/api/v2/channels", { params: { ...params, offset: pageParam }, }), - getNextPageParam: (lastPage, allPages) => - lastPage.length ? allPages.flat().length : undefined, - ...config, + initialPageParam: 0, + getNextPageParam: (lastPage, _allPages, lastPageParam) => { + if (lastPage?.length === 0) { + return undefined; + } + return lastPageParam + 1; + }, + getPreviousPageParam: (_firstPage, _allPages, firstPageParam) => { + if (!firstPageParam) { + return undefined; + } + return firstPageParam - 1; + }, + // ...config, }); } export function useChannel( channelId: string, - config?: UseQueryOptions, + config?: UseQueryOptions, ) { const client = useClient(); - return useQuery( - ["channel", channelId], - async () => await client(`/api/v2/channels/${channelId}`), - config, - ); + return useQuery({ + queryKey: ["channel", channelId], + queryFn: async () => await client(`/api/v2/channels/${channelId}`), + ...config, + }); } diff --git a/packages/react/src/services/live.service.ts b/packages/react/src/services/live.service.ts index 067c8d893..d5130ebb2 100644 --- a/packages/react/src/services/live.service.ts +++ b/packages/react/src/services/live.service.ts @@ -1,6 +1,5 @@ import { useClient } from "@/hooks/useClient"; import { UseQueryOptions, useQuery } from "@tanstack/react-query"; -import { AxiosError } from "axios"; interface UseLiveParams { channel_id?: string; @@ -27,13 +26,13 @@ function listToString(list: string[] | undefined) { export function useLive( params?: UseLiveParams, - config?: UseQueryOptions, + config?: UseQueryOptions, ) { const client = useClient(); - return useQuery( - ["live", params], - async () => + return useQuery({ + queryKey: ["live", params], + queryFn: async () => await client("/api/v2/live", { params: { ...params, @@ -42,6 +41,6 @@ export function useLive( include: listToString(params?.include), }, }), - config, - ); + ...config, + }); } diff --git a/packages/react/src/services/orgs.service.ts b/packages/react/src/services/orgs.service.ts index 57e7bb4a4..1c8b2014f 100644 --- a/packages/react/src/services/orgs.service.ts +++ b/packages/react/src/services/orgs.service.ts @@ -2,18 +2,16 @@ import { defaultOrgs } from "@/store/org"; import { UseQueryOptions, useQuery } from "@tanstack/react-query"; export function useOrgs(config?: UseQueryOptions) { - return useQuery( - ["orgs"], - async () => + return useQuery({ + queryKey: ["orgs"], + queryFn: async () => fetch(`${window.location.origin}/statics/orgs.json`).then((r) => { if (!r.ok) { throw new Error(`HTTP error! Status: ${r.status}`); } return r.json(); }), - { - placeholderData: defaultOrgs, - ...config, - }, - ); + placeholderData: defaultOrgs, + ...config, + }); } diff --git a/packages/react/src/services/playlist.service.ts b/packages/react/src/services/playlist.service.ts index 4a2caf415..cd40ea40b 100644 --- a/packages/react/src/services/playlist.service.ts +++ b/packages/react/src/services/playlist.service.ts @@ -5,61 +5,52 @@ import { useMutation, useQuery, } from "@tanstack/react-query"; -import { AxiosError } from "axios"; -export function usePlaylists( - options?: UseQueryOptions, -) { +export function usePlaylists(options?: UseQueryOptions) { const client = useClient(); - return useQuery( - ["playlists"], - async () => await client("/api/v2/users/playlists"), - options, - ); + return useQuery({ + queryKey: ["playlists"], + queryFn: async () => + await client("/api/v2/users/playlists"), + ...options, + }); } -export function usePlaylist( - id: number, - options?: UseQueryOptions, -) { +export function usePlaylist(id: number, options?: UseQueryOptions) { const client = useClient(); - return useQuery( - ["playlist", id], - async () => await client(`/api/v2/playlist/${id}`), - options, - ); + return useQuery({ + queryKey: ["playlist", id], + queryFn: async () => await client(`/api/v2/playlist/${id}`), + ...options, + }); } export function usePlaylistInclude( videoId: string, - options?: UseQueryOptions, + options?: UseQueryOptions, ) { const client = useClient(); - return useQuery( - ["playlist", "include", videoId], - async () => + return useQuery({ + queryKey: ["playlist", "include", videoId], + queryFn: async () => await client(`/api/v2/video-playlist/${videoId}`), - options, - ); + ...options, + }); } export function usePlaylistVideoMutation( - options?: UseMutationOptions< - boolean, - AxiosError, - { id: number; videoId: string } - >, + options?: UseMutationOptions, ) { const client = useClient(); - return useMutation( - async ({ id, videoId }) => + return useMutation({ + mutationFn: async ({ id, videoId }) => await client(`/api/v2/video-playlist/${id}/${videoId}`, { method: "PUT", }), - options, - ); + ...options, + }); } diff --git a/packages/react/src/services/user.service.ts b/packages/react/src/services/user.service.ts index 560586739..313e93d83 100644 --- a/packages/react/src/services/user.service.ts +++ b/packages/react/src/services/user.service.ts @@ -2,25 +2,30 @@ import { useClient } from "@/hooks/useClient"; import { UseMutationOptions, UseQueryOptions, + queryOptions, useMutation, useQuery, useQueryClient, } from "@tanstack/react-query"; import { AxiosError } from "axios"; -export function useFavorites( - config?: UseQueryOptions, -) { +// if you're curious: https://tanstack.com/query/latest/docs/react/typescript#typing-query-options +const favoriteQuery = queryOptions({ + queryKey: ["user", "favorites"], +}); + +export function useFavorites(config?: UseQueryOptions) { const client = useClient(); - return useQuery( - ["user", "favorites"], - async () => + return useQuery({ + queryKey: favoriteQuery.queryKey, + queryFn: async () => client.loggedIn ? await client("/api/v2/users/favorites") : [], - config, - ); + + ...config, + }); } interface FavoriteMutationPayload { @@ -31,25 +36,24 @@ interface FavoriteMutationPayload { export function useFavoriteMutation( config?: UseMutationOptions< FavoriteChannel[], - AxiosError, + Error, FavoriteMutationPayload[] >, ) { const queryClient = useQueryClient(); const client = useClient(); - return useMutation( - async (payload) => + return useMutation({ + mutationFn: async (payload) => await client.patch( "/api/v2/users/favorites", payload, ), - { - ...config, - onSuccess: (res, ...args) => { - queryClient.setQueryData(["user", "favorites"], res); - if (config?.onSuccess) config?.onSuccess(res, ...args); - }, + + ...config, + onSuccess: (res, ...args) => { + queryClient.setQueryData(favoriteQuery.queryKey, res); + if (config?.onSuccess) config?.onSuccess(res, ...args); }, - ); + }); } diff --git a/packages/react/src/services/video.service.ts b/packages/react/src/services/video.service.ts index 71ba149c9..6d1528e9a 100644 --- a/packages/react/src/services/video.service.ts +++ b/packages/react/src/services/video.service.ts @@ -5,7 +5,6 @@ import { useInfiniteQuery, useQuery, } from "@tanstack/react-query"; -import { AxiosError } from "axios"; interface UseVideosParams { channel_id?: string; @@ -29,12 +28,13 @@ interface UseVideosParams { export function useVideos( params?: Omit, - config?: UseInfiniteQueryOptions, + config?: CommonQueryConfig, ) { const client = useClient(); - return useInfiniteQuery({ + return useInfiniteQuery({ queryKey: ["videos", params], + initialPageParam: 0, queryFn: async ({ pageParam = 0 }) => ( await client<{ items: VideoBase[]; total: string }>("/videos", { @@ -47,15 +47,12 @@ export function useVideos( }); } -export function useVideo( - videoId: string, - config?: UseQueryOptions, -) { +export function useVideo(videoId: string, config?: UseQueryOptions