@b3dotfun/sdk 0.0.7-alpha.6 → 0.0.7-alpha.8

package/src/anyspend/react/components/AnySpendBuySpin.tsx

@@ -1,19 +1,16 @@
 import { B3_TOKEN, OrderType } from "@b3dotfun/sdk/anyspend";
-import { baseMainnet } from "@b3dotfun/sdk/shared/constants/chains/supported";
-import { EthIcon } from "./icons/EthIcon";
-import { SolIcon } from "./icons/SolIcon";
-import { UsdcIcon } from "./icons/USDCIcon";
-import { StyleRoot } from "@b3dotfun/sdk/global-account/react";
 import {
   Button,
   GlareCardRounded,
   Input,
+  StyleRoot,
   TextLoop,
   useChainSwitchWithAction,
   useHasMounted,
-  useTokenBalance,
-  useModalStore
+  useModalStore,
+  useTokenBalance
 } from "@b3dotfun/sdk/global-account/react";
+import { baseMainnet } from "@b3dotfun/sdk/shared/constants/chains/supported";
 import { motion } from "framer-motion";
 import invariant from "invariant";
 import { ArrowRight, Loader2 } from "lucide-react";
@@ -22,6 +19,9 @@ import { toast } from "sonner";
 import { createPublicClient, encodeFunctionData, erc20Abi, formatUnits, http } from "viem";
 import { useAccount, useWaitForTransactionReceipt, useWriteContract } from "wagmi";
 import { AnySpendCustom } from "./AnySpendCustom";
