feat: upgrade api layer #1910

He1DAr · 2024-11-15T14:42:48Z

What type of PR is this? (check all applicable)

Description

@stacks/blockchain-api-client no longer exports API call wrappers, we need to upgrade to latest stacks API JS client replace all API calls across Explorer.
https://github.com/hirosystems/stacks-blockchain-api/blob/HEAD/client/MIGRATION.md

Issue ticket number and link

closes #1896

Checklist:

I have performed a self-review of my code.
I have tested the change on desktop and mobile.
I have added thorough tests where applicable.
I've added analytics and error logging where applicable.

Screenshots (if appropriate):

N/A

vercel · 2024-11-15T14:42:52Z

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
explorer-storybook	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Nov 22, 2024 6:29pm
hiro-explorer	❌ Failed (Inspect)			Nov 22, 2024 6:29pm

codecov · 2024-11-18T19:05:19Z

Codecov Report

Attention: Patch coverage is 15.82278% with 266 lines in your changes missing coverage. Please review.

Files with missing lines	Patch %	Lines
src/features/txsFilterAndSort/SortMenu.tsx	14.28%	24 Missing ⚠️
...ies/useAddressConfirmedTxsWithTransfersInfinite.ts	0.00%	15 Missing and 2 partials ⚠️
src/common/queries/useSearchQuery.ts	15.78%	15 Missing and 1 partial ⚠️
src/common/queries/useBlocksByBurnBlock.ts	13.33%	10 Missing and 3 partials ⚠️
...common/queries/useConfirmedTransactionsInfinite.ts	0.00%	13 Missing ⚠️
src/common/queries/useBlockTxsInfinite.ts	0.00%	10 Missing and 2 partials ⚠️
src/common/queries/useBurnBlock.ts	14.28%	9 Missing and 3 partials ⚠️
src/common/queries/useAccountBalance.ts	0.00%	11 Missing ⚠️
src/common/queries/useBlockByHash.ts	0.00%	9 Missing and 2 partials ⚠️
src/common/queries/useContractById.ts	0.00%	8 Missing and 3 partials ⚠️
... and 28 more

📢 Thoughts on this report? Let us know!

BLuEScioN · 2024-11-20T17:59:30Z

src/app/_components/BlockList/data/useBlocksPageUngroupedInitialBlockList.ts

