@net-protocol/bazaar 0.1.2 → 0.1.3

package/dist/react.js

@@ -1,6 +1,7 @@
 'use strict';
 
 var react = require('react');
+var wagmi = require('wagmi');
 var react$1 = require('@net-protocol/core/react');
 var viem = require('viem');
 var core = require('@net-protocol/core');
@@ -182,8 +183,8 @@ var DEFAULT_FEE_COLLECTOR_ADDRESS = "0x32D16C15410248bef498D7aF50D10Db1a546b9E5"
 var DEFAULT_ERC20_BAZAAR_ADDRESS = "0x00000000a2d173a4610c85c7471a25b6bc216a70";
 var DEFAULT_NFT_FEE_BPS = 500;
 var BULK_SEAPORT_ORDER_STATUS_FETCHER_ADDRESS = "0x0000009112ABCE652674b4fE3eD9C765B22d11A7";
-var ERC721_OWNER_OF_HELPER_ADDRESS = "0x000000aa4eFa2e5A4a6002C7F08B6e8Ec8cf1dDa";
-var ERC20_BULK_BALANCE_CHECKER_ADDRESS = "0x000000b50a9f2923f2db931391824f6d1278f712";
+var ERC721_OWNER_OF_HELPER_ADDRESS = "0x00000012E3eb0700925947fAF9cd1440319b4F37";
+var ERC20_BULK_BALANCE_CHECKER_ADDRESS = "0x000000B50A9f2923F2DB931391824F6D1278f712";
 var NET_SEAPORT_COLLECTION_OFFER_ZONE_ADDRESS = "0x000000B799ec6D7aCC1B578f62bFc324c25DFC5A";
 var NET_SEAPORT_PRIVATE_ORDER_ZONE_ADDRESS = "0x000000bC63761cbb05305632212e2f3AE2BE7a9B";
 var BAZAAR_CHAIN_CONFIGS = {
@@ -464,34 +465,47 @@ async function bulkFetchOrderStatuses(client, chainId, orderHashes) {
     return [];
   }
   const seaportAddress = getSeaportAddress(chainId);
-  const results = await actions.readContract(client, {
-    address: BULK_SEAPORT_ORDER_STATUS_FETCHER_ADDRESS,
-    abi: BULK_SEAPORT_ORDER_STATUS_FETCHER_ABI,
-    functionName: "getOrderStatuses",
-    args: [seaportAddress, orderHashes]
-  });
-  return results.map((r) => ({
-    isValidated: r.isValidated,
-    isCancelled: r.isCancelled,
-    totalFilled: BigInt(r.totalFilled),
-    totalSize: BigInt(r.totalSize)
-  }));
+  try {
+    console.log(`[bulkFetchOrderStatuses] fetching ${orderHashes.length} statuses via ${BULK_SEAPORT_ORDER_STATUS_FETCHER_ADDRESS}`);
+    const results = await actions.readContract(client, {
+      address: BULK_SEAPORT_ORDER_STATUS_FETCHER_ADDRESS,
+      abi: BULK_SEAPORT_ORDER_STATUS_FETCHER_ABI,
+      functionName: "getOrderStatuses",
+      args: [seaportAddress, orderHashes]
+    });
+    const statuses = results.map((r) => ({
+      isValidated: r.isValidated,
+      isCancelled: r.isCancelled,
+      totalFilled: BigInt(r.totalFilled),
+      totalSize: BigInt(r.totalSize)
+    }));
+    console.log(`[bulkFetchOrderStatuses] success: ${statuses.length} statuses`);
+    return statuses;
+  } catch (err) {
+    console.error(`[bulkFetchOrderStatuses] FAILED for ${orderHashes.length} hashes:`, err);
+    throw err;
+  }
 }
 async function bulkFetchNftOwners(client, nftAddress, tokenIds) {
   if (tokenIds.length === 0) {
     return [];
   }
   try {
+    console.log(`[bulkFetchNftOwners] fetching ${tokenIds.length} owners for ${nftAddress.slice(0, 10)} via ${ERC721_OWNER_OF_HELPER_ADDRESS}`);
     const owners = await actions.readContract(client, {
       address: ERC721_OWNER_OF_HELPER_ADDRESS,
       abi: ERC721_OWNER_OF_HELPER_ABI,
       functionName: "getTokenOwners",
       args: [nftAddress, tokenIds.map((id) => BigInt(id))]
     });
-    return owners.map(
+    const result = owners.map(
       (owner) => owner === "0x0000000000000000000000000000000000000000" ? null : owner
     );
-  } catch {
+    const validCount = result.filter((o) => o !== null).length;
+    console.log(`[bulkFetchNftOwners] success: ${validCount}/${tokenIds.length} have owners`);
+    return result;
+  } catch (err) {
+    console.error(`[bulkFetchNftOwners] FAILED for ${tokenIds.length} tokens \u2014 returning all null:`, err);
     return tokenIds.map(() => null);
   }
 }
@@ -500,14 +514,18 @@ async function bulkFetchErc20Balances(client, tokenAddress, addresses) {
     return [];
   }
   try {
+    console.log(`[bulkFetchErc20Balances] fetching ${addresses.length} balances for ${tokenAddress.slice(0, 10)}`);
     const balances = await actions.readContract(client, {
       address: ERC20_BULK_BALANCE_CHECKER_ADDRESS,
       abi: ERC20_BULK_BALANCE_CHECKER_ABI,
       functionName: "getBalances",
       args: [tokenAddress, addresses]
     });
-    return balances.map((b) => BigInt(b));
-  } catch {
+    const result = balances.map((b) => BigInt(b));
+    console.log(`[bulkFetchErc20Balances] success: ${result.length} balances`);
+    return result;
+  } catch (err) {
+    console.error(`[bulkFetchErc20Balances] FAILED for ${addresses.length} addresses \u2014 returning all zero:`, err);
     return addresses.map(() => BigInt(0));
   }
 }
