@b3dotfun/sdk 0.0.31 → 0.0.32-alpha.1

package/src/anyspend/react/hooks/useAnyspendFlow.ts

@@ -7,12 +7,19 @@ import {
   useGeoOnrampOptions,
 } from "@b3dotfun/sdk/anyspend/react";
 import { anyspendService } from "@b3dotfun/sdk/anyspend/services/anyspend";
-import { useAccountWallet, useProfile, useRouter, useSearchParamsSSR } from "@b3dotfun/sdk/global-account/react";
+import {
+  useAccountWallet,
+  useProfile,
+  useRouter,
+  useSearchParamsSSR,
+  useTokenBalance,
+} from "@b3dotfun/sdk/global-account/react";
 import { formatTokenAmount, formatUnits } from "@b3dotfun/sdk/shared/utils/number";
-import { useEffect, useState } from "react";
+import { useEffect, useMemo, useState } from "react";
 import { toast } from "sonner";
 import { parseUnits } from "viem";
 import { base, mainnet } from "viem/chains";
+import { useAccount } from "wagmi";
 import { components } from "../../types/api";
 import { CryptoPaymentMethodType } from "../components/common/CryptoPaymentMethod";
 import { FiatPaymentMethod } from "../components/common/FiatPaymentMethod";
@@ -36,6 +43,7 @@ interface UseAnyspendFlowProps {
   sourceTokenAddress?: string;
   sourceTokenChainId?: number;
   slippage?: number;
+  disableUrlParamManagement?: boolean;
 }
 
 export function useAnyspendFlow({
@@ -48,6 +56,7 @@ export function useAnyspendFlow({
   sourceTokenAddress,
   sourceTokenChainId,
   slippage = 0,
+  disableUrlParamManagement = false,
 }: UseAnyspendFlowProps) {
   const searchParams = useSearchParamsSSR();
   const router = useRouter();
@@ -76,6 +85,7 @@ export function useAnyspendFlow({
 
   // Recipient state
   const { address: globalAddress } = useAccountWallet();
+  const { address: wagmiAddress } = useAccount();
   const [selectedRecipientAddress, setSelectedRecipientAddress] = useState<string | undefined>(recipientAddress);
   const recipientProfile = useProfile({ address: selectedRecipientAddress, fresh: true });
   const recipientName = recipientProfile.data?.name;
@@ -87,11 +97,33 @@ export function useAnyspendFlow({
     }
   }, [selectedRecipientAddress, globalAddress]);
 
+  // Check token balance for crypto payments
+  const { rawBalance, isLoading: isBalanceLoading } = useTokenBalance({
+    token: selectedSrcToken,
+    address: wagmiAddress,
+  });
+
+  // Check if user has enough balance
+  const hasEnoughBalance = useMemo(() => {
+    if (!rawBalance || isBalanceLoading || paymentType !== "crypto") return false;
+    try {
+      const requiredAmount = parseUnits(srcAmount.replace(/,/g, ""), selectedSrcToken.decimals);
+      return rawBalance >= requiredAmount;
+    } catch {
+      return false;
+    }
+  }, [rawBalance, srcAmount, selectedSrcToken.decimals, isBalanceLoading, paymentType]);
+
+  // Auto-set crypto payment method based on balance
   useEffect(() => {
-    if (paymentType === "crypto") {
-      setSelectedCryptoPaymentMethod(CryptoPaymentMethodType.CONNECT_WALLET);
+    if (paymentType === "crypto" && !isBalanceLoading) {
+      if (hasEnoughBalance) {
+        setSelectedCryptoPaymentMethod(CryptoPaymentMethodType.CONNECT_WALLET);
+      } else {
+        setSelectedCryptoPaymentMethod(CryptoPaymentMethodType.TRANSFER_CRYPTO);
+      }
     }
-  }, [paymentType]);
+  }, [paymentType, hasEnoughBalance, isBalanceLoading]);
 
   // Fetch specific token when sourceTokenAddress and sourceTokenChainId are provided
   useEffect(() => {
@@ -159,14 +191,14 @@ export function useAnyspendFlow({
 
   // Update useEffect for URL parameter to not override loadOrder
   useEffect(() => {
-    if (loadOrder) return; // Skip if we have a loadOrder
+    if (loadOrder || disableUrlParamManagement) return; // Skip if we have a loadOrder or URL param management is disabled
 
     const orderIdParam = searchParams.get("orderId");
     if (orderIdParam) {
       setOrderId(orderIdParam);
       setActivePanel(PanelView.ORDER_DETAILS);
     }
-  }, [searchParams, loadOrder]);
+  }, [searchParams, loadOrder, disableUrlParamManagement]);
 
   // Order creation hooks
   const { createOrder, isCreatingOrder } = useAnyspendCreateOrder({
@@ -177,16 +209,18 @@ export function useAnyspendFlow({
       onOrderSuccess?.(newOrderId);
 
       // Add orderId and payment method to URL for persistence
-      const params = new URLSearchParams(searchParams.toString()); // Preserve existing params
-      params.set("orderId", newOrderId);
-      if (selectedCryptoPaymentMethod !== CryptoPaymentMethodType.NONE) {
-        console.log("Setting cryptoPaymentMethod in URL:", selectedCryptoPaymentMethod);
-        params.set("cryptoPaymentMethod", selectedCryptoPaymentMethod);
-      } else {
-        console.log("Payment method is NONE, not setting in URL");
+      if (!disableUrlParamManagement) {
+        const params = new URLSearchParams(searchParams.toString()); // Preserve existing params
+        params.set("orderId", newOrderId);
+        if (selectedCryptoPaymentMethod !== CryptoPaymentMethodType.NONE) {
+          console.log("Setting cryptoPaymentMethod in URL:", selectedCryptoPaymentMethod);
+          params.set("cryptoPaymentMethod", selectedCryptoPaymentMethod);
+        } else {
+          console.log("Payment method is NONE, not setting in URL");
+        }
+        console.log("Final URL params:", params.toString());
+        router.push(`${window.location.pathname}?${params.toString()}`);
       }
-      console.log("Final URL params:", params.toString());
-      router.push(`${window.location.pathname}?${params.toString()}`);
     },
     onError: error => {
       console.error(error);
@@ -245,6 +279,9 @@ export function useAnyspendFlow({
     setSelectedRecipientAddress,
     recipientName,
     globalAddress,
+    // Balance check
+    hasEnoughBalance,
+    isBalanceLoading,
     // Quote data
     anyspendQuote,
     isLoadingAnyspendQuote,

package/src/anyspend/types/api.ts

@@ -51,7 +51,7 @@ export interface paths {
                 decimals: number;
                 metadata: {
                   /** @description Token logo URI */
-                  logoURI: string;
+                  logoURI?: string;
                 };
               }[];
               /** @example 200 */
@@ -880,28 +880,47 @@ export interface components {
        * @description Country code
        * @example US
        */
-      country?: string;
+      country: string;
       /**
        * @description Onramp vendor used
        * @example stripe-web2
        * @enum {string}
        */
-      vendor?: "coinbase" | "stripe" | "stripe-web2";
+      vendor: "coinbase" | "stripe" | "stripe-web2";
       /**
        * @description Payment method used
        * @example
        */
-      paymentMethod?: string;
+      paymentMethod: string;
       /**
        * @description Redirect URL after payment
        * @example https://www.anyspend.com
        */
-      redirectUrl?: string;
+      redirectUrl: string;
       /**
        * @description Stripe payment amount in cents
        * @example 9900
        */
       stripeAmountInCents?: number;
+      /**
+       * Format: ipv4
+       * @description Optional IP address for location detection
+       * @example 192.168.1.1
+       */
+      ipAddress?: string;
+      /** @description Optional fingerprint data for fraud detection */
+      fingerprint?: {
+        /**
+         * @description Fingerprint request ID
+         * @example fp_req_12345
+         */
+        requestId: string;
+        /**
+         * @description Fingerprint visitor ID
+         * @example fp_visitor_67890
+         */
+        visitorId: string;
+      };
     };
     /** @description Optional onramp configuration */
     Onramp: {
@@ -1522,10 +1541,10 @@ export interface components {
        */
       chain: number;
       /**
-       * @description Sender address
+       * @description Sender address (can be null)
        * @example 0xa7539e73700B1726aBA29526606442A491Ef5747
        */
-      from: string;
+      from?: string | null;
       /**
        * @description Transaction hash
        * @example 0x60ece99a645201668d20db6775a6b3d30967433ff0750b356cdad46d3e13f9c8

package/src/global-account/react/components/B3Provider/B3Provider.native.tsx

@@ -4,7 +4,7 @@ import { useState } from "react";
 import { ThirdwebProvider, useActiveAccount } from "thirdweb/react";
 import { Account } from "thirdweb/wallets";
 
-import { User } from "@b3dotfun/sdk/global-account/types/b3-api.types";
+import { Users } from "@b3dotfun/b3-api";
 import { B3Context, B3ContextType } from "./types";
 
 /**
@@ -64,7 +64,7 @@ export function InnerProvider({
   theme: "light" | "dark";
 }) {
   const activeAccount = useActiveAccount();
-  const [user, setUser] = useState<User | undefined>(undefined);
+  const [user, setUser] = useState<Users | undefined>(undefined);
 
   // Use given accountOverride or activeAccount from thirdweb
   const effectiveAccount = accountOverride || activeAccount;

package/src/global-account/react/components/B3Provider/B3Provider.tsx

@@ -1,5 +1,4 @@
 import { RelayKitProviderWrapper, TooltipProvider, useAuthStore } from "@b3dotfun/sdk/global-account/react";
-import { User } from "@b3dotfun/sdk/global-account/types/b3-api.types";
 import { PermissionsConfig } from "@b3dotfun/sdk/global-account/types/permissions";
 import { loadGA4Script } from "@b3dotfun/sdk/global-account/utils/analytics";
 import { supportedChains } from "@b3dotfun/sdk/shared/constants/chains/supported";
@@ -18,6 +17,7 @@ import { createConfig, http, WagmiProvider } from "wagmi";
 import { StyleRoot } from "../StyleRoot";
 import { B3Context, B3ContextType } from "./types";
 
+import { Users } from "@b3dotfun/b3-api";
 import "@reservoir0x/relay-kit-ui/styles.css";
 
 /**
@@ -115,7 +115,7 @@ export function InnerProvider({
   const setActiveWallet = useSetActiveWallet();
   const isAuthenticated = useAuthStore(state => state.isAuthenticated);
 
-  const [user, setUser] = useState<User | undefined>(undefined);
+  const [user, setUser] = useState<Users | undefined>(undefined);
 
   // Use given accountOverride or activeAccount from thirdweb
   const effectiveAccount = isAuthenticated ? accountOverride || activeAccount : undefined;

package/src/global-account/react/components/B3Provider/types.ts

@@ -1,8 +1,7 @@
-import { Account } from "thirdweb/wallets";
-import { User } from "@b3dotfun/sdk/global-account/types/b3-api.types";
-import { Wallet } from "thirdweb/wallets";
+import { Users } from "@b3dotfun/b3-api";
 import { PermissionsConfig } from "@b3dotfun/sdk/global-account/types/permissions";
 import { createContext } from "react";
+import { Account, Wallet } from "thirdweb/wallets";
 
 /**
  * Context type for B3Provider
@@ -10,10 +9,10 @@ import { createContext } from "react";
 export interface B3ContextType {
   account?: Account;
   automaticallySetFirstEoa: boolean;
-  user?: User;
+  user?: Users;
   setWallet: (wallet: Wallet) => void;
   wallet?: Wallet;
-  setUser: (user?: User) => void;
+  setUser: (user?: Users) => void;
   initialized: boolean;
   ready: boolean;
   environment?: "development" | "production";

package/src/global-account/react/components/ManageAccount/ManageAccount.tsx

@@ -1,3 +1,4 @@
+import app from "@b3dotfun/sdk/global-account/app";
 import {
   Button,
   ManageAccountModalProps,
@@ -8,16 +9,18 @@ import {
   TWSignerWithMetadata,
   useAccountAssets,
   useAuthentication,
+  useB3,
   useGetAllTWSigners,
   useModalStore,
+  useQueryB3,
   useRemoveSessionKey,
 } from "@b3dotfun/sdk/global-account/react";
 import { SignOutIcon } from "@b3dotfun/sdk/global-account/react/components/icons/SignOutIcon";
 import { formatNumber } from "@b3dotfun/sdk/shared/utils/formatNumber";
-
 import { client } from "@b3dotfun/sdk/shared/utils/thirdweb";
-import { BarChart3, Coins, Image, LinkIcon, Loader2, Settings, UnlinkIcon } from "lucide-react";
-import { useState } from "react";
+import { BarChart3, Coins, Copy, Image, LinkIcon, Loader2, Pencil, Settings, UnlinkIcon } from "lucide-react";
+import { useRef, useState } from "react";
+import { toast } from "sonner";
 import { Chain } from "thirdweb";
 import { useActiveAccount, useProfiles, useUnlinkProfile } from "thirdweb/react";
 import { formatUnits } from "viem";
@@ -26,6 +29,7 @@ import { getProfileDisplayInfo } from "../../utils/profileDisplay";
 import { AccountAssets } from "../AccountAssets/AccountAssets";
 import { ContentTokens } from "./ContentTokens";
 
+import { Referrals, Users } from "@b3dotfun/b3-api";
 import { BalanceContent } from "./BalanceContent";
 
 type TabValue = "overview" | "tokens" | "nfts" | "apps" | "settings";
@@ -130,6 +134,50 @@ export function ManageAccount({
     const { data: profilesRaw = [], isLoading: isLoadingProfiles } = useProfiles({ client });
     const { mutate: unlinkProfile, isPending: isUnlinking } = useUnlinkProfile();
     const { setB3ModalOpen, setB3ModalContentType, isLinking } = useModalStore();
+    const { user, setUser } = useB3();
+    const [isUpdatingCode, setIsUpdatingCode] = useState(false);
+    const [newReferralCode, setNewReferralCode] = useState("");
+    const [isEditingCode, setIsEditingCode] = useState(false);
+    const referallCodeRef = useRef<HTMLInputElement>(null);
+    const { data: referrals, isLoading: isLoadingReferrals } = useQueryB3(
+      "referrals",
+      "find",
+      { query: { referrerId: user?.userId } },
+      !!user?.userId,
+    );
+
+    // Fetch referred users
+    const currentReferralCode = user?.referralCode || user?.userId || "";
+
+    const handleCopyCode = async () => {
+      try {
+        await navigator.clipboard.writeText(currentReferralCode);
+        toast.success("Referral code copied to clipboard!");
+      } catch (error) {
+        toast.error("Failed to copy referral code");
+      }
+    };
+
+    const handleUpdateReferralCode = async () => {
+      if (!newReferralCode) return;
+
+      setIsUpdatingCode(true);
+      try {
+        // @ts-expect-error - setReferralCode is not typed for some reason
+        const newUser = await app.service("users").setReferralCode({
+          userId: user?.userId,
+          referralCode: newReferralCode,
+        });
+        setUser(newUser as unknown as Users);
+        toast.success("Referral code updated successfully!");
+        setIsEditingCode(false);
+        setNewReferralCode("");
+      } catch (error) {
+        toast.error("Failed to update referral code");
+      } finally {
+        setIsUpdatingCode(false);
+      }
+    };
 
     const profiles = profilesRaw
       .filter((profile: any) => !["custom_auth_endpoint", "siwe"].includes(profile.type))
@@ -241,6 +289,102 @@ export function ManageAccount({
           )}
         </div>
 
+        {/* Referral Section */}
+        <div className="space-y-4">
+          <h3 className="text-b3-grey font-neue-montreal-semibold text-xl">Referrals</h3>
+
+          {/* Referral Code */}
+          <div className="bg-b3-line rounded-xl p-4">
+            {isEditingCode && (
+              <div>
+                <div className="text-b3-grey font-neue-montreal-semibold">Your Referral Code</div>
+                <div className="text-b3-foreground-muted font-neue-montreal-medium text-sm">
+                  Share this code with friends to earn rewards
+                </div>
+              </div>
+            )}
+            <div className="flex items-center justify-between">
+              {!isEditingCode && (
+                <div>
+                  <div className="text-b3-grey font-neue-montreal-semibold">Your Referral Code</div>
+                  <div className="text-b3-foreground-muted font-neue-montreal-medium text-sm">
+                    Share this code with friends to earn rewards
+                  </div>
+                </div>
+              )}
+              <div className="flex items-center gap-2">
+                {isEditingCode ? (
+                  <div className="flex items-center gap-2">
+                    <input
+                      type="text"
+                      value={newReferralCode}
+                      onChange={e => setNewReferralCode(e.target.value)}
+                      className="rounded-lg border border-gray-200 bg-white px-3 py-1.5 text-sm"
+                      placeholder="Enter new code"
+                      ref={referallCodeRef}
+                    />
+                    <Button size="sm" onClick={handleUpdateReferralCode} disabled={isUpdatingCode || !newReferralCode}>
+                      {isUpdatingCode ? <Loader2 className="h-4 w-4 animate-spin" /> : "Save"}
+                    </Button>
+                    <Button
+                      size="sm"
+                      variant="ghost"
+                      onClick={() => {
+                        setIsEditingCode(false);
+                        setNewReferralCode("");
+                      }}
+                    >
+                      Cancel
+                    </Button>
+                  </div>
+                ) : (
+                  <>
+                    <div className="rounded-lg border border-gray-200 bg-white px-3 py-1.5 text-sm">
+                      {currentReferralCode}
+                    </div>
+                    <Button size="icon" variant="ghost" onClick={handleCopyCode}>
+                      <Copy className="h-4 w-4" />
+                    </Button>
+                    <Button
+                      size="icon"
+                      variant="ghost"
+                      onClick={() => {
+                        setIsEditingCode(true);
+                        setTimeout(() => {
+                          referallCodeRef.current?.focus();
+                        }, 100);
+                      }}
+                    >
+                      <Pencil className="h-4 w-4" />
+                    </Button>
+                  </>
+                )}
+              </div>
+            </div>
+          </div>
+
+          {/* Referred Users */}
+          <div className="bg-b3-line rounded-xl p-4">
+            <div className="text-b3-grey font-neue-montreal-semibold mb-4">Referred Users</div>
+            {isLoadingReferrals ? (
+              <div className="flex justify-center py-4">
+                <Loader2 className="h-6 w-6 animate-spin text-gray-400" />
+              </div>
+            ) : referrals?.data?.length ? (
+              <div className="space-y-3">
+                {referrals.data.map((referral: Referrals) => (
+                  <div key={String(referral._id)} className="flex items-center justify-between rounded-lg bg-white p-3">
+                    <div className="text-sm font-medium">{referral.referreeId}</div>
+                    <div className="text-sm text-gray-500">{new Date(referral.createdAt).toLocaleDateString()}</div>
+                  </div>
+                ))}
+              </div>
+            ) : (
+              <div className="py-4 text-center text-gray-500">No referred users yet</div>
+            )}
+          </div>
+        </div>
+
         {/* Additional Settings Sections */}
         <div className="space-y-4">
           <h3 className="text-b3-grey font-neue-montreal-semibold text-xl">Account Preferences</h3>

package/src/global-account/react/hooks/useSiwe.tsx

@@ -5,13 +5,13 @@ import { Account } from "thirdweb/wallets";
 import { useSearchParam } from "./useSearchParamsSSR";
 
 export function useSiwe() {
-  const referrerId = useSearchParam("referrerId");
+  const referralCode = useSearchParam("referralCode");
 
   const authenticate = useCallback(
     async (account: Account, partnerId: string) => {
       if (!account || !account.signMessage) throw new Error("Account not found");
 
-      console.log("@@useAuthenticate:referrerId", referrerId);
+      console.log("@@useAuthenticate:referralCode", referralCode);
       // generate challenge
       const challenge = await app.service("global-accounts-challenge").create({
         address: account.address,
@@ -32,15 +32,15 @@ export function useSiwe() {
         signature,
         serverSignature: challenge.serverSignature,
         nonce: challenge.nonce,
-        // http://localhost:5173/?referrerId=cd8fda06-3840-43d3-8f35-ae9472a13759
-        referrerId: referrerId,
+        // http://localhost:5173/?referralCode=GIO2
+        referralCode,
         partnerId: partnerId,
       });
       debug("@@useAuthenticate:response", response);
 
       return response;
     },
-    [referrerId],
+    [referralCode],
   );
 
   return {