-      combine: (response: UseQueryResult<NakamotoBlockListResponse, Error>[]) => {
-        const result = response.flatMap(data => data.data?.results || []);
-        return result;
+      combine: (response: UseQueryResult<any, Error>[]) => {


I don;t like using any here

BLuEScioN · 2024-11-20T18:02:13Z

src/app/transactions/MempoolFeePieChart.tsx

-    smart_contract: number;
-    contract_call: number;
-  };
+  filteredTxTypeCounts: Record<string, number>;


Did we lose types here?

BLuEScioN · 2024-11-20T18:04:03Z

src/app/transactions/MempoolFeeStats.tsx

@@ -239,7 +240,7 @@ export function MempoolFeeStats({ tokenPrice }: { tokenPrice: TokenPrice }) {
          </Flex>
          <VStack gap={3} alignItems="flex-start">
            {Object.entries(filteredTxTypeCounts).map(([key, value]) => {
-              const icon = getTxTypeIcon(key as keyof typeof filteredTxTypeCounts);
+              const icon = getTxTypeIcon(key as any);


BLuEScioN · 2024-11-20T18:16:50Z

src/common/components/FilterMenu.tsx

@@ -13,11 +13,11 @@ import { MenuList } from '../../ui/MenuList';

 interface MenuItem {
  onClick: () => void;
-  label: string;
+  label: string | undefined;


How can a menu item not have a label? Wouldn't that make it invisible/empty?

BLuEScioN · 2024-11-20T18:18:27Z

src/common/queries/useAccountBalance.ts

  return useQuery({
    queryKey: [ACCOUNT_BALANCE_QUERY_KEY, address],
-    queryFn: () => {
+    queryFn: async () => {
      if (!address) return undefined;


not needed because of enabled prop

BLuEScioN · 2024-11-20T18:23:23Z

src/common/queries/useAccountBalance.ts

      });
-      return response;
+      if (error) {


Have we made sure all these errors are caught properly. I think it would be a great idea to use the logError util func that will log this error in sentry. I would probably add the aility to rethrow the error to that func. And perhaps we can create a util function to do all this when making these apiclient requests so that we don't need to do this in every api hook. This comment equally applies to all these hooks. Hopefully it will make it easier if I don't bog down your PR by repeating the same comment :)

BLuEScioN · 2024-11-20T18:24:14Z

src/common/queries/useAccountBalance.ts

    },
    staleTime: ONE_MINUTE,
-    ...options,
+    refetchOnWindowFocus: true,


let's add a comment here why this is always set to true, such as we want the ui to always try to update the principal balance.

BLuEScioN · 2024-11-20T18:55:17Z

src/common/queries/useAddressConfirmedTxsWithTransfersInfinite.ts

-      }),
+    queryKey: [ADDRESS_CONFIRMED_TXS_WITH_TRANSFERS_INFINITE_QUERY_KEY, principal],
+    queryFn: async ({ pageParam }: { pageParam: number }) => {
+      if (!principal) return undefined;


not needed with the enale prop

BLuEScioN · 2024-11-20T18:55:45Z

src/common/queries/useAddressConfirmedTxsWithTransfersInfinite.ts

-        offset: pageParam || 0,
-      }),
+    queryFn: async ({ pageParam }: { pageParam: number }) => {
+      if (!address || !txId) return undefined;


not needed with the enable prop

BLuEScioN · 2024-11-20T18:57:06Z

src/common/queries/useAddressMempoolTxsInfinite.ts

-        offset: pageParam,
-      }),
+    queryFn: async ({ pageParam }: { pageParam: number }) => {
+      if (!address) return undefined;


I keep seeing this so I won't keep making redundanct commentsm but I would like to know why we are using these checks and also the enabled prop

BLuEScioN · 2024-11-20T18:58:24Z

src/common/queries/useBlockByHash.ts

    staleTime: Infinity,
-    ...options,
+    refetchOnWindowFocus: true,


put reason in comment?

BLuEScioN · 2024-11-20T18:59:32Z

src/common/queries/useBlockByHash.ts

-import { useApi } from '../api/useApi';
-import { useGlobalContext } from '../context/useGlobalContext';
+import { getErrorMessage } from '../../api/getErrorMessage';
+import { useApiClient } from '../../api/useApiClient';

 const BLOCK_QUERY_KEY = 'block';

 export function useBlockByHash(


So we need this if we have the blockbyheightorhash endpoint?

BLuEScioN · 2024-11-20T19:37:42Z

src/common/queries/useBlocksByBurnBlock.ts

-        limit: numStxBlocksperBtcBlock,
-      }),
+    queryFn: async () => {
+      if (!heightOrHash) return undefined;


use enabled?

BLuEScioN · 2024-11-20T19:44:58Z

src/common/queries/useContractFtMetadata.ts

  return useQuery({
    queryKey: ['contract-ft-metadata', contractId],
-    queryFn: () => api.tokenMetadataApi?.getFtMetadata(contractId!),
+    queryFn: () => tokenMetadataApi?.getFtMetadata(contractId!),


Is the metadata api going to transistion to the endpoint model too?

not for now, current version still follows the old convention

BLuEScioN · 2024-11-20T19:45:42Z

src/common/queries/useCoreApiInfo.ts

  return useQuery({
    queryKey: ['coreApiInfo'],
-    queryFn: () => api.infoApi.getCoreApiInfo(),
+    queryFn: () => fetch(`${activeNetworkUrl}/v2/info`).then(res => res.json()),


not using apiClient?

BLuEScioN · 2024-11-20T19:50:58Z

src/common/queries/useCustomNetworkApiInfo.ts

-  const api = useApi();
-  return useQuery<CoreNodeInfoResponse, Error>({
+export function useCustomNetworkApiInfo(url: string, options: any = {}) {
+  return useQuery({


I feel like this can be combined with useCoreAPIInfo

BLuEScioN · 2024-11-20T19:51:44Z

src/common/queries/useFeeTransfer.ts

  return useQuery({
    queryKey: ['transfer-fees'],
-    queryFn: () => api.feesApi.getFeeTransfer(),
+    queryFn: () => fetch(`${activeNetworkUrl}/v2/fees/transfer`).then(res => res.json()),


no apiclient

BLuEScioN · 2024-11-20T19:55:48Z

src/common/queries/usePoxInfo.ts

  return useSuspenseQuery({
    queryKey: ['poxInfo'],
-    queryFn: () => api.infoApi.getPoxInfo(),
+    queryFn: () => fetch(`${activeNetworkUrl}/v2/pox`).then(res => res.json()),


no api client?

BLuEScioN · 2024-11-20T19:57:36Z

src/common/queries/useTxEventsByIdInfinite.ts

      return {
-        results: tx.events,
-        total: tx.event_count,
+        results: (tx as Transaction).events,


did we lose typings?

BLuEScioN

Left some comments

He1DAr force-pushed the feat/upgrade-api-layer branch from 25e066e to 7be35ba Compare November 15, 2024 14:48

vercel bot deployed to Preview – explorer-storybook November 15, 2024 14:48 View deployment

vercel bot had a problem deploying to Preview – hiro-explorer November 15, 2024 14:52 Failure

He1DAr force-pushed the feat/upgrade-api-layer branch from 7be35ba to 6025c52 Compare November 18, 2024 14:24

vercel bot deployed to Preview – explorer-storybook November 18, 2024 14:25 View deployment

vercel bot had a problem deploying to Preview – hiro-explorer November 18, 2024 14:28 Failure

He1DAr force-pushed the feat/upgrade-api-layer branch from 6025c52 to 8d9e372 Compare November 18, 2024 14:30

vercel bot had a problem deploying to Preview – hiro-explorer November 18, 2024 14:33 Failure

vercel bot deployed to Preview – explorer-storybook November 18, 2024 14:34 View deployment

He1DAr force-pushed the feat/upgrade-api-layer branch from 8d9e372 to 8f5a43f Compare November 18, 2024 14:45

vercel bot deployed to Preview – explorer-storybook November 18, 2024 14:46 View deployment

vercel bot had a problem deploying to Preview – hiro-explorer November 18, 2024 14:49 Failure

He1DAr force-pushed the feat/upgrade-api-layer branch from 8f5a43f to 9d76acd Compare November 18, 2024 14:59

vercel bot deployed to Preview – explorer-storybook November 18, 2024 15:00 View deployment

vercel bot had a problem deploying to Preview – hiro-explorer November 18, 2024 15:03 Failure

He1DAr force-pushed the feat/upgrade-api-layer branch from 9d76acd to d307216 Compare November 18, 2024 16:13

vercel bot had a problem deploying to Preview – hiro-explorer November 18, 2024 16:17 Failure

vercel bot deployed to Preview – explorer-storybook November 18, 2024 16:17 View deployment

He1DAr force-pushed the feat/upgrade-api-layer branch from d307216 to 7ae81b7 Compare November 18, 2024 16:23

vercel bot deployed to Preview – explorer-storybook November 18, 2024 16:24 View deployment

vercel bot had a problem deploying to Preview – hiro-explorer November 18, 2024 16:28 Failure

He1DAr force-pushed the feat/upgrade-api-layer branch from 7ae81b7 to 7e16fa5 Compare November 18, 2024 19:04

vercel bot had a problem deploying to Preview – hiro-explorer November 18, 2024 19:07 Failure

vercel bot deployed to Preview – explorer-storybook November 18, 2024 19:08 View deployment

He1DAr force-pushed the feat/upgrade-api-layer branch from 7e16fa5 to 58b12b5 Compare November 18, 2024 19:32

vercel bot deployed to Preview – explorer-storybook November 18, 2024 19:33 View deployment

vercel bot had a problem deploying to Preview – hiro-explorer November 18, 2024 19:36 Failure

He1DAr force-pushed the feat/upgrade-api-layer branch from 58b12b5 to d001bb7 Compare November 19, 2024 15:10

BLuEScioN reviewed Nov 20, 2024

View reviewed changes

src/common/queries/useBlockByHash.ts

staleTime: Infinity,

...options,

refetchOnWindowFocus: true,

Copy link

Collaborator

BLuEScioN Nov 20, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

put reason in comment?

BLuEScioN reviewed Nov 20, 2024

View reviewed changes

BLuEScioN requested changes Nov 20, 2024

View reviewed changes

He1DAr force-pushed the feat/upgrade-api-layer branch from 7ee41a7 to cb61633 Compare November 22, 2024 17:56

vercel bot deployed to Preview – explorer-storybook November 22, 2024 17:57 View deployment

vercel bot had a problem deploying to Preview – hiro-explorer November 22, 2024 18:01 Failure

He1DAr force-pushed the feat/upgrade-api-layer branch from cb61633 to 6ce1bcb Compare November 22, 2024 18:06

vercel bot deployed to Preview – explorer-storybook November 22, 2024 18:06 View deployment

vercel bot had a problem deploying to Preview – hiro-explorer November 22, 2024 18:10 Failure

feat: upgrade api layer

affec16

He1DAr force-pushed the feat/upgrade-api-layer branch from 6ce1bcb to affec16 Compare November 22, 2024 18:25

vercel bot deployed to Preview – explorer-storybook November 22, 2024 18:26 View deployment

vercel bot had a problem deploying to Preview – hiro-explorer November 22, 2024 18:29 Failure

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat: upgrade api layer #1910

feat: upgrade api layer #1910

He1DAr commented Nov 15, 2024 •

edited

Loading

vercel bot commented Nov 15, 2024 •

edited

Loading

codecov bot commented Nov 18, 2024 •

edited

Loading

BLuEScioN Nov 20, 2024

BLuEScioN Nov 20, 2024

BLuEScioN Nov 20, 2024

BLuEScioN Nov 20, 2024

BLuEScioN Nov 20, 2024

BLuEScioN Nov 20, 2024

BLuEScioN Nov 20, 2024

BLuEScioN Nov 20, 2024

BLuEScioN Nov 20, 2024

BLuEScioN Nov 20, 2024

BLuEScioN Nov 20, 2024

BLuEScioN Nov 20, 2024

BLuEScioN Nov 20, 2024

BLuEScioN Nov 20, 2024

He1DAr Nov 21, 2024

BLuEScioN Nov 20, 2024

BLuEScioN Nov 20, 2024

BLuEScioN Nov 20, 2024

BLuEScioN Nov 20, 2024

BLuEScioN Nov 20, 2024

BLuEScioN left a comment

feat: upgrade api layer #1910

Are you sure you want to change the base?

feat: upgrade api layer #1910

Conversation

He1DAr commented Nov 15, 2024 • edited Loading

What type of PR is this? (check all applicable)

Description

Issue ticket number and link

Checklist:

Screenshots (if appropriate):

vercel bot commented Nov 15, 2024 • edited Loading

codecov bot commented Nov 18, 2024 • edited Loading

Codecov Report

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

BLuEScioN left a comment

Choose a reason for hiding this comment

He1DAr commented Nov 15, 2024 •

edited

Loading

vercel bot commented Nov 15, 2024 •

edited

Loading

codecov bot commented Nov 18, 2024 •

edited

Loading