@b3dotfun/sdk 0.0.31 → 0.0.32-alpha.0

package/dist/esm/global-account/react/components/B3Provider/types.d.ts

@@ -1,17 +1,16 @@
-import { Account } from "thirdweb/wallets";
-import { User } from "../../../../global-account/types/b3-api.types";
-import { Wallet } from "thirdweb/wallets";
+import { Users } from "@b3dotfun/b3-api";
 import { PermissionsConfig } from "../../../../global-account/types/permissions";
+import { Account, Wallet } from "thirdweb/wallets";
 /**
  * Context type for B3Provider
  */
 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/dist/esm/global-account/react/components/ManageAccount/ManageAccount.js

@@ -1,10 +1,12 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Button, TabsContentPrimitive, TabsListPrimitive, TabsPrimitive, TabTriggerPrimitive, useAccountAssets, useAuthentication, useGetAllTWSigners, useModalStore, useRemoveSessionKey, } from "../../../../global-account/react/index.js";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import app from "../../../../global-account/app.js";
+import { Button, TabsContentPrimitive, TabsListPrimitive, TabsPrimitive, TabTriggerPrimitive, useAccountAssets, useAuthentication, useB3, useGetAllTWSigners, useModalStore, useQueryB3, useRemoveSessionKey, } from "../../../../global-account/react/index.js";
 import { SignOutIcon } from "../../../../global-account/react/components/icons/SignOutIcon.js";
 import { formatNumber } from "../../../../shared/utils/formatNumber.js";
 import { client } from "../../../../shared/utils/thirdweb.js";
-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 { useActiveAccount, useProfiles, useUnlinkProfile } from "thirdweb/react";
 import { formatUnits } from "viem";
 import { getProfileDisplayInfo } from "../../utils/profileDisplay.js";
