chore: update react-kit with latest chat-sdk (replace PR #1146)

package.json

@@ -46,8 +46,9 @@
   },
   "dependencies": {
     "@apollo/client": "^3.8.1",
-    "@bosonprotocol/chat-sdk": "^1.3.1-alpha.16",
-    "@bosonprotocol/react-kit": "^0.39.2-alpha.3",
+    "@bosonprotocol/chat-sdk": "^1.4.1-alpha.7",
+    "@bosonprotocol/common": "^1.32.0-alpha.5",
+    "@bosonprotocol/react-kit": "^0.41.0-alpha.5",
     "@davatar/react": "^1.10.4",
     "@ethersproject/address": "^5.6.1",
     "@ethersproject/units": "^5.7.0",
@@ -103,6 +104,7 @@
     "cross-fetch": "^3.1.5",
     "crypto-browserify": "^3.12.0",
     "dayjs": "^1.11.3",
+    "esbuild": "^0.25.3",
     "ethers": "^5.7.0",
     "fetch": "^1.1.0",
     "formik": "^2.2.9",
@@ -195,9 +197,11 @@
     "eslint-plugin-react-hooks": "^4.6.0",
     "eslint-plugin-simple-import-sort": "^12.0.0",
     "eslint-plugin-unused-imports": "^2.0.0",
+    "get-proto": "^1.0.1",
     "husky": "^8.0.1",
     "istanbul": "^0.4.5",
     "lint-staged": "^13.0.3",
+    "math-intrinsics": "^1.1.0",
     "multihashes": "^4.0.3",
     "nyc": "^15.1.0",
     "prettier": "^3.2.5",

src/components/detail/DetailWidget/CommitDetailWidget.tsx

@@ -195,7 +195,8 @@ export const CommitDetailWidget: React.FC<CommitDetailWidgetProps> = ({
               offer.exchangeToken.address,
               constants.MaxInt256,
               {
-                spender: commitProxyAddress
+                spender: commitProxyAddress,
+                returnTxInfo: false
               }
             );
             await tx.wait();
@@ -257,11 +258,11 @@ export const CommitDetailWidget: React.FC<CommitDetailWidgetProps> = ({
     !!commitProxyAddress;
   const { data: sellers } = useSellers(
     {
-      id: offer?.seller.id,
+      id: offer?.seller?.id,
       includeFunds: true
     },
     {
-      enabled: !!offer?.seller.id
+      enabled: !!offer?.seller?.id
     }
   );
   const sellerAvailableDeposit = sellers?.[0]?.funds?.find(

src/components/exchange/Exchange.tsx

@@ -128,7 +128,7 @@ export default function Exchange({
   const handleOnAvatarClick = () => {
     navigate({
       pathname: generatePath(BosonRoutes.SellerPage, {
-        [UrlParameters.sellerId]: offer.seller.id
+        [UrlParameters.sellerId]: offer.seller?.id || null
       })
     });
   };

src/components/modal/components/Chat/MakeProposal/steps/MakeAProposalStep/RefundRequest.tsx

@@ -146,12 +146,12 @@ export default function RefundRequest({ exchange, iAmTheBuyer }: Props) {
                 if (isNaN(valueAsNumber)) {
                   return;
                 }
-                const valueInDecimals: string = formatIntValueToDecimals(
-                  BigNumber.from(inEscrow)
-                    .mul(valueAsNumber * 1000)
-                    .div(100 * 1000)
-                    .toString()
-                );
+                const valueAsString = BigNumber.from(inEscrow)
+                  .mul(valueAsNumber * 1000)
+                  .div(100 * 1000)
+                  .toString();
+                const valueInDecimals: string =
+                  formatIntValueToDecimals(valueAsString);
                 setFieldValue(
                   FormModel.formFields.refundAmount.name,
                   valueInDecimals,

src/components/modal/components/Chat/ResolveDisputeModal.tsx

@@ -4,7 +4,7 @@ import {
   MessageType,
   ThreadId,
   version
-} from "@bosonprotocol/chat-sdk/dist/esm/util/v0.0.1/definitions";
+} from "@bosonprotocol/chat-sdk";
 import { TransactionResponse } from "@bosonprotocol/common";
 import { CoreSDK, hooks, Provider, subgraph } from "@bosonprotocol/react-kit";
 import {
@@ -164,7 +164,7 @@ export default function ResolveDisputeModal({
     symbol: symbol
   });
   const destinationAddressLowerCase = iAmTheBuyer
-    ? exchange?.offer.seller.assistant
+    ? exchange?.offer.seller?.assistant
     : exchange?.buyer.wallet;
   const destinationAddress = destinationAddressLowerCase
     ? utils.getAddress(destinationAddressLowerCase)

src/components/modal/components/Chat/components/EscalateModal/steps/EscalateStepTwo.tsx

@@ -3,7 +3,7 @@ import {
   MessageType,
   ThreadId,
   version
-} from "@bosonprotocol/chat-sdk/dist/esm/util/v0.0.1/definitions";
+} from "@bosonprotocol/chat-sdk";
 import { TransactionResponse } from "@bosonprotocol/common";
 import { CoreSDK, hooks, Provider, subgraph } from "@bosonprotocol/react-kit";
 import {
@@ -216,7 +216,7 @@ function EscalateStepTwo({
       sellerId: exchange.seller.id
     };
   }, [exchange]);
-  const destinationAddressLowerCase = exchange?.offer.seller.assistant;
+  const destinationAddressLowerCase = exchange?.offer.seller?.assistant;
   const destinationAddress = destinationAddressLowerCase
     ? utils.getAddress(destinationAddressLowerCase)
     : "";

src/components/modal/components/Chat/components/ExchangePreview.tsx

@@ -81,7 +81,7 @@ export default function ExchangePreview({ exchange }: Props) {
           <Name>{offer.metadata?.name}</Name>
           <SellerID
             offerMetadata={offer.metadata}
-            accountToShow={offer?.seller}
+            accountToShow={offer?.seller || undefined}
             justifyContent="flex-start"
             withProfileImage
             onClick={() => {

src/components/modal/components/CompleteExchange.tsx

@@ -77,7 +77,7 @@ function CompleteOffer({ offer }: OfferProps) {
               </Typography>
               <SellerID
                 offerMetadata={offer.metadata}
-                accountToShow={offer?.seller}
+                accountToShow={offer?.seller || undefined}
                 withProfileImage
               />
             </div>

src/components/modal/components/DisputeListMobile/DisputeListMobileElement.tsx

@@ -107,7 +107,7 @@ function DisputeListMobileElement({ exchange }: { exchange: Exchange }) {
         <ExchangeName>{exchange?.offer.metadata?.name}</ExchangeName>
         <StyledSellerID
           offerMetadata={exchange?.offer.metadata}
-          accountToShow={exchange?.offer.seller}
+          accountToShow={exchange?.offer.seller || undefined}
           withProfileImage
           onClick={() => null}
         />

src/components/modal/components/DisputeTable/TableElement.tsx

@@ -84,7 +84,7 @@ function TableElement({ exchange }: { exchange: Exchange }) {
             <ExchangeName>{exchange.offer.metadata?.name}</ExchangeName>
             <SellerID
               offerMetadata={exchange.offer.metadata}
-              accountToShow={exchange.offer.seller}
+              accountToShow={exchange.offer.seller || undefined}
               withProfileImage
               onClick={() => null}
             />

src/components/modal/components/RetractDisputeModal.tsx

@@ -3,7 +3,7 @@ import {
   MessageType,
   ThreadId,
   version
-} from "@bosonprotocol/chat-sdk/dist/esm/util/v0.0.1/definitions";
+} from "@bosonprotocol/chat-sdk";
 import { TransactionResponse } from "@bosonprotocol/common";
 import { CoreSDK, hooks, Provider, subgraph } from "@bosonprotocol/react-kit";
 import {

src/components/modal/components/RevokeProduct.tsx

@@ -98,7 +98,7 @@ export default function RevokeProduct({
               </Typography>
               <SellerID
                 offerMetadata={exchange?.offer.metadata}
-                accountToShow={exchange?.offer?.seller}
+                accountToShow={exchange?.offer?.seller || undefined}
                 withProfileImage
               />
             </div>

src/components/modal/components/VoidProduct.tsx

@@ -121,7 +121,7 @@ function VoidProductOffer({ offer, single = false }: OfferProps) {
               <div style={{ marginTop: "0.5rem" }}>
                 <SellerID
                   offerMetadata={offer.metadata}
-                  accountToShow={offer?.seller}
+                  accountToShow={offer?.seller || undefined}
                   withProfileImage
                 />
               </div>

src/components/offers/OfferList.tsx

@@ -174,7 +174,11 @@ export default function OfferList({
                         dataTestId="offer"
                         lensProfile={
                           seller?.lensProfile ||
-                          sellerLensProfilePerSellerId?.get(offer.seller.id)
+                          (offer.seller
+                            ? sellerLensProfilePerSellerId?.get(
+                                offer.seller?.id
+                              )
+                            : undefined)
                         }
                       />
                     </>

src/components/productCard/ProductCard.tsx

@@ -196,7 +196,7 @@ export default function ProductCard({
   const handleOnAvatarClick = () => {
     navigate({
       pathname: generatePath(BosonRoutes.SellerPage, {
-        [UrlParameters.sellerId]: offer.seller.id
+        [UrlParameters.sellerId]: offer.seller?.id || null
       })
     });
   };
@@ -251,7 +251,7 @@ export default function ProductCard({
         dataTestId={dataTestId}
         onCardClick={handleOnCardClick}
         title={offer?.metadata?.name ?? ""}
-        avatarName={name ? name : `Seller ID: ${offer.seller.id}`}
+        avatarName={name ? name : `Seller ID: ${offer.seller?.id}`}
         onAvatarError={() => {
           // to avoid infinite loop
           if (avatarObj.status === "lens" && avatarDifferentIpfsGateway) {

src/components/seller/exchanges/SellerExchanges.tsx

@@ -1,5 +1,5 @@
-import { ThreadId } from "@bosonprotocol/chat-sdk/dist/cjs/util/v0.0.1/definitions";
-import { ThreadObject } from "@bosonprotocol/chat-sdk/dist/esm/util/v0.0.1/definitions";
+import { ThreadId } from "@bosonprotocol/chat-sdk";
+import { ThreadObject } from "@bosonprotocol/chat-sdk";
 import { exchanges as ExchangesKit, subgraph } from "@bosonprotocol/react-kit";
 import * as Sentry from "@sentry/browser";
 import { createWorkerFactory, useWorker } from "@shopify/react-web-worker";

src/components/seller/products/SellerProducts.tsx

@@ -82,8 +82,9 @@ export default function SellerProducts({
   const { products, isLoading, isError, refetch } = productsData;
 
   const allOffers = useMemo(() => {
-    const allOffers =
-      products?.filter((product) => product.seller.id === sellerId) || [];
+    const allOffers = sellerId
+      ? products?.filter((product) => product.seller?.id === sellerId) || []
+      : [];
 
     const filtered =
       allOffers?.map((offer) => {

src/lib/utils/hooks/chat/common.ts

@@ -1,8 +1,5 @@
-import {
-  MessageData,
-  ThreadObject
-} from "@bosonprotocol/chat-sdk/dist/esm/util/v0.0.1/definitions";
-import { matchThreadIds } from "@bosonprotocol/chat-sdk/dist/esm/util/v0.0.1/functions";
+import { MessageData, ThreadObject } from "@bosonprotocol/chat-sdk";
+import { matchThreadIds } from "@bosonprotocol/chat-sdk";
 import dayjs from "dayjs";
 
 export type DateStep =

src/lib/utils/hooks/chat/getThreadWorker.ts

@@ -1,8 +1,5 @@
-import { BosonXmtpClient } from "@bosonprotocol/chat-sdk";
-import {
-  ThreadId,
-  ThreadObject
-} from "@bosonprotocol/chat-sdk/dist/esm/util/v0.0.1/definitions";
+import { BosonXmtpBrowserClient } from "@bosonprotocol/chat-sdk";
+import { ThreadId, ThreadObject } from "@bosonprotocol/chat-sdk";
 import dayjs from "dayjs";
 import { MutableRefObject } from "react";
 
@@ -29,7 +26,7 @@ export async function getThread({
   checkCustomCondition,
   stopRef
 }: {
-  bosonXmtp: BosonXmtpClient;
+  bosonXmtp: BosonXmtpBrowserClient;
   threadId: ThreadId;
   counterParty: string;
   dateIndex: number;

src/lib/utils/hooks/chat/useChatStatus.ts

@@ -1,4 +1,4 @@
-import { BosonXmtpClient } from "@bosonprotocol/chat-sdk";
+import { BosonXmtpBrowserClient } from "@bosonprotocol/chat-sdk";
 import { useConfigContext } from "components/config/ConfigContext";
 import { useEffect, useState } from "react";
 
@@ -41,7 +41,7 @@ export const useChatStatus = (): {
         return;
       }
       setChatInitializationStatus(ChatInitializationStatus.INITIALIZING);
-      BosonXmtpClient.isXmtpEnabled(
+      BosonXmtpBrowserClient.isXmtpEnabled(
         address,
         config.envConfig.envName === "production" ? "production" : "dev",
         chatEnvName

src/lib/utils/hooks/chat/useInfiniteThread.ts

@@ -1,8 +1,5 @@
-import {
-  ThreadId,
-  ThreadObject
-} from "@bosonprotocol/chat-sdk/dist/esm/util/v0.0.1/definitions";
-import { validateMessage } from "@bosonprotocol/chat-sdk/dist/esm/util/validators";
+import { ThreadId, ThreadObject } from "@bosonprotocol/chat-sdk";
+import { validateMessage } from "@bosonprotocol/chat-sdk";
 import { createWorkerFactory, useWorker } from "@shopify/react-web-worker";
 import { utils } from "ethers";
 import { useCallback, useEffect, useRef, useState } from "react";

src/lib/utils/hooks/offer/types.ts

@@ -10,7 +10,7 @@ interface CommonProps {
   voided?: boolean;
   valid?: boolean;
   exchangeTokenAddress?: Offer["exchangeToken"]["address"];
-  sellerId?: Offer["seller"]["id"];
+  sellerId?: string;
   first?: number;
   skip?: number;
   sellerCurationList?: string[];

src/lib/utils/hooks/offer/useCreateOffers.tsx

@@ -202,12 +202,22 @@ export function useCreateOffers() {
             );
             const decimals = await onBeforeBuildCondition();
             const condition = buildCondition(tokenGatedInfo, decimals);
-
+            const sellerAddress = sellerToCreate?.assistant;
+            if (!sellerAddress) {
+              throw new Error(`sellerAddress is falsy "${sellerAddress}"`);
+            }
+            const seller = await coreSDK.getSellerByAssistant(sellerAddress);
+            if (!seller) {
+              throw new Error(
+                `seller could not be found with this address="${sellerAddress}"`
+              );
+            }
+            const sellerId = seller.id;
             if (isMetaTx) {
               const nonce = Date.now();
               const { r, s, v, functionName, functionSignature } =
                 await coreSDK.signMetaTxCreateGroup({
-                  createGroupArgs: { offerIds, ...condition },
+                  createGroupArgs: { offerIds, sellerId, ...condition },
                   nonce
                 });
               txResponse = await coreSDK.relayMetaTransaction({
@@ -221,6 +231,7 @@ export function useCreateOffers() {
             } else {
               txResponse = await coreSDK.createGroup({
                 offerIds,
+                sellerId,
                 ...condition
               });
             }

src/lib/utils/hooks/offers/types.ts

@@ -10,7 +10,7 @@ interface CommonProps {
   voided?: boolean;
   valid?: boolean;
   exchangeTokenAddress?: Offer["exchangeToken"]["address"];
-  sellerId?: Offer["seller"]["id"];
+  sellerId?: string;
   first?: number;
   skip?: number;
   sellerCurationList?: string[];

src/lib/utils/hooks/product/useProducts.ts

@@ -140,8 +140,8 @@ export default function useProducts(
             : (product as subgraph.ProductV1Product).variants;
           const offers = (allVariantsOrOnlyNotVoided || [])?.map(
             ({ offer }) => {
-              if (!sellerMap.has(offer.seller.id)) {
-                sellerMap.set(offer.seller.id, offer.seller);
+              if (!!offer.seller && !sellerMap.has(offer.seller?.id)) {
+                sellerMap.set(offer.seller?.id, offer.seller);
               }
               const status = offersSdk.getOfferStatus(offer);
               const offerPrice = convertPrice({
@@ -336,7 +336,7 @@ export default function useProducts(
       sellerIds?.map((sellerId) => {
         const products =
           groupedSellers[sellerId as keyof typeof groupedSellers];
-        const seller = products?.[0]?.seller || {};
+        const seller: { id?: string } = products?.[0]?.seller || {};
         const title = products?.[0]?.title || {};
         return {
           ...seller,
@@ -372,7 +372,9 @@ export default function useProducts(
           offers: products, // REASSIGN OFFERS for compatibility with previous code
           products,
           numExchanges: exchangesBySellers.data?.[sellerId]?.length ?? 0,
-          lensProfile: sellerLensProfilePerSellerId?.get(seller.id)
+          lensProfile: seller.id
+            ? sellerLensProfilePerSellerId?.get(seller.id)
+            : undefined
         };
       }) || []
     );

src/lib/utils/product/extractUniqueRandomProducts.ts

@@ -15,7 +15,7 @@ export default function extractUniqueRandomProducts({
   products,
   quantity
 }: Props) {
-  const sellerIdToProducts = groupBy(products, (p) => p.seller.id);
+  const sellerIdToProducts = groupBy(products, (p) => p.seller?.id);
   const productsToReturn: ExtendedOffer[] = [];
   const maxProductsToReturn = Math.min(products.length, quantity);
   for (

src/pages/bundles/BundleDetail.tsx

@@ -158,7 +158,7 @@ export default function BundleDetail() {
             <SellerAndOpenSeaGrid>
               <SellerID
                 offerMetadata={selectedOffer.metadata}
-                accountToShow={selectedOffer?.seller}
+                accountToShow={selectedOffer?.seller || undefined}
                 justifyContent="flex-start"
                 withProfileImage
               />