+import { EthIcon } from "./icons/EthIcon";
+import { SolIcon } from "./icons/SolIcon";
+import { UsdcIcon } from "./icons/USDCIcon";
 
 const SPIN_WHEEL_ABI = [
   {
@@ -668,6 +668,7 @@ export function AnySpendBuySpin({
       spenderAddress={paymentConfig.entryModule}
       encodedData={encodedData}
       metadata={{
+        type: OrderType.Custom,
         action: `buy ${userSpinQuantity} spin${userSpinQuantity !== "1" ? "s" : ""}`
       }}
       header={header}

package/src/anyspend/react/components/AnySpendCustom.tsx

@@ -1,8 +1,13 @@
 import {
+  AnySpendMetadata,
+  CreateOrderParams,
   eqci,
   getDefaultToken,
   GetQuoteRequest,
   GetQuoteResponse,
+  isCustomTxMetadata,
+  isNftMetadata,
+  isTournamentMetadata,
   NftType,
   OnrampVendor,
   OrderStatus,
@@ -17,26 +22,27 @@ import {
   useAnyspendTokenList,
   useGeoOnrampOptions
 } from "@b3dotfun/sdk/anyspend";
-import { useB3, StyleRoot } from "@b3dotfun/sdk/global-account/react";
 import {
   Badge,
   Button,
   ShinyButton,
   Skeleton,
+  StyleRoot,
   Tabs,
   TabsContent,
   TabsList,
   TabTrigger,
+  TextShimmer,
+  TransitionPanel,
   useAccountWallet,
+  useB3,
   useBsmntProfile,
   useHasMounted,
-  useRouter,
-  useTokenBalancesByChain,
   useModalStore,
-  useSearchParamsSSR
+  useRouter,
+  useSearchParamsSSR,
+  useTokenBalancesByChain
 } from "@b3dotfun/sdk/global-account/react";
-import { TextShimmer } from "@b3dotfun/sdk/global-account/react";
-import { TransitionPanel } from "@b3dotfun/sdk/global-account/react";
 import { cn } from "@b3dotfun/sdk/shared/utils";
 import centerTruncate from "@b3dotfun/sdk/shared/utils/centerTruncate";
 import { formatTokenAmount } from "@b3dotfun/sdk/shared/utils/number";
@@ -68,6 +74,8 @@ function generateGetRelayQuoteRequest({
   dstToken,
   dstAmount,
   contractAddress,
+  tokenId,
+  contractType,
   encodedData,
   spenderAddress
 }: {
@@ -78,6 +86,8 @@ function generateGetRelayQuoteRequest({
   dstToken: Token;
   dstAmount: string;
   contractAddress: string;
+  tokenId?: number | null;
+  contractType?: NftType;
   encodedData: string;
   spenderAddress?: string;
 }): GetQuoteRequest {
@@ -90,7 +100,9 @@ function generateGetRelayQuoteRequest({
         dstChain: dstChainId,
         dstTokenAddress: dstToken.address,
         price: dstAmount,
-        contractAddress: contractAddress
+        contractAddress: contractAddress,
+        tokenId: tokenId!,
+        contractType: contractType!
       };
     }
     case OrderType.JoinTournament: {
@@ -164,7 +176,7 @@ export function AnySpendCustom({
   dstAmount: string;
   contractAddress: string;
   encodedData: string;
-  metadata: any;
+  metadata: AnySpendMetadata;
   header: ({
     anyspendPrice,
     isLoadingAnyspendPrice
@@ -274,6 +286,8 @@ export function AnySpendCustom({
     dstToken: dstToken,
     dstAmount: dstAmount,
     contractAddress: contractAddress,
+    tokenId: isNftMetadata(metadata) ? metadata.nftContract.tokenId : undefined,
+    contractType: isNftMetadata(metadata) ? metadata.nftContract.type : undefined,
     encodedData: encodedData,
     spenderAddress: spenderAddress
   });
@@ -372,23 +386,37 @@ export function AnySpendCustom({
         srcAmount: srcAmount.toString(),
         recipientAddress,
         creatorAddress: currentWallet?.wallet?.address,
-        nft: {
-          ...metadata.nftContract,
-          type: NftType.ERC721
-        },
-        tournament: {
-          ...metadata.tournament,
-          contractAddress: contractAddress,
-          entryPriceOrFundAmount: dstAmount
-        },
+        nft: isNftMetadata(metadata)
+          ? metadata.nftContract.type === NftType.ERC1155
+            ? {
+                type: NftType.ERC1155,
+                contractAddress: metadata.nftContract.contractAddress,
+                tokenId: metadata.nftContract.tokenId!,
+                imageUrl: metadata.nftContract.imageUrl,
+                nftPrice: dstAmount
+              }
+            : {
+                type: NftType.ERC721,
+                contractAddress: metadata.nftContract.contractAddress,
+                contractType: metadata.nftContract.type,
+                nftPrice: dstAmount
+              }
+          : undefined,
+        tournament: isTournamentMetadata(metadata)
+          ? {
+              ...metadata.tournament,
+              contractAddress: contractAddress,
+              entryPriceOrFundAmount: dstAmount
+            }
+          : undefined,
         payload: {
           amount: dstAmount,
           data: encodedData,
           spenderAddress: spenderAddress,
           to: contractAddress,
-          action: metadata.action
+          action: isCustomTxMetadata(metadata) ? metadata.action : undefined
         }
-      };
+      } as CreateOrderParams;
 
       if (onramp) {
         invariant(srcToken.address === USDC_BASE.address, "Selected src token is not USDC");
@@ -749,14 +777,30 @@ export function AnySpendCustom({
               onOrderCreated={(orderId: string) => setOrderId(orderId)}
               onBack={() => setActiveTab("crypto")}
               orderType={orderType}
-              nft={metadata.nftContract ? { ...metadata.nftContract, price: dstAmount } : undefined}
-              tournament={
-                metadata.tournament
-                  ? { ...metadata.tournament, contractAddress: contractAddress, entryPriceOrFundAmount: dstAmount }
+              nft={
+                isNftMetadata(metadata)
+                  ? metadata.nftContract.type === NftType.ERC1155
+                    ? {
+                        type: NftType.ERC1155,
+                        contractAddress: metadata.nftContract.contractAddress,
+                        tokenId: metadata.nftContract.tokenId!,
+                        imageUrl: metadata.nftContract.imageUrl,
+                        name: metadata.nftContract.name,
+                        description: metadata.nftContract.description,
+                        price: dstAmount
+                      }
+                    : {
+                        type: NftType.ERC721,
+                        contractAddress: metadata.nftContract.contractAddress,
+                        name: metadata.nftContract.name,
+                        description: metadata.nftContract.description,
+                        imageUrl: metadata.nftContract.imageUrl,
+                        price: dstAmount
+                      }
                   : undefined
               }
               payload={
-                metadata.action
+                isCustomTxMetadata(metadata)
                   ? {
                       ...metadata,
                       amount: dstAmount,

package/src/anyspend/react/components/AnySpendNFT.tsx

@@ -1,5 +1,4 @@
 import { ALL_CHAINS, getChainName, getExplorerAddressUrl, GetQuoteResponse, OrderType } from "@b3dotfun/sdk/anyspend";
-import { DEFAULT_NFT_CONTRACT } from "@b3dotfun/sdk/anyspend/constants";
 import { NftContract } from "@b3dotfun/sdk/anyspend/types";
 import { GlareCard, Popover, PopoverContent, PopoverTrigger } from "@b3dotfun/sdk/global-account/react";
 import { cn } from "@b3dotfun/sdk/shared/utils";
@@ -16,13 +15,15 @@ export function AnySpendNFT({
   loadOrder,
   mode = "modal",
   recipientAddress,
-  nftContract = DEFAULT_NFT_CONTRACT
+  nftContract,
+  onSuccess
 }: {
   isMainnet?: boolean;
   loadOrder?: string;
   mode?: "modal" | "page";
   recipientAddress?: string;
-  nftContract?: NftContract;
+  nftContract: NftContract;
+  onSuccess?: (txHash?: string) => void;
 }) {
   const header = ({
     anyspendPrice,
@@ -78,8 +79,12 @@ export function AnySpendNFT({
       dstAmount={nftContract.price}
       contractAddress={nftContract.contractAddress}
       encodedData="0x"
-      metadata={{ nftContract }}
+      metadata={{
+        type: OrderType.MintNFT,
+        nftContract: nftContract
+      }}
       header={header}
+      onSuccess={onSuccess}
     />
   );
 }

package/src/anyspend/react/components/AnySpendStakeB3.tsx

@@ -1,17 +1,14 @@
 import { ABI_ERC20_STAKING, B3_TOKEN, OrderType } from "@b3dotfun/sdk/anyspend";
-import { EthIcon } from "./icons/EthIcon";
-import { SolIcon } from "./icons/SolIcon";
-import { UsdcIcon } from "./icons/USDCIcon";
 import {
   Button,
   GlareCardRounded,
   Input,
+  StyleRoot,
   TextLoop,
+  useChainSwitchWithAction,
   useHasMounted,
   useModalStore,
-  useChainSwitchWithAction,
-  useTokenBalance,
-  StyleRoot
+  useTokenBalance
 } from "@b3dotfun/sdk/global-account/react";
 import { formatTokenAmount } from "@b3dotfun/sdk/shared/utils/number";
 import { motion } from "framer-motion";
@@ -23,6 +20,9 @@ import { createPublicClient, encodeFunctionData, erc20Abi, http } from "viem";
 import { base } from "viem/chains";
 import { useAccount, useWaitForTransactionReceipt, useWriteContract } from "wagmi";
 import { AnySpendCustom } from "./AnySpendCustom";
+import { EthIcon } from "./icons/EthIcon";
+import { SolIcon } from "./icons/SolIcon";
+import { UsdcIcon } from "./icons/USDCIcon";
 
 const basePublicClient = createPublicClient({
   chain: base,
@@ -483,6 +483,7 @@ export function AnySpendStakeB3({
       contractAddress={ERC20Staking}
       encodedData={encodedData}
       metadata={{
+        type: OrderType.Custom,
         action: "stake B3"
       }}
       header={header}

package/src/anyspend/react/components/AnySpendTournament.tsx

@@ -100,7 +100,10 @@ export function AnySpendTournament(props: AnySpendTournamentProps) {
       dstAmount={dstAmount}
       contractAddress={tournamentContractAddress}
       encodedData="0x"
-      metadata={{ tournament: tournamentMetadata }}
+      metadata={{
+        type: action === "join" ? OrderType.JoinTournament : OrderType.FundTournament,
+        tournament: tournamentMetadata
+      }}
       header={header}
       onSuccess={onSuccess}
       showRecipient={action === "join"}

package/src/anyspend/react/components/common/OrderDetails.tsx

@@ -23,17 +23,17 @@ import {
   zTournament
 } from "@b3dotfun/sdk/anyspend";
 import {
-  CopyToClipboard,
   Badge,
+  Button,
+  CopyToClipboard,
   ShinyButton,
   Skeleton,
   TextLoop,
   TextShimmer,
-  Button,
   useAccountWallet,
   useChainSwitchWithAction,
-  useOnchainName,
-  useModalStore
+  useModalStore,
+  useOnchainName
 } from "@b3dotfun/sdk/global-account/react";
 import { cn } from "@b3dotfun/sdk/shared/utils";
 import centerTruncate from "@b3dotfun/sdk/shared/utils/centerTruncate";
@@ -334,7 +334,7 @@ export const OrderDetails = memo(function OrderDetails({
 
   // When waitingForDeposit is true, we show a message to the user to wait for the deposit to be processed.
   const setWaitingForDeposit = useCallback(() => {
-    const params = new URLSearchParams(searchParams);
+    const params = new URLSearchParams(searchParams.toString());
     params.set("waitingForDeposit", "true");
     router.push(`?${params}`);
   }, [router, searchParams]);

package/src/anyspend/services/anyspend.ts

@@ -1,3 +1,5 @@
+import { ANYSPEND_MAINNET_BASE_URL, ANYSPEND_TESTNET_BASE_URL } from "@b3dotfun/sdk/anyspend/constants";
+import { OnrampOptions } from "@b3dotfun/sdk/anyspend/react";
 import {
   GetOrderAndTxsResponse,
   GetQuoteRequest,
@@ -11,8 +13,6 @@ import {
 } from "@b3dotfun/sdk/anyspend/types";
 import { getNativeToken, isNativeToken } from "@b3dotfun/sdk/anyspend/utils";
 import invariant from "invariant";
-import { ANYSPEND_MAINNET_BASE_URL, ANYSPEND_TESTNET_BASE_URL } from "@b3dotfun/sdk/anyspend/constants";
-import { OnrampOptions } from "@b3dotfun/sdk/anyspend/react";
 
 // Service functions
 export const anyspendService = {

package/src/anyspend/types/index.ts

@@ -3,6 +3,7 @@ export * from "./req-res";
 export * from "./chain";
 export * from "./custom";
 export * from "./globalWallet";
+export * from "./metadata";
 export * from "./nft";
 export * from "./onramp";
 export * from "./order";

package/src/anyspend/types/metadata.ts

@@ -0,0 +1,41 @@
+import { NftContract } from "./nft";
+import { OrderType } from "./order";
+
+export type BaseMetadata = {
+  type: OrderType;
+};
+
+export type NftMetadata = BaseMetadata & {
+  type: OrderType.MintNFT;
+  nftContract: NftContract;
+};
+
+export type TournamentMetadata = BaseMetadata & {
+  type: OrderType.JoinTournament | OrderType.FundTournament;
+  tournament: {
+    slug: string;
+    name: string;
+    description: string;
+    imageUrl: string;
+  };
+};
+
+export type CustomTxMetadata = BaseMetadata & {
+  type: OrderType.Custom;
+  action: string;
+};
+
+export type AnySpendMetadata = NftMetadata | TournamentMetadata | CustomTxMetadata;
+
+// Type guard functions
+export function isNftMetadata(metadata: AnySpendMetadata): metadata is NftMetadata {
+  return metadata.type === OrderType.MintNFT;
+}
+
+export function isTournamentMetadata(metadata: AnySpendMetadata): metadata is TournamentMetadata {
+  return metadata.type === OrderType.JoinTournament || metadata.type === OrderType.FundTournament;
+}
+
+export function isCustomTxMetadata(metadata: AnySpendMetadata): metadata is CustomTxMetadata {
+  return metadata.type === OrderType.Custom;
+}

package/src/anyspend/types/nft.ts

@@ -49,4 +49,5 @@ export interface NftContract {
   name: string;
   description: string;
   tokenId: number | null;
+  type: NftType;
 }

package/src/anyspend/types/req-res/getQuote.ts

@@ -1,9 +1,10 @@
 import { QuoteDetails } from "@reservoir0x/relay-sdk";
 import { z } from "zod";
 
+import { zCustomPayload } from "../custom";
+import { NftType } from "../nft";
 import { OrderType } from "../order";
 import { TradeType } from "../relay";
-import { zCustomPayload } from "../custom";
 
 const zGetQuoteBody = z.object({
   srcChain: z.number(),
@@ -21,6 +22,8 @@ const zGetQuoteForSwapOrderBody = zGetQuoteBody.extend({
 const zGetQuoteForMintNftOrderBody = zGetQuoteBody.extend({
   type: z.literal(OrderType.MintNFT),
   contractAddress: z.string(),
+  tokenId: z.number().nullable(),
+  contractType: z.nativeEnum(NftType),
   price: z.string()
 });
 

package/src/anyspend/utils/orderPayload.ts

@@ -1,4 +1,4 @@
-import { Nft, OrderType, Token, Tournament } from "@b3dotfun/sdk/anyspend/types";
+import { Nft, NftType, OrderType, Token, Tournament } from "@b3dotfun/sdk/anyspend/types";
 import { normalizeAddress } from "@b3dotfun/sdk/anyspend/utils";
 
 export type OrderParams = {
@@ -20,10 +20,22 @@ export const buildPayload = (orderType: OrderType, params: OrderParams) => {
         actualDstAmount: null
       };
     case OrderType.MintNFT:
-      return {
-        contractAddress: nft ? normalizeAddress(nft.contractAddress) : "",
-        nftPrice: nft?.price || ""
-      };
+      if (nft?.type === NftType.ERC1155) {
+        return {
+          contractAddress: normalizeAddress(nft.contractAddress),
+          nftPrice: nft?.price || "",
+          tokenId: nft?.tokenId!,
+          contractType: nft?.type
+        };
+      } else if (nft?.type === NftType.ERC721) {
+        return {
+          contractAddress: normalizeAddress(nft.contractAddress),
+          nftPrice: nft?.price || "",
+          contractType: nft?.type
+        };
+      } else {
+        throw new Error(`Invalid nft payload: ${JSON.stringify(nft)}`);
+      }
     case OrderType.JoinTournament:
       return {
         contractAddress: tournament?.contractAddress,