refactor: nft queries

2026-01-12 22:53:27 +08:00 · 2023-07-26 10:11:22 +01:00
parent 1d33b07825
commit ac24e3eb96
7 changed files with 69 additions and 62 deletions
--- a/package.json
+++ b/package.json
@@ -161,10 +161,10 @@
    "@stacks/ui-utils": "7.5.0",
    "@stacks/wallet-sdk": "6.5.4",
    "@styled-system/theme-get": "5.1.2",
-    "@tanstack/query-sync-storage-persister": "4.29.19",
-    "@tanstack/react-query": "4.29.19",
-    "@tanstack/react-query-devtools": "4.29.19",
-    "@tanstack/react-query-persist-client": "4.29.19",
+    "@tanstack/query-sync-storage-persister": "4.32.0",
+    "@tanstack/react-query": "4.32.0",
+    "@tanstack/react-query-devtools": "4.32.0",
+    "@tanstack/react-query-persist-client": "4.32.0",
    "@tippyjs/react": "4.2.6",
    "@typescript-eslint/eslint-plugin": "5.60.1",
    "@vkontakte/vk-qr": "2.0.13",
@@ -247,7 +247,7 @@
    "@stacks/stacks-blockchain-api-types": "6.3.4",
    "@swc-node/jest": "1.5.6",
    "@swc/core": "1.3.32",
-    "@trivago/prettier-plugin-sort-imports": "4.1.1",
+    "@trivago/prettier-plugin-sort-imports": "4.2.0",
    "@types/argon2-browser": "1.18.1",
    "@types/chroma-js": "2.1.4",
    "@types/chrome": "0.0.236",
--- a/src/app/features/suggested-first-steps/hooks/use-suggested-first-steps.ts
+++ b/src/app/features/suggested-first-steps/hooks/use-suggested-first-steps.ts
@@ -6,7 +6,7 @@ import { SuggestedFirstStepStatus, SuggestedFirstSteps } from '@shared/models/on

 import { useGetAnchoredAccountBalanceListQuery } from '@app/query/stacks/balance/stx-balance.query';
 import { useAllAccountsNonFungibleTokenHoldingsTotal } from '@app/query/stacks/tokens/non-fungible-tokens/non-fungible-token-holdings.hooks';
