rework dapp queries

lib/api/resources.ts

@@ -82,10 +82,14 @@ import type { VerifiedContractsSorting } from 'types/api/verifiedContracts';
 import type { VisualizedContract } from 'types/api/visualization';
 import type { WithdrawalsResponse, WithdrawalsCounters } from 'types/api/withdrawals';
 import type { ZkEvmL2TxnBatch, ZkEvmL2TxnBatchesItem, ZkEvmL2TxnBatchesResponse, ZkEvmL2TxnBatchTxs } from 'types/api/zkEvmL2TxnBatches';
+import type { MarketplaceAppOverview } from 'types/client/marketplace';
 import type { ArrayElement } from 'types/utils';
 
 import config from 'configs/app';
 
+const marketplaceFeature = getFeaturePayload(config.features.marketplace);
+const marketplaceApi = marketplaceFeature && 'api' in marketplaceFeature ? marketplaceFeature.api : undefined;
+
 export interface ApiResource {
   path: ResourcePath;
   endpoint?: string;
@@ -221,6 +225,20 @@ export const RESOURCES = {
     basePath: getFeaturePayload(config.features.sol2uml)?.api.basePath,
   },
 
+  // MARKETPLACE
+  marketplace_dapps: {
+    path: '/api/v1/chains/:chainId/marketplace/dapps',
+    pathParams: [ 'chainId' as const ],
+    endpoint: marketplaceApi?.endpoint,
+    basePath: marketplaceApi?.basePath,
+  },
+  marketplace_dapp: {
+    path: '/api/v1/chains/:chainId/marketplace/dapps/:dappId',
+    pathParams: [ 'chainId' as const, 'dappId' as const ],
+    endpoint: marketplaceApi?.endpoint,
+    basePath: marketplaceApi?.basePath,
+  },
+
   // BLOCKS, TXS
   blocks: {
     path: '/api/v2/blocks',
@@ -772,6 +790,8 @@ Q extends 'domains_lookup' ? EnsDomainLookupResponse :
 Q extends 'user_ops' ? UserOpsResponse :
 Q extends 'user_op' ? UserOp :
 Q extends 'user_ops_account' ? UserOpsAccount :
+Q extends 'marketplace_dapps' ? Array<MarketplaceAppOverview> :
+Q extends 'marketplace_dapp' ? MarketplaceAppOverview :
 never;
 /* eslint-enable @typescript-eslint/indent */
 

ui/marketplace/useMarketplaceApps.tsx

@@ -6,8 +6,9 @@ import { MarketplaceCategory } from 'types/client/marketplace';
 
 import config from 'configs/app';
 import type { ResourceError } from 'lib/api/resources';
+import useApiFetch from 'lib/api/useApiFetch';
 import useFeatureValue from 'lib/growthbook/useFeatureValue';
-import useApiFetch from 'lib/hooks/useFetch';
+import useFetch from 'lib/hooks/useFetch';
 import { MARKETPLACE_APP } from 'stubs/marketplace';
 
 const feature = config.features.marketplace;
@@ -47,6 +48,7 @@ function sortApps(apps: Array<MarketplaceAppOverview>, isExperiment: boolean) {
 }
 
 export default function useMarketplaceApps(filter: string, selectedCategoryId: string = MarketplaceCategory.ALL, favoriteApps: Array<string> = []) {
+  const fetch = useFetch();
   const apiFetch = useApiFetch();
   const { value: isExperiment } = useFeatureValue('marketplace_exp', false);
 
@@ -55,12 +57,11 @@ export default function useMarketplaceApps(filter: string, selectedCategoryId: s
     queryFn: async() => {
       if (!feature.isEnabled) {
         return [];
+      } else if ('configUrl' in feature) {
+        return fetch<Array<MarketplaceAppOverview>, unknown>(feature.configUrl, undefined, { resource: 'marketplace-dapps' });
+      } else {
+        return apiFetch('marketplace_dapps', { pathParams: { chainId: config.chain.id } });
       }
-      const url = 'configUrl' in feature ?
-        feature.configUrl :
-        feature.api.endpoint + `/api/v1/chains/${ config.chain.id }/marketplace/dapps`;
-
-      return apiFetch<Array<MarketplaceAppOverview>, unknown>(url, undefined, { resource: 'marketplace-dapps' });
     },
     select: (data) => sortApps(data as Array<MarketplaceAppOverview>, isExperiment),
     placeholderData: feature.isEnabled ? Array(9).fill(MARKETPLACE_APP) : undefined,

ui/pages/MarketplaceApp.tsx

@@ -10,8 +10,9 @@ import { route } from 'nextjs-routes';
 
 import config from 'configs/app';
 import type { ResourceError } from 'lib/api/resources';
+import useApiFetch from 'lib/api/useApiFetch';
 import throwOnResourceLoadError from 'lib/errors/throwOnResourceLoadError';
-import useApiFetch from 'lib/hooks/useFetch';
+import useFetch from 'lib/hooks/useFetch';
 import * as metadata from 'lib/metadata';
 import getQueryParamString from 'lib/router/getQueryParamString';
 import ContentLoader from 'ui/shared/ContentLoader';
@@ -96,6 +97,7 @@ const MarketplaceAppContent = ({ address, data, isPending }: Props) => {
 const MarketplaceApp = () => {
   const { address, sendTransaction, signMessage, signTypedData } = useMarketplaceWallet();
 
+  const fetch = useFetch();
   const apiFetch = useApiFetch();
   const router = useRouter();
   const id = getQueryParamString(router.query.id);
@@ -105,15 +107,8 @@ const MarketplaceApp = () => {
     queryFn: async() => {
       if (!feature.isEnabled) {
         return null;
-      }
-      const isConfigFile = 'configUrl' in feature;
-      const url = isConfigFile ?
-        feature.configUrl :
-        feature.api.endpoint + `/api/v1/chains/${ config.chain.id }/marketplace/dapps/${ id }`;
-
-      const result = await apiFetch<Array<MarketplaceAppOverview>, unknown>(url, undefined, { resource: 'marketplace-dapps' });
-
-      if (isConfigFile) {
+      } else if ('configUrl' in feature) {
+        const result = await fetch<Array<MarketplaceAppOverview>, unknown>(feature.configUrl, undefined, { resource: 'marketplace-dapps' });
         if (!Array.isArray(result)) {
           throw result;
         }
@@ -122,9 +117,9 @@ const MarketplaceApp = () => {
           throw { status: 404 };
         }
         return item;
+      } else {
+        return apiFetch('marketplace_dapp', { pathParams: { chainId: config.chain.id, dappId: id } });
       }
-
-      return result;
     },
     enabled: feature.isEnabled,
   });