@@ -798,26 +816,30 @@ var BazaarClient = class {
     }
     this.chainId = params.chainId;
     this.rpcUrl = params.rpcUrl || CHAIN_RPC_URLS[params.chainId]?.[0] || "";
-    if (!this.rpcUrl) {
-      throw new Error(`No RPC URL available for chain ${params.chainId}`);
+    if (params.publicClient) {
+      this.client = params.publicClient;
+    } else {
+      if (!this.rpcUrl) {
+        throw new Error(`No RPC URL available for chain ${params.chainId}`);
+      }
+      const config = getBazaarChainConfig(params.chainId);
+      this.client = viem.createPublicClient({
+        chain: viem.defineChain({
+          id: params.chainId,
+          name: `Chain ${params.chainId}`,
+          nativeCurrency: {
+            name: config.wrappedNativeCurrency.name.replace("Wrapped ", ""),
+            symbol: config.currencySymbol.toUpperCase(),
+            decimals: 18
+          },
+          rpcUrls: {
+            default: { http: [this.rpcUrl] }
+          }
+        }),
+        transport: viem.http(this.rpcUrl),
+        batch: { multicall: true }
+      });
     }
-    const config = getBazaarChainConfig(params.chainId);
-    this.client = viem.createPublicClient({
-      chain: viem.defineChain({
-        id: params.chainId,
-        name: `Chain ${params.chainId}`,
-        nativeCurrency: {
-          name: config.wrappedNativeCurrency.name.replace("Wrapped ", ""),
-          symbol: config.currencySymbol.toUpperCase(),
-          decimals: 18
-        },
-        rpcUrls: {
-          default: { http: [this.rpcUrl] }
-        }
-      }),
-      transport: viem.http(this.rpcUrl),
-      batch: { multicall: true }
-    });
     this.netClient = new core.NetClient({
       chainId: params.chainId,
       overrides: params.rpcUrl ? { rpcUrls: [params.rpcUrl] } : void 0
@@ -859,6 +881,17 @@ var BazaarClient = class {
       startIndex,
       endIndex
     });
+    return this.processListingsFromMessages(messages, options);
+  }
+  /**
+   * Process pre-fetched messages into valid NFT listings.
+   *
+   * Use this when messages have already been fetched (e.g. via useNetMessages)
+   * to avoid redundant RPC calls.
+   */
+  async processListingsFromMessages(messages, options) {
+    const { nftAddress, excludeMaker, includeExpired = false } = options;
+    const tag = `[BazaarClient.processListings chain=${this.chainId}]`;
     let listings = [];
     for (const message of messages) {
       const listing = parseListingFromMessage(message, this.chainId);
@@ -868,6 +901,7 @@ var BazaarClient = class {
       }
       listings.push(listing);
     }
+    console.log(tag, `parsed ${listings.length}/${messages.length} messages into listings`);
     if (listings.length === 0) {
       return [];
     }
@@ -882,15 +916,27 @@ var BazaarClient = class {
       const statusInfo = statusInfos[index];
       listing.orderStatus = getOrderStatusFromInfo(listing.orderComponents, statusInfo);
     });
+    const statusCounts = {};
+    const now = Math.floor(Date.now() / 1e3);
+    let expiredCount = 0;
+    for (const l of listings) {
+      statusCounts[l.orderStatus] = (statusCounts[l.orderStatus] || 0) + 1;
+      if (l.expirationDate <= now) expiredCount++;
+    }
+    console.log(tag, `order statuses:`, statusCounts, `expired: ${expiredCount}`);
     listings = listings.filter(
-      (l) => l.orderStatus === 2 /* OPEN */ && l.expirationDate > Math.floor(Date.now() / 1e3)
+      (l) => l.orderStatus === 2 /* OPEN */ && l.expirationDate > now || includeExpired && l.orderStatus === 1 /* EXPIRED */
     );
+    console.log(tag, `after status filter: ${listings.length} (OPEN${includeExpired ? " + EXPIRED" : ""})`);
     if (listings.length === 0) {
       return [];
     }
-    const tokenIds = listings.map((l) => l.tokenId);
+    const openListings = listings.filter((l) => l.orderStatus === 2 /* OPEN */);
+    const expiredListings = includeExpired ? listings.filter((l) => l.orderStatus === 1 /* EXPIRED */) : [];
+    const tokenIds = openListings.map((l) => l.tokenId);
     const owners = await bulkFetchNftOwners(this.client, nftAddress, tokenIds);
-    listings = listings.filter((listing, index) => {
+    const beforeOwnership = openListings.length;
+    const validOpenListings = openListings.filter((listing, index) => {
       const owner = owners[index];
       return isListingValid(
         listing.orderStatus,
@@ -899,7 +945,16 @@ var BazaarClient = class {
         owner
       );
     });
-    return sortListingsByPrice(getBestListingPerToken(listings));
+    console.log(tag, `after ownership filter: ${validOpenListings.length}/${beforeOwnership} (${beforeOwnership - validOpenListings.length} dropped)`);
+    const dedupedOpen = sortListingsByPrice(getBestListingPerToken(validOpenListings));
+    const activeTokenKeys = new Set(dedupedOpen.map((l) => `${l.nftAddress.toLowerCase()}-${l.tokenId}`));
+    const uniqueExpired = getBestListingPerToken(
+      expiredListings.filter((l) => !activeTokenKeys.has(`${l.nftAddress.toLowerCase()}-${l.tokenId}`))
+    );
+    const sortedExpired = sortListingsByPrice(uniqueExpired);
+    const result = [...dedupedOpen, ...sortedExpired];
+    console.log(tag, `final: ${result.length} listings (${dedupedOpen.length} open, ${sortedExpired.length} expired)`);
+    return result;
   }
   /**
    * Get valid collection offers for a collection
@@ -914,10 +969,6 @@ var BazaarClient = class {
   async getCollectionOffers(options) {
     const { nftAddress, excludeMaker, maxMessages = 100 } = options;
     const collectionOffersAddress = getCollectionOffersAddress(this.chainId);
-    const weth = getWrappedNativeCurrency(this.chainId);
-    if (!weth) {
-      return [];
-    }
     const count = await this.netClient.getMessageCount({
       filter: {
         appAddress: collectionOffersAddress,
@@ -936,6 +987,21 @@ var BazaarClient = class {
       startIndex,
       endIndex: count
     });
+    return this.processCollectionOffersFromMessages(messages, options);
+  }
+  /**
+   * Process pre-fetched messages into valid collection offers.
+   *
+   * Use this when messages have already been fetched (e.g. via useNetMessages)
+   * to avoid redundant RPC calls.
+   */
+  async processCollectionOffersFromMessages(messages, options) {
+    const { nftAddress, excludeMaker } = options;
+    const tag = `[BazaarClient.processCollectionOffers chain=${this.chainId}]`;
+    const weth = getWrappedNativeCurrency(this.chainId);
+    if (!weth) {
+      return [];
+    }
     let offers = [];
     for (const message of messages) {
       const offer = parseCollectionOfferFromMessage(message, this.chainId);
@@ -950,6 +1016,7 @@ var BazaarClient = class {
       }
       offers.push(offer);
     }
+    console.log(tag, `parsed ${offers.length}/${messages.length} messages into offers`);
     if (offers.length === 0) {
       return [];
     }
@@ -964,9 +1031,11 @@ var BazaarClient = class {
       const statusInfo = statusInfos[index];
       offer.orderStatus = getOrderStatusFromInfo(offer.orderComponents, statusInfo);
     });
+    const now = Math.floor(Date.now() / 1e3);
     offers = offers.filter(
-      (o) => o.orderStatus === 2 /* OPEN */ && o.expirationDate > Math.floor(Date.now() / 1e3)
+      (o) => o.orderStatus === 2 /* OPEN */ && o.expirationDate > now
     );
+    console.log(tag, `after status filter: ${offers.length} OPEN & not expired`);
     if (offers.length === 0) {
       return [];
     }
@@ -976,6 +1045,7 @@ var BazaarClient = class {
     uniqueMakers.forEach((maker, index) => {
       balanceMap.set(maker.toLowerCase(), balances[index]);
     });
+    const beforeBalance = offers.length;
     offers = offers.filter((offer) => {
       const balance = balanceMap.get(offer.maker.toLowerCase()) || BigInt(0);
       return isCollectionOfferValid(
@@ -985,6 +1055,7 @@ var BazaarClient = class {
         balance
       );
     });
+    console.log(tag, `after balance filter: ${offers.length}/${beforeBalance} (${beforeBalance - offers.length} dropped)`);
     return sortOffersByPrice(offers);
   }
   /**
@@ -1002,8 +1073,7 @@ var BazaarClient = class {
   async getErc20Offers(options) {
     const { tokenAddress, excludeMaker, maxMessages = 200 } = options;
     const erc20OffersAddress = getErc20OffersAddress(this.chainId);
-    const weth = getWrappedNativeCurrency(this.chainId);
-    if (!erc20OffersAddress || !weth) {
+    if (!erc20OffersAddress) {
       return [];
     }
     const count = await this.netClient.getMessageCount({
@@ -1024,6 +1094,21 @@ var BazaarClient = class {
       startIndex,
       endIndex: count
     });
+    return this.processErc20OffersFromMessages(messages, options);
+  }
+  /**
+   * Process pre-fetched messages into valid ERC20 offers.
+   *
+   * Use this when messages have already been fetched (e.g. via useNetMessages)
+   * to avoid redundant RPC calls.
+   */
+  async processErc20OffersFromMessages(messages, options) {
+    const { tokenAddress, excludeMaker } = options;
+    const tag = `[BazaarClient.processErc20Offers chain=${this.chainId}]`;
+    const weth = getWrappedNativeCurrency(this.chainId);
+    if (!weth) {
+      return [];
+    }
     let offers = [];
     for (const message of messages) {
       const offer = parseErc20OfferFromMessage(message, this.chainId);
@@ -1041,6 +1126,7 @@ var BazaarClient = class {
       }
       offers.push(offer);
     }
+    console.log(tag, `parsed ${offers.length}/${messages.length} messages into offers`);
     if (offers.length === 0) {
       return [];
     }
@@ -1055,9 +1141,11 @@ var BazaarClient = class {
       const statusInfo = statusInfos[index];
       offer.orderStatus = getOrderStatusFromInfo(offer.orderComponents, statusInfo);
     });
+    const now = Math.floor(Date.now() / 1e3);
     offers = offers.filter(
-      (o) => o.orderStatus === 2 /* OPEN */ && o.expirationDate > Math.floor(Date.now() / 1e3)
+      (o) => o.orderStatus === 2 /* OPEN */ && o.expirationDate > now
     );
+    console.log(tag, `after status filter: ${offers.length} OPEN & not expired`);
     if (offers.length === 0) {
       return [];
     }
@@ -1067,6 +1155,7 @@ var BazaarClient = class {
     uniqueMakers.forEach((maker, index) => {
       balanceMap.set(maker.toLowerCase(), balances[index]);
     });
+    const beforeBalance = offers.length;
     offers = offers.filter((offer) => {
       const balance = balanceMap.get(offer.maker.toLowerCase()) || BigInt(0);
       return isErc20OfferValid(
@@ -1076,6 +1165,7 @@ var BazaarClient = class {
         balance
       );
     });
+    console.log(tag, `after balance filter: ${offers.length}/${beforeBalance} (${beforeBalance - offers.length} dropped)`);
     return sortErc20OffersByPricePerToken(offers);
   }
   /**
@@ -1115,6 +1205,17 @@ var BazaarClient = class {
       startIndex,
       endIndex
     });
+    return this.processErc20ListingsFromMessages(messages, options);
+  }
+  /**
+   * Process pre-fetched messages into valid ERC20 listings.
+   *
+   * Use this when messages have already been fetched (e.g. via useNetMessages)
+   * to avoid redundant RPC calls.
+   */
+  async processErc20ListingsFromMessages(messages, options) {
+    const { tokenAddress, excludeMaker } = options;
+    const tag = `[BazaarClient.processErc20Listings chain=${this.chainId}]`;
     let listings = [];
     for (const message of messages) {
       const listing = parseErc20ListingFromMessage(message, this.chainId);
@@ -1127,6 +1228,7 @@ var BazaarClient = class {
       }
       listings.push(listing);
     }
+    console.log(tag, `parsed ${listings.length}/${messages.length} messages into listings`);
     if (listings.length === 0) {
       return [];
     }
@@ -1141,18 +1243,28 @@ var BazaarClient = class {
       const statusInfo = statusInfos[index];
       listing.orderStatus = getOrderStatusFromInfo(listing.orderComponents, statusInfo);
     });
+    const statusCounts = {};
+    const now = Math.floor(Date.now() / 1e3);
+    let expiredCount = 0;
+    for (const l of listings) {
+      statusCounts[l.orderStatus] = (statusCounts[l.orderStatus] || 0) + 1;
+      if (l.expirationDate <= now) expiredCount++;
+    }
+    console.log(tag, `order statuses:`, statusCounts, `expired: ${expiredCount}`);
     listings = listings.filter(
-      (l) => l.orderStatus === 2 /* OPEN */ && l.expirationDate > Math.floor(Date.now() / 1e3)
+      (l) => l.orderStatus === 2 /* OPEN */ && l.expirationDate > now
     );
+    console.log(tag, `after status filter: ${listings.length} OPEN & not expired`);
     if (listings.length === 0) {
       return [];
     }
     const uniqueMakers = [...new Set(listings.map((l) => l.maker))];
     const balances = await bulkFetchErc20Balances(this.client, tokenAddress, uniqueMakers);
     const balanceMap = /* @__PURE__ */ new Map();
-    uniqueMakers.forEach((maker2, index) => {
-      balanceMap.set(maker2.toLowerCase(), balances[index]);
+    uniqueMakers.forEach((maker, index) => {
+      balanceMap.set(maker.toLowerCase(), balances[index]);
     });
+    const beforeBalance = listings.length;
     listings = listings.filter((listing) => {
       const balance = balanceMap.get(listing.maker.toLowerCase()) || BigInt(0);
       return isErc20ListingValid(
@@ -1162,6 +1274,7 @@ var BazaarClient = class {
         balance
       );
     });
+    console.log(tag, `after balance filter: ${listings.length}/${beforeBalance} (${beforeBalance - listings.length} dropped)`);
     return sortErc20ListingsByPricePerToken(listings);
   }
   /**
@@ -1288,8 +1401,12 @@ function useBazaarListings({
   maxMessages = 200,
   startIndex: startIndexOverride,
   endIndex: endIndexOverride,
-  enabled = true
+  includeExpired = false,
+  enabled = true,
+  publicClient
 }) {
+  const wagmiClient = wagmi.usePublicClient({ chainId });
+  const resolvedClient = publicClient ?? wagmiClient;
   const [listings, setListings] = react.useState([]);
   const [isProcessing, setIsProcessing] = react.useState(false);
   const [processingError, setProcessingError] = react.useState();
@@ -1330,6 +1447,21 @@ function useBazaarListings({
     endIndex,
     enabled: enabled && isSupported && (hasRangeOverride || totalCount > 0)
   });
+  const TAG = `[useBazaarListings chain=${chainId} nft=${nftAddress.slice(0, 10)}]`;
+  react.useEffect(() => {
+    console.log(TAG, {
+      enabled,
+      isSupported,
+      hasRangeOverride,
+      totalCount,
+      isLoadingCount,
+      startIndex,
+      endIndex,
+      messagesLength: messages?.length ?? 0,
+      isLoadingMessages,
+      messagesError: messagesError?.message
+    });
+  }, [enabled, isSupported, hasRangeOverride, totalCount, isLoadingCount, startIndex, endIndex, messages?.length, isLoadingMessages, messagesError]);
   react.useEffect(() => {
     if (!isSupported || !enabled) {
       setListings([]);
@@ -1343,20 +1475,19 @@ function useBazaarListings({
     async function processListings() {
       setIsProcessing(true);
       setProcessingError(void 0);
+      console.log(TAG, `processing ${messages.length} messages...`);
       try {
-        const client = new BazaarClient({ chainId });
-        const validListings = await client.getListings({
-          nftAddress,
-          excludeMaker,
-          maker,
-          maxMessages,
-          startIndex: hasRangeOverride ? startIndexOverride : void 0,
-          endIndex: hasRangeOverride ? endIndexOverride : void 0
-        });
+        const client = new BazaarClient({ chainId, publicClient: resolvedClient });
+        const validListings = await client.processListingsFromMessages(
+          messages,
+          { nftAddress, excludeMaker, includeExpired }
+        );
+        console.log(TAG, `processed \u2192 ${validListings.length} valid listings`);
         if (!cancelled) {
           setListings(validListings);
         }
       } catch (err) {
+        console.error(TAG, "processing error:", err);
         if (!cancelled) {
           setProcessingError(err instanceof Error ? err : new Error(String(err)));
           setListings([]);
@@ -1371,7 +1502,7 @@ function useBazaarListings({
     return () => {
       cancelled = true;
     };
-  }, [chainId, nftAddress, excludeMaker, maker, maxMessages, startIndexOverride, endIndexOverride, hasRangeOverride, messages, isSupported, enabled, refetchTrigger]);
+  }, [chainId, nftAddress, excludeMaker, includeExpired, messages, isSupported, enabled, refetchTrigger]);
   const refetch = () => {
     refetchMessages();
     setRefetchTrigger((t) => t + 1);
@@ -1390,6 +1521,7 @@ function useBazaarCollectionOffers({
   maxMessages = 100,
   enabled = true
 }) {
+  const wagmiClient = wagmi.usePublicClient({ chainId });
   const [offers, setOffers] = react.useState([]);
   const [isProcessing, setIsProcessing] = react.useState(false);
   const [processingError, setProcessingError] = react.useState();
@@ -1430,6 +1562,20 @@ function useBazaarCollectionOffers({
     endIndex: totalCount,
     enabled: enabled && isSupported && totalCount > 0
   });
+  const TAG = `[useBazaarCollectionOffers chain=${chainId} nft=${nftAddress.slice(0, 10)}]`;
+  react.useEffect(() => {
+    console.log(TAG, {
+      enabled,
+      isSupported,
+      totalCount,
+      isLoadingCount,
+      startIndex,
+      endIndex: totalCount,
+      messagesLength: messages?.length ?? 0,
+      isLoadingMessages,
+      messagesError: messagesError?.message
+    });
+  }, [enabled, isSupported, totalCount, isLoadingCount, startIndex, messages?.length, isLoadingMessages, messagesError]);
   react.useEffect(() => {
     if (!isSupported || !enabled) {
       setOffers([]);
@@ -1443,17 +1589,19 @@ function useBazaarCollectionOffers({
     async function processOffers() {
       setIsProcessing(true);
       setProcessingError(void 0);
+      console.log(TAG, `processing ${messages.length} messages...`);
       try {
-        const client = new BazaarClient({ chainId });
-        const validOffers = await client.getCollectionOffers({
-          nftAddress,
-          excludeMaker,
-          maxMessages
-        });
+        const client = new BazaarClient({ chainId, publicClient: wagmiClient });
+        const validOffers = await client.processCollectionOffersFromMessages(
+          messages,
+          { nftAddress, excludeMaker }
+        );
+        console.log(TAG, `processed \u2192 ${validOffers.length} valid offers`);
         if (!cancelled) {
           setOffers(validOffers);
         }
       } catch (err) {
+        console.error(TAG, "processing error:", err);
         if (!cancelled) {
           setProcessingError(err instanceof Error ? err : new Error(String(err)));
           setOffers([]);
@@ -1468,7 +1616,7 @@ function useBazaarCollectionOffers({
     return () => {
       cancelled = true;
     };
-  }, [chainId, nftAddress, excludeMaker, maxMessages, messages, isSupported, enabled, refetchTrigger]);
+  }, [chainId, nftAddress, excludeMaker, messages, isSupported, enabled, refetchTrigger]);
   const refetch = () => {
     refetchMessages();
     setRefetchTrigger((t) => t + 1);
@@ -1487,6 +1635,7 @@ function useBazaarErc20Offers({
   maxMessages = 200,
   enabled = true
 }) {
+  const wagmiClient = wagmi.usePublicClient({ chainId });
   const [offers, setOffers] = react.useState([]);
   const [isProcessing, setIsProcessing] = react.useState(false);
   const [processingError, setProcessingError] = react.useState();
@@ -1528,6 +1677,20 @@ function useBazaarErc20Offers({
     endIndex: totalCount,
     enabled: enabled && hasErc20Offers && totalCount > 0
   });
+  const TAG = `[useBazaarErc20Offers chain=${chainId} token=${tokenAddress.slice(0, 10)}]`;
+  react.useEffect(() => {
+    console.log(TAG, {
+      enabled,
+      hasErc20Offers,
+      totalCount,
+      isLoadingCount,
+      startIndex,
+      endIndex: totalCount,
+      messagesLength: messages?.length ?? 0,
+      isLoadingMessages,
+      messagesError: messagesError?.message
+    });
+  }, [enabled, hasErc20Offers, totalCount, isLoadingCount, startIndex, messages?.length, isLoadingMessages, messagesError]);
   react.useEffect(() => {
     if (!hasErc20Offers || !enabled) {
       setOffers([]);
@@ -1541,17 +1704,19 @@ function useBazaarErc20Offers({
     async function processOffers() {
       setIsProcessing(true);
       setProcessingError(void 0);
+      console.log(TAG, `processing ${messages.length} messages...`);
       try {
-        const client = new BazaarClient({ chainId });
-        const validOffers = await client.getErc20Offers({
-          tokenAddress,
-          excludeMaker,
-          maxMessages
-        });
+        const client = new BazaarClient({ chainId, publicClient: wagmiClient });
+        const validOffers = await client.processErc20OffersFromMessages(
+          messages,
+          { tokenAddress, excludeMaker }
+        );
+        console.log(TAG, `processed \u2192 ${validOffers.length} valid offers`);
         if (!cancelled) {
           setOffers(validOffers);
         }
       } catch (err) {
+        console.error(TAG, "processing error:", err);
         if (!cancelled) {
           setProcessingError(err instanceof Error ? err : new Error(String(err)));
           setOffers([]);
@@ -1566,7 +1731,7 @@ function useBazaarErc20Offers({
     return () => {
       cancelled = true;
     };
-  }, [chainId, tokenAddress, excludeMaker, maxMessages, messages, hasErc20Offers, enabled, refetchTrigger]);
+  }, [chainId, tokenAddress, excludeMaker, messages, hasErc20Offers, enabled, refetchTrigger]);
   const refetch = () => {
     refetchMessages();
     setRefetchTrigger((t) => t + 1);
@@ -1586,8 +1751,11 @@ function useBazaarErc20Listings({
   maxMessages = 200,
   startIndex: startIndexOverride,
   endIndex: endIndexOverride,
-  enabled = true
+  enabled = true,
+  publicClient
 }) {
+  const wagmiClient = wagmi.usePublicClient({ chainId });
+  const resolvedClient = publicClient ?? wagmiClient;
   const [listings, setListings] = react.useState([]);
   const [isProcessing, setIsProcessing] = react.useState(false);
   const [processingError, setProcessingError] = react.useState();
@@ -1628,6 +1796,21 @@ function useBazaarErc20Listings({
     endIndex,
     enabled: enabled && isSupported && (hasRangeOverride || totalCount > 0)
   });
+  const TAG = `[useBazaarErc20Listings chain=${chainId} token=${tokenAddress.slice(0, 10)}]`;
+  react.useEffect(() => {
+    console.log(TAG, {
+      enabled,
+      isSupported,
+      hasRangeOverride,
+      totalCount,
+      isLoadingCount,
+      startIndex,
+      endIndex,
+      messagesLength: messages?.length ?? 0,
+      isLoadingMessages,
+      messagesError: messagesError?.message
+    });
+  }, [enabled, isSupported, hasRangeOverride, totalCount, isLoadingCount, startIndex, endIndex, messages?.length, isLoadingMessages, messagesError]);
   react.useEffect(() => {
     if (!isSupported || !enabled) {
       setListings([]);
@@ -1641,20 +1824,19 @@ function useBazaarErc20Listings({
     async function processListings() {
       setIsProcessing(true);
       setProcessingError(void 0);
+      console.log(TAG, `processing ${messages.length} messages...`);
       try {
-        const client = new BazaarClient({ chainId });
-        const validListings = await client.getErc20Listings({
-          tokenAddress,
-          excludeMaker,
-          maker,
-          maxMessages,
-          startIndex: hasRangeOverride ? startIndexOverride : void 0,
-          endIndex: hasRangeOverride ? endIndexOverride : void 0
-        });
+        const client = new BazaarClient({ chainId, publicClient: resolvedClient });
+        const validListings = await client.processErc20ListingsFromMessages(
+          messages,
+          { tokenAddress, excludeMaker }
+        );
+        console.log(TAG, `processed \u2192 ${validListings.length} valid listings`);
         if (!cancelled) {
           setListings(validListings);
         }
       } catch (err) {
+        console.error(TAG, "processing error:", err);
         if (!cancelled) {
           setProcessingError(err instanceof Error ? err : new Error(String(err)));
           setListings([]);
@@ -1669,7 +1851,7 @@ function useBazaarErc20Listings({
     return () => {
       cancelled = true;
     };
-  }, [chainId, tokenAddress, excludeMaker, maker, maxMessages, startIndexOverride, endIndexOverride, hasRangeOverride, messages, isSupported, enabled, refetchTrigger]);
+  }, [chainId, tokenAddress, excludeMaker, messages, isSupported, enabled, refetchTrigger]);
   const refetch = () => {
     refetchMessages();
     setRefetchTrigger((t) => t + 1);