@@ -52,6 +54,45 @@ export function ManageAccount({ onLogout, onSwap: _onSwap, onDeposit: _onDeposit
         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(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);
+                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) => !["custom_auth_endpoint", "siwe"].includes(profile.type))
             .map((profile) => ({
@@ -88,7 +129,15 @@ export function ManageAccount({ onLogout, onSwap: _onSwap, onDeposit: _onDeposit
                 },
             });
         };
-        return (_jsxs("div", { className: "space-y-8", children: [_jsxs("div", { className: "space-y-4", children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsx("h3", { className: "text-b3-grey font-neue-montreal-semibold text-xl", children: "Linked Accounts" }), _jsxs(Button, { className: "bg-b3-primary-wash hover:bg-b3-primary-wash/70 flex items-center gap-2 rounded-full px-4 py-2", onClick: handleOpenLinkModal, disabled: isLinking, children: [isLinking ? (_jsx(Loader2, { className: "text-b3-primary-blue animate-spin", size: 16 })) : (_jsx(LinkIcon, { size: 16, className: "text-b3-primary-blue" })), _jsx("span", { className: "text-b3-grey font-neue-montreal-semibold", children: isLinking ? "Linking..." : "Link New Account" })] })] }), isLoadingProfiles ? (_jsx("div", { className: "flex justify-center py-8", children: _jsx(Loader2, { className: "text-b3-grey animate-spin" }) })) : profiles.length > 0 ? (_jsx("div", { className: "space-y-4", children: profiles.map(profile => (_jsxs("div", { className: "bg-b3-line flex items-center justify-between rounded-xl p-4", children: [_jsxs("div", { className: "flex items-center gap-3", children: [profile.imageUrl ? (_jsx("img", { src: profile.imageUrl, alt: profile.title, className: "size-10 rounded-full" })) : (_jsx("div", { className: "bg-b3-primary-wash flex h-10 w-10 items-center justify-center rounded-full", children: _jsx("span", { className: "text-b3-grey font-neue-montreal-semibold text-sm uppercase", children: profile.initial }) })), _jsxs("div", { children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("span", { className: "text-b3-grey font-neue-montreal-semibold", children: profile.title }), _jsx("span", { className: "text-b3-foreground-muted font-neue-montreal-medium bg-b3-primary-wash rounded px-2 py-0.5 text-xs", children: profile.type.toUpperCase() })] }), _jsx("div", { className: "text-b3-foreground-muted font-neue-montreal-medium text-sm", children: profile.subtitle })] })] }), _jsx(Button, { variant: "ghost", size: "icon", className: "text-b3-grey hover:text-b3-negative", onClick: () => handleUnlink(profile), disabled: unlinkingAccountId === profile.title || isUnlinking, children: unlinkingAccountId === profile.title || isUnlinking ? (_jsx(Loader2, { className: "animate-spin" })) : (_jsx(UnlinkIcon, { size: 16 })) })] }, profile.title))) })) : (_jsx("div", { className: "text-b3-foreground-muted py-8 text-center", children: "No linked accounts found" }))] }), _jsxs("div", { className: "space-y-4", children: [_jsx("h3", { className: "text-b3-grey font-neue-montreal-semibold text-xl", children: "Account Preferences" }), _jsx("div", { className: "bg-b3-line rounded-xl p-4", children: _jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("div", { children: [_jsx("div", { className: "text-b3-grey font-neue-montreal-semibold", children: "Dark Mode" }), _jsx("div", { className: "text-b3-foreground-muted font-neue-montreal-medium text-sm", children: "Switch between light and dark theme" })] }), _jsx("div", { className: "bg-b3-primary-wash h-6 w-12 rounded-full" })] }) })] }), _jsxs("div", { className: "border-b3-line flex items-center justify-between rounded-2xl border p-4", children: [_jsxs("div", { children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("img", { src: "https://cdn.b3.fun/b3_logo.svg", alt: "B3", className: "h-4" }), _jsx("h3", { className: "font-neue-montreal-semibold text-b3-grey", children: "Global Account" })] }), _jsx("p", { className: "text-b3-foreground-muted font-neue-montreal-medium mt-2 text-sm", children: "Your universal account for all B3 apps" })] }), _jsx("button", { className: "text-b3-grey hover:text-b3-grey/80 hover:bg-b3-line border-b3-line flex size-12 items-center justify-center rounded-full border", onClick: onLogoutEnhanced, children: logoutLoading ? _jsx(Loader2, { className: "animate-spin" }) : _jsx(SignOutIcon, { size: 16, className: "text-b3-grey" }) })] })] }));
+        return (_jsxs("div", { className: "space-y-8", children: [_jsxs("div", { className: "space-y-4", children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsx("h3", { className: "text-b3-grey font-neue-montreal-semibold text-xl", children: "Linked Accounts" }), _jsxs(Button, { className: "bg-b3-primary-wash hover:bg-b3-primary-wash/70 flex items-center gap-2 rounded-full px-4 py-2", onClick: handleOpenLinkModal, disabled: isLinking, children: [isLinking ? (_jsx(Loader2, { className: "text-b3-primary-blue animate-spin", size: 16 })) : (_jsx(LinkIcon, { size: 16, className: "text-b3-primary-blue" })), _jsx("span", { className: "text-b3-grey font-neue-montreal-semibold", children: isLinking ? "Linking..." : "Link New Account" })] })] }), isLoadingProfiles ? (_jsx("div", { className: "flex justify-center py-8", children: _jsx(Loader2, { className: "text-b3-grey animate-spin" }) })) : profiles.length > 0 ? (_jsx("div", { className: "space-y-4", children: profiles.map(profile => (_jsxs("div", { className: "bg-b3-line flex items-center justify-between rounded-xl p-4", children: [_jsxs("div", { className: "flex items-center gap-3", children: [profile.imageUrl ? (_jsx("img", { src: profile.imageUrl, alt: profile.title, className: "size-10 rounded-full" })) : (_jsx("div", { className: "bg-b3-primary-wash flex h-10 w-10 items-center justify-center rounded-full", children: _jsx("span", { className: "text-b3-grey font-neue-montreal-semibold text-sm uppercase", children: profile.initial }) })), _jsxs("div", { children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("span", { className: "text-b3-grey font-neue-montreal-semibold", children: profile.title }), _jsx("span", { className: "text-b3-foreground-muted font-neue-montreal-medium bg-b3-primary-wash rounded px-2 py-0.5 text-xs", children: profile.type.toUpperCase() })] }), _jsx("div", { className: "text-b3-foreground-muted font-neue-montreal-medium text-sm", children: profile.subtitle })] })] }), _jsx(Button, { variant: "ghost", size: "icon", className: "text-b3-grey hover:text-b3-negative", onClick: () => handleUnlink(profile), disabled: unlinkingAccountId === profile.title || isUnlinking, children: unlinkingAccountId === profile.title || isUnlinking ? (_jsx(Loader2, { className: "animate-spin" })) : (_jsx(UnlinkIcon, { size: 16 })) })] }, profile.title))) })) : (_jsx("div", { className: "text-b3-foreground-muted py-8 text-center", children: "No linked accounts found" }))] }), _jsxs("div", { className: "space-y-4", children: [_jsx("h3", { className: "text-b3-grey font-neue-montreal-semibold text-xl", children: "Referrals" }), _jsxs("div", { className: "bg-b3-line rounded-xl p-4", children: [isEditingCode && (_jsxs("div", { children: [_jsx("div", { className: "text-b3-grey font-neue-montreal-semibold", children: "Your Referral Code" }), _jsx("div", { className: "text-b3-foreground-muted font-neue-montreal-medium text-sm", children: "Share this code with friends to earn rewards" })] })), _jsxs("div", { className: "flex items-center justify-between", children: [!isEditingCode && (_jsxs("div", { children: [_jsx("div", { className: "text-b3-grey font-neue-montreal-semibold", children: "Your Referral Code" }), _jsx("div", { className: "text-b3-foreground-muted font-neue-montreal-medium text-sm", children: "Share this code with friends to earn rewards" })] })), _jsx("div", { className: "flex items-center gap-2", children: isEditingCode ? (_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("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 }), _jsx(Button, { size: "sm", onClick: handleUpdateReferralCode, disabled: isUpdatingCode || !newReferralCode, children: isUpdatingCode ? _jsx(Loader2, { className: "h-4 w-4 animate-spin" }) : "Save" }), _jsx(Button, { size: "sm", variant: "ghost", onClick: () => {
+                                                            setIsEditingCode(false);
+                                                            setNewReferralCode("");
+                                                        }, children: "Cancel" })] })) : (_jsxs(_Fragment, { children: [_jsx("div", { className: "rounded-lg border border-gray-200 bg-white px-3 py-1.5 text-sm", children: currentReferralCode }), _jsx(Button, { size: "icon", variant: "ghost", onClick: handleCopyCode, children: _jsx(Copy, { className: "h-4 w-4" }) }), _jsx(Button, { size: "icon", variant: "ghost", onClick: () => {
+                                                            setIsEditingCode(true);
+                                                            setTimeout(() => {
+                                                                referallCodeRef.current?.focus();
+                                                            }, 100);
+                                                        }, children: _jsx(Pencil, { className: "h-4 w-4" }) })] })) })] })] }), _jsxs("div", { className: "bg-b3-line rounded-xl p-4", children: [_jsx("div", { className: "text-b3-grey font-neue-montreal-semibold mb-4", children: "Referred Users" }), isLoadingReferrals ? (_jsx("div", { className: "flex justify-center py-4", children: _jsx(Loader2, { className: "h-6 w-6 animate-spin text-gray-400" }) })) : referrals?.data?.length ? (_jsx("div", { className: "space-y-3", children: referrals.data.map((referral) => (_jsxs("div", { className: "flex items-center justify-between rounded-lg bg-white p-3", children: [_jsx("div", { className: "text-sm font-medium", children: referral.referreeId }), _jsx("div", { className: "text-sm text-gray-500", children: new Date(referral.createdAt).toLocaleDateString() })] }, String(referral._id)))) })) : (_jsx("div", { className: "py-4 text-center text-gray-500", children: "No referred users yet" }))] })] }), _jsxs("div", { className: "space-y-4", children: [_jsx("h3", { className: "text-b3-grey font-neue-montreal-semibold text-xl", children: "Account Preferences" }), _jsx("div", { className: "bg-b3-line rounded-xl p-4", children: _jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("div", { children: [_jsx("div", { className: "text-b3-grey font-neue-montreal-semibold", children: "Dark Mode" }), _jsx("div", { className: "text-b3-foreground-muted font-neue-montreal-medium text-sm", children: "Switch between light and dark theme" })] }), _jsx("div", { className: "bg-b3-primary-wash h-6 w-12 rounded-full" })] }) })] }), _jsxs("div", { className: "border-b3-line flex items-center justify-between rounded-2xl border p-4", children: [_jsxs("div", { children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("img", { src: "https://cdn.b3.fun/b3_logo.svg", alt: "B3", className: "h-4" }), _jsx("h3", { className: "font-neue-montreal-semibold text-b3-grey", children: "Global Account" })] }), _jsx("p", { className: "text-b3-foreground-muted font-neue-montreal-medium mt-2 text-sm", children: "Your universal account for all B3 apps" })] }), _jsx("button", { className: "text-b3-grey hover:text-b3-grey/80 hover:bg-b3-line border-b3-line flex size-12 items-center justify-center rounded-full border", onClick: onLogoutEnhanced, children: logoutLoading ? _jsx(Loader2, { className: "animate-spin" }) : _jsx(SignOutIcon, { size: 16, className: "text-b3-grey" }) })] })] }));
     };
     return (_jsx("div", { className: "b3-manage-account bg-b3-background flex flex-col rounded-xl", children: _jsx("div", { className: "flex-1", children: _jsxs(TabsPrimitive, { defaultValue: activeTab, onValueChange: value => {
                     const tab = value;

package/dist/esm/global-account/react/hooks/useSiwe.js

@@ -3,11 +3,11 @@ import debug from "../../../shared/utils/debug.js";
 import { useCallback } from "react";
 import { useSearchParam } from "./useSearchParamsSSR.js";
 export function useSiwe() {
-    const referrerId = useSearchParam("referrerId");
+    const referralCode = useSearchParam("referralCode");
     const authenticate = useCallback(async (account, partnerId) => {
         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,
@@ -25,13 +25,13 @@ 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 {
         authenticate,
     };

package/dist/types/anyspend/react/components/common/OrderDetails.d.ts

@@ -9,6 +9,7 @@ interface OrderDetailsProps {
     refundTxs: components["schemas"]["RefundTx"][] | null;
     cryptoPaymentMethod?: CryptoPaymentMethodType;
     onBack?: () => void;
+    disableUrlParamManagement?: boolean;
 }
 export declare const OrderDetails: import("react").NamedExoticComponent<OrderDetailsProps>;
 export declare const OrderDetailsLoadingView: import("react/jsx-runtime").JSX.Element;

package/dist/types/anyspend/react/hooks/useAnyspendFlow.d.ts

@@ -19,8 +19,9 @@ interface UseAnyspendFlowProps {
     sourceTokenAddress?: string;
     sourceTokenChainId?: number;
     slippage?: number;
+    disableUrlParamManagement?: boolean;
 }
-export declare function useAnyspendFlow({ paymentType, recipientAddress, loadOrder, isDepositMode, onOrderSuccess, onTransactionSuccess, sourceTokenAddress, sourceTokenChainId, slippage, }: UseAnyspendFlowProps): {
+export declare function useAnyspendFlow({ paymentType, recipientAddress, loadOrder, isDepositMode, onOrderSuccess, onTransactionSuccess, sourceTokenAddress, sourceTokenChainId, slippage, disableUrlParamManagement, }: UseAnyspendFlowProps): {
     activePanel: PanelView;
     setActivePanel: import("react").Dispatch<import("react").SetStateAction<PanelView>>;
     orderId: string | undefined;
@@ -75,6 +76,8 @@ export declare function useAnyspendFlow({ paymentType, recipientAddress, loadOrd
     setSelectedRecipientAddress: import("react").Dispatch<import("react").SetStateAction<string | undefined>>;
     recipientName: string | null | undefined;
     globalAddress: string | undefined;
+    hasEnoughBalance: boolean;
+    isBalanceLoading: boolean;
     anyspendQuote: {
         success: boolean;
         message: string;

package/dist/types/anyspend/react/hooks/useSigMint.d.ts

@@ -72,7 +72,7 @@ export declare const useSigMintCollection: ({ address, chainId }: FindByAddressP
         description?: string | undefined;
         createdAt?: string | undefined;
         updatedAt?: string | undefined;
-        status?: "DRAFT" | "ACTIVE" | "INACTIVE" | undefined;
+        status?: "ACTIVE" | "DRAFT" | "INACTIVE" | undefined;
         metadata?: {} | undefined;
         logoURI?: string | undefined;
         creator?: string | undefined;

package/dist/types/global-account/react/components/B3Provider/types.d.ts

@@ -1,17 +1,16 @@
-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 { Account, Wallet } from "thirdweb/wallets";
 /**
  * Context type for B3Provider
  */
 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/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@b3dotfun/sdk",
-  "version": "0.0.31",
+  "version": "0.0.32-alpha.0",
   "source": "src/index.ts",
   "main": "./dist/cjs/index.js",
   "react-native": "./dist/cjs/index.native.js",
@@ -237,7 +237,7 @@
     "constants"
   ],
   "dependencies": {
-    "@b3dotfun/b3-api": "0.0.43",
+    "@b3dotfun/b3-api": "0.0.45",
     "@b3dotfun/basement-api": "0.0.11",
     "@chakra-ui/react": "2.10.7",
     "@feathersjs/authentication-client": "5.0.33",

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

@@ -115,6 +115,7 @@ function AnySpendDepositHypeInner({
     sourceTokenAddress,
     sourceTokenChainId,
     slippage: SLIPPAGE_PERCENT,
+    disableUrlParamManagement: true,
   });
 
   // Button state logic
@@ -434,8 +435,8 @@ function AnySpendDepositHypeInner({
               onBack={() => {
                 setOrderId(undefined);
                 setActivePanel(PanelView.MAIN);
-                onSuccess?.();
               }}
+              disableUrlParamManagement
             />
           </>
         )}

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

@@ -63,6 +63,7 @@ interface OrderDetailsProps {
   refundTxs: components["schemas"]["RefundTx"][] | null;
   cryptoPaymentMethod?: CryptoPaymentMethodType; // Now optional since we read from URL
   onBack?: () => void;
+  disableUrlParamManagement?: boolean; // When true, will not modify URL parameters
 }
 
 // Add this helper function near the top or just above the component
@@ -202,6 +203,7 @@ export const OrderDetails = memo(function OrderDetails({
   refundTxs,
   cryptoPaymentMethod,
   onBack,
+  disableUrlParamManagement = false,
 }: OrderDetailsProps) {
   const router = useRouter();
   const searchParams = useSearchParams();
@@ -284,13 +286,15 @@ 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(() => {
+    if (disableUrlParamManagement) return;
     const params = new URLSearchParams(searchParams.toString());
     params.set("waitingForDeposit", "true");
     router.push(`?${params}`);
-  }, [router, searchParams]);
+  }, [router, searchParams, disableUrlParamManagement]);
 
   // Clean up URL parameters before closing modal or navigating back
   const cleanupUrlParams = useCallback(() => {
+    if (disableUrlParamManagement) return;
     const params = new URLSearchParams(searchParams.toString());
     params.delete("waitingForDeposit");
     params.delete("orderId");
@@ -300,7 +304,7 @@ export const OrderDetails = memo(function OrderDetails({
     if (params.toString() !== searchParams.toString()) {
       router.push(`?${params}`);
     }
-  }, [router, searchParams]);
+  }, [router, searchParams, disableUrlParamManagement]);
 
   // Helper functions that clean up URL params before executing actions
   const handleCloseModal = useCallback(() => {

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/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";