-import { useGetNonFungibleTokenHoldingsQuery } from '@app/query/stacks/tokens/non-fungible-tokens/non-fungible-token-holdings.query';
+import useGetNonFungibleTokenHoldingsQuery from '@app/query/stacks/tokens/non-fungible-tokens/non-fungible-token-holdings.query';
 import {
  useCurrentStacksAccount,
  useStacksAccounts,
--- a/src/app/query/query-prefixes.ts
+++ b/src/app/query/query-prefixes.ts
@@ -13,6 +13,7 @@ export enum QueryPrefixes {
  InscriptionFromTxid = 'inscription-from-txid',
  InscriptionsFromApiInfiniteQuery = 'inscriptions-from-api-infinite-query',
  GetNftMetadata = 'get-nft-metadata',
+  GetNftHoldings = 'get-nft-holdings',

  StampCollection = 'stamp-collection',
  StampsByAddress = 'stamps-by-address',
--- a/src/app/query/stacks/tokens/non-fungible-tokens/non-fungible-token-holdings.hooks.ts
+++ b/src/app/query/stacks/tokens/non-fungible-tokens/non-fungible-token-holdings.hooks.ts
@@ -7,7 +7,9 @@ import { StacksAccount } from '@app/store/accounts/blockchain/stacks/stacks-acco
 import { useGetNonFungibleTokenHoldingsListQuery } from './non-fungible-token-holdings.query';

 export function useAllAccountsNonFungibleTokenHoldingsTotal(accounts: StacksAccount[]) {
-  const accountsNftHoldings = useGetNonFungibleTokenHoldingsListQuery(accounts);
+  const accountsNftHoldings = useGetNonFungibleTokenHoldingsListQuery(
+    accounts.map(account => account.address)
+  );

  return useMemo(
    () =>
--- a/src/app/query/stacks/tokens/non-fungible-tokens/non-fungible-token-holdings.query.ts
+++ b/src/app/query/stacks/tokens/non-fungible-tokens/non-fungible-token-holdings.query.ts
@@ -1,10 +1,10 @@
 import { useQueries, useQuery } from '@tanstack/react-query';

+import { logger } from '@shared/logger';
 import { Paginated } from '@shared/models/api-types';

-import { AppUseQueryConfig } from '@app/query/query-config';
+import { QueryPrefixes } from '@app/query/query-prefixes';
 import { StacksClient } from '@app/query/stacks/stacks-client';
-import { StacksAccount } from '@app/store/accounts/blockchain/stacks/stacks-account.models';
 import { useStacksClientUnanchored } from '@app/store/common/api-clients.hooks';
 import { useCurrentNetworkState } from '@app/store/networks/networks.hooks';

@@ -22,7 +22,7 @@ interface NonFungibleTokenHoldingListResult {
  tx_id: string;
 }

-const queryOptions = { cacheTime: staleTime, staleTime } as const;
+const queryOptions = { cacheTime: staleTime, staleTime, refetchhOnFocus: false } as const;

 type FetchNonFungibleTokenHoldingsResp = Paginated<NonFungibleTokenHoldingListResult[]>;

@@ -37,35 +37,39 @@ function fetchNonFungibleTokenHoldings(client: StacksClient, limiter: RateLimite
  };
 }

-export function useGetNonFungibleTokenHoldingsQuery<
-  T extends unknown = FetchNonFungibleTokenHoldingsResp
->(address: string, options?: AppUseQueryConfig<FetchNonFungibleTokenHoldingsResp, T>) {
+function makeNonFungibleTokenHoldingsQuery(
+  address: string,
+  network: string,
+  client: StacksClient,
+  limiter: RateLimiter
+) {
+  if (address === '') logger.warn('No address passed to ' + QueryPrefixes.GetNftHoldings);
+  return {
+    enabled: !!address,
+    queryKey: [QueryPrefixes.GetNftHoldings, address, network],
+    queryFn: () => fetchNonFungibleTokenHoldings(client, limiter)(address),
+    ...queryOptions,
+  };
+}
+
+export default function useGetNonFungibleTokenHoldingsQuery(address: string) {
  const client = useStacksClientUnanchored();
  const network = useCurrentNetworkState();
  const limiter = useHiroApiRateLimiter();

-  return useQuery({
-    enabled: !!address,
-    queryKey: ['get-nft-holdings', address, network.chain.stacks.url],
-    queryFn: () => fetchNonFungibleTokenHoldings(client, limiter)(address) as any,
-    ...queryOptions,
-    ...options,
-  });
+  return useQuery(
+    makeNonFungibleTokenHoldingsQuery(address, network.chain.stacks.url, client, limiter)
+  );
 }

-export function useGetNonFungibleTokenHoldingsListQuery<
-  T extends unknown = FetchNonFungibleTokenHoldingsResp
->(accounts: StacksAccount[], options?: AppUseQueryConfig<FetchNonFungibleTokenHoldingsResp, T>) {
+export function useGetNonFungibleTokenHoldingsListQuery(addresses: string[]) {
  const client = useStacksClientUnanchored();
  const network = useCurrentNetworkState();
  const limiter = useHiroApiRateLimiter();

  return useQueries({
-    queries: accounts.map(account => ({
-      queryKey: ['get-nft-holdings', account.address, network.chain.stacks.url],
-      queryFn: () => fetchNonFungibleTokenHoldings(client, limiter)(account.address) as any,
-      ...queryOptions,
-      ...options,
-    })),
+    queries: addresses.map(address =>
+      makeNonFungibleTokenHoldingsQuery(address, network.chain.stacks.url, client, limiter)
+    ),
  });
 }
--- a/src/app/query/stacks/tokens/non-fungible-tokens/non-fungible-token-metadata.query.ts
+++ b/src/app/query/stacks/tokens/non-fungible-tokens/non-fungible-token-metadata.query.ts
@@ -9,7 +9,7 @@ import { useTokenMetadataClient } from '@app/store/common/api-clients.hooks';
 import { RateLimiter, useHiroApiRateLimiter } from '../../rate-limiter';
 import { TokenMetadataClient } from '../../token-metadata-client';
 import { NftAssetResponse } from '../token-metadata.utils';
-import { useGetNonFungibleTokenHoldingsQuery } from './non-fungible-token-holdings.query';
+import useGetNonFungibleTokenHoldingsQuery from './non-fungible-token-holdings.query';

 const queryOptions = {
  refetchOnWindowFocus: true,
--- a/yarn.lock
+++ b/yarn.lock
@@ -5519,47 +5519,47 @@
  dependencies:
    remove-accents "0.4.2"

-"@tanstack/query-core@4.29.19":
-  version "4.29.19"
-  resolved "https://registry.yarnpkg.com/@tanstack/query-core/-/query-core-4.29.19.tgz#49ccbd0606633d1e55baf3b91ab7cc7aef411b1d"
-  integrity sha512-uPe1DukeIpIHpQi6UzIgBcXsjjsDaLnc7hF+zLBKnaUlh7jFE/A+P8t4cU4VzKPMFB/C970n/9SxtpO5hmIRgw==
+"@tanstack/query-core@4.32.0":
+  version "4.32.0"
+  resolved "https://registry.yarnpkg.com/@tanstack/query-core/-/query-core-4.32.0.tgz#e0f4a830283612430450c13badd353766423f523"
+  integrity sha512-ei4IYwL2kmlKSlCw9WgvV7PpXi0MiswVwfQRxawhJA690zWO3dU49igaQ/UMTl+Jy9jj9dK5IKAYvbX7kUvviQ==

-"@tanstack/query-persist-client-core@4.29.19":
-  version "4.29.19"
-  resolved "https://registry.yarnpkg.com/@tanstack/query-persist-client-core/-/query-persist-client-core-4.29.19.tgz#c0cd03eca74d33e5aa40c95cadd5585620ff2320"
-  integrity sha512-rr6p3xwEZCz3cEDZsj3QGePf6PG44WxRUGQVcm2JFPZOq9TkG/0i5+hQ3STiHm1Fj6qwCH8xIi62L8kG0zRj/Q==
+"@tanstack/query-persist-client-core@4.32.0":
+  version "4.32.0"
+  resolved "https://registry.yarnpkg.com/@tanstack/query-persist-client-core/-/query-persist-client-core-4.32.0.tgz#8ab8670555b777fcc7cfde0581b42d28b6164933"
+  integrity sha512-TUIArpiZJqLsYEPmg2LsZD+uJknrAHXWSaoCROFniDS0TqExe4KkjQ2gt+XTBwzxlOEN52R+l98k+oS/u94ogg==
  dependencies:
-    "@tanstack/query-core" "4.29.19"
+    "@tanstack/query-core" "4.32.0"

-"@tanstack/query-sync-storage-persister@4.29.19":
-  version "4.29.19"
-  resolved "https://registry.yarnpkg.com/@tanstack/query-sync-storage-persister/-/query-sync-storage-persister-4.29.19.tgz#292d33cdc9b38b11127f2f07b1935a73039cbba4"
-  integrity sha512-B3wDl3D3YBFTlY2yeXecEh4NEG/8Hr8pqsxnWJijRwBqvOKlqD4bUgk5kl5nbn1mShD2vnQ+yvH900/11X29Zw==
+"@tanstack/query-sync-storage-persister@4.32.0":
+  version "4.32.0"
+  resolved "https://registry.yarnpkg.com/@tanstack/query-sync-storage-persister/-/query-sync-storage-persister-4.32.0.tgz#7c33266d9e0c45eb0ec309467066c20940d57052"
+  integrity sha512-DJuHgyHmmzjamC1hjs5BB1fScqMXuk/rOYrcmSLOd3U/tceAK0PqZOJzzd2Zt0bwtJQ8hatKqks7MqiLAvAPQw==
  dependencies:
-    "@tanstack/query-persist-client-core" "4.29.19"
+    "@tanstack/query-persist-client-core" "4.32.0"

-"@tanstack/react-query-devtools@4.29.19":
-  version "4.29.19"
-  resolved "https://registry.yarnpkg.com/@tanstack/react-query-devtools/-/react-query-devtools-4.29.19.tgz#b6f337c91313388d3f04c890449005d7bb355322"
-  integrity sha512-rL2xqTPr+7gJvVGwyq8E8CWqqw950N4lZ6ffJeNX0qqymKHxHW1FM6nZaYt7Aufs/bXH0m1L9Sj3kDGQbp0rwg==
+"@tanstack/react-query-devtools@4.32.0":
+  version "4.32.0"
+  resolved "https://registry.yarnpkg.com/@tanstack/react-query-devtools/-/react-query-devtools-4.32.0.tgz#7d0ba1bcf7a7470c4f405229e212923bcc0f3323"
+  integrity sha512-rOmWqzKzRmQrQULV5Ova2FGEEPT76FZA3hz8T+LFkvp3ehw9ugSZ1BosgRJ7AFCeir+5pcNvFwILy4pDK8HpRw==
  dependencies:
    "@tanstack/match-sorter-utils" "^8.7.0"
    superjson "^1.10.0"
    use-sync-external-store "^1.2.0"

-"@tanstack/react-query-persist-client@4.29.19":
-  version "4.29.19"
-  resolved "https://registry.yarnpkg.com/@tanstack/react-query-persist-client/-/react-query-persist-client-4.29.19.tgz#27b24ec5c8983894d6f23450e2f922d07f47706f"
-  integrity sha512-LfcasTosdnI9K66HTP0Rk72Ypza3tCgrcF9bc2qFlKsBleYOYo8bz7/GiiOHj1SQH4GRQlKB+P4+/it+qlJg4g==
+"@tanstack/react-query-persist-client@4.32.0":
+  version "4.32.0"
+  resolved "https://registry.yarnpkg.com/@tanstack/react-query-persist-client/-/react-query-persist-client-4.32.0.tgz#6840a73042ca7708e793e6ec0acb1f49bc275d9a"
+  integrity sha512-2H1Fuw02uoW2U4kAexV3rmSjyOWunaWAoMgRybULu/TbEGh00c6p4yon/nQM81TAbf4M66Aa7nU0vqipY0VJXQ==
  dependencies:
-    "@tanstack/query-persist-client-core" "4.29.19"
+    "@tanstack/query-persist-client-core" "4.32.0"

-"@tanstack/react-query@4.29.19":
-  version "4.29.19"
-  resolved "https://registry.yarnpkg.com/@tanstack/react-query/-/react-query-4.29.19.tgz#6ba187f2d0ea36ae83ff1f67068f53c88ce7b228"
-  integrity sha512-XiTIOHHQ5Cw1WUlHaD4fmVUMhoWjuNJlAeJGq7eM4BraI5z7y8WkZO+NR8PSuRnQGblpuVdjClQbDFtwxTtTUw==
+"@tanstack/react-query@4.32.0":
+  version "4.32.0"
+  resolved "https://registry.yarnpkg.com/@tanstack/react-query/-/react-query-4.32.0.tgz#701b45b149cfd4b54a68705f9100973db3ba5d5d"
+  integrity sha512-B8WUMcByYAH9500ENejDCATOmEZhqjtS9wsfiQ3BNa+s+yAynY8SESI8WWHhSqUmjd0pmCSFRP6BOUGSda3QXA==
  dependencies:
-    "@tanstack/query-core" "4.29.19"
+    "@tanstack/query-core" "4.32.0"
    use-sync-external-store "^1.2.0"

 "@tippyjs/react@4.2.6", "@tippyjs/react@^4.2.4":
@@ -5579,10 +5579,10 @@
  resolved "https://registry.yarnpkg.com/@tootallnate/once/-/once-2.0.0.tgz#f544a148d3ab35801c1f633a7441fd87c2e484bf"
  integrity sha512-XCuKFP5PS55gnMVu3dty8KPatLqUoy/ZYzDzAGCQ8JNFCkLXzmI7vNHCR+XpbZaMWQK/vQubr7PkYq8g470J/A==

-"@trivago/prettier-plugin-sort-imports@4.1.1":
-  version "4.1.1"
-  resolved "https://registry.yarnpkg.com/@trivago/prettier-plugin-sort-imports/-/prettier-plugin-sort-imports-4.1.1.tgz#71c3c1ae770c3738b6fc85710714844477574ffd"
-  integrity sha512-dQ2r2uzNr1x6pJsuh/8x0IRA3CBUB+pWEW3J/7N98axqt7SQSm+2fy0FLNXvXGg77xEDC7KHxJlHfLYyi7PDcw==
+"@trivago/prettier-plugin-sort-imports@4.2.0":
+  version "4.2.0"
+  resolved "https://registry.yarnpkg.com/@trivago/prettier-plugin-sort-imports/-/prettier-plugin-sort-imports-4.2.0.tgz#b240366f9e2bda8e14edb18b14ea084e0ec25968"
+  integrity sha512-YBepjbt+ZNBVmN3ev1amQH3lWCmHyt5qTbLCp/syXJRu/Kw2koXh44qayB1gMRxcL/gV8egmjN5xWSrYyfUtyw==
  dependencies:
    "@babel/generator" "7.17.7"
    "@babel/parser" "^7.20.5"