@b3dotfun/sdk 0.1.0 → 0.1.1-alpha.1

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

@@ -0,0 +1,114 @@
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { formatUnits } from "viem";
+import { useBalance } from "wagmi";
+import { isNativeToken } from "../../utils";
+
+export interface TransferResult {
+  amount: string;
+  formattedAmount: string;
+  txHash?: string;
+  timestamp: number;
+}
+
+export interface UseWatchTransferProps {
+  /** Address to watch for incoming transfers */
+  address: string;
+  /** Chain ID to watch on */
+  chainId: number;
+  /** Token address (use zero address for native token) */
+  tokenAddress: string;
+  /** Token decimals */
+  tokenDecimals: number;
+  /** Whether watching is enabled */
+  enabled?: boolean;
+  /** Callback when a transfer is detected */
+  onTransferDetected?: (result: TransferResult) => void;
+}
+
+/**
+ * Hook to watch for incoming transfers to an address by monitoring balance changes.
+ * When a transfer is detected (balance increases), it captures the amount and notifies.
+ */
+export function useWatchTransfer({
+  address,
+  chainId,
+  tokenAddress,
+  tokenDecimals,
+  enabled = true,
+  onTransferDetected,
+}: UseWatchTransferProps) {
+  const [transferResult, setTransferResult] = useState<TransferResult | null>(null);
+  const [isWatching, setIsWatching] = useState(false);
+  const initialBalanceRef = useRef<bigint | null>(null);
+  const transferDetectedRef = useRef(false);
+
+  const isNative = isNativeToken(tokenAddress);
+  // Get current balance
+  const { data: balanceData, refetch: refetchBalance } = useBalance({
+    address: address as `0x${string}`,
+    chainId,
+    token: isNative ? undefined : (tokenAddress as `0x${string}`),
+    query: {
+      enabled: enabled && !!address,
+      refetchInterval: 3000,
+    },
+  });
+
+  // Initialize or update the initial balance
+  useEffect(() => {
+    if (balanceData && initialBalanceRef.current === null && enabled) {
+      initialBalanceRef.current = balanceData.value;
+      setIsWatching(true);
+    }
+  }, [balanceData, enabled]);
+
+  // Check for balance increase (transfer detected)
+  useEffect(() => {
+    if (!enabled || transferDetectedRef.current || initialBalanceRef.current === null || !balanceData) {
+      return;
+    }
+
+    const currentBalance = balanceData.value;
+    const initialBalance = initialBalanceRef.current;
+
+    if (currentBalance > initialBalance) {
+      const transferAmount = currentBalance - initialBalance;
+      const formattedAmount = formatUnits(transferAmount, tokenDecimals);
+
+      const result: TransferResult = {
+        amount: transferAmount.toString(),
+        formattedAmount,
+        timestamp: Date.now(),
+      };
+
+      transferDetectedRef.current = true;
+      setTransferResult(result);
+      setIsWatching(false);
+      onTransferDetected?.(result);
+    }
+  }, [balanceData, enabled, tokenDecimals, onTransferDetected]);
+
+  // Reset function to start watching again
+  const reset = useCallback(() => {
+    transferDetectedRef.current = false;
+    initialBalanceRef.current = null;
+    setTransferResult(null);
+    setIsWatching(false);
+  }, []);
+
+  return useMemo(
+    () => ({
+      /** Whether currently watching for transfers */
+      isWatching,
+      /** The detected transfer result, if any */
+      transferResult,
+      /** Whether a transfer has been detected */
+      hasTransfer: transferResult !== null,
+      /** Reset and start watching again */
+      reset,
+      /** Manually refetch balance */
+      refetchBalance,
+    }),
+    [isWatching, transferResult, reset, refetchBalance],
+  );
+}

package/src/anyspend/react/providers/AnyspendProvider.tsx

@@ -1,6 +1,5 @@
 "use client";
 
-import { TooltipProvider } from "@b3dotfun/sdk/global-account/react";
 import { ReactNode } from "react";
 import { FeatureFlags, FeatureFlagsProvider } from "../contexts/FeatureFlagsContext";
 import { StripeRedirectHandler } from "./StripeRedirectHandler";
@@ -36,10 +35,8 @@ interface AnyspendProviderProps {
 export const AnyspendProvider = function AnyspendProvider({ children, featureFlags }: AnyspendProviderProps) {
   return (
     <FeatureFlagsProvider featureFlags={featureFlags}>
-      <TooltipProvider>
-        <StripeRedirectHandler />
-        {children}
-      </TooltipProvider>
+      <StripeRedirectHandler />
+      {children}
     </FeatureFlagsProvider>
   );
 };

package/src/anyspend/utils/address.ts

@@ -38,3 +38,16 @@ export function eqci(a: string | null | undefined, b: string | null | undefined)
   if (!a || !b) return false;
   return a.toLowerCase() === b.toLowerCase();
 }
+
+/**
+ * Check if source and destination represent the same token on the same chain.
+ * When true, this is a pure transfer (no swap/bridge needed).
+ */
+export function isSameChainAndToken(
+  sourceChainId: number,
+  sourceTokenAddress: string,
+  destinationChainId: number,
+  destinationTokenAddress: string,
+): boolean {
+  return sourceChainId === destinationChainId && eqci(sourceTokenAddress, destinationTokenAddress);
+}

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

@@ -38,6 +38,11 @@ export function AccountAssets({ nfts, isLoading }: AccountAssetsProps) {
   const [expandedCollections, setExpandedCollections] = useState<Set<string>>(
     () => new Set(collections.map(c => c.collection_id)),
   );
+  const [failedImages, setFailedImages] = useState<Set<string>>(() => new Set());
+
+  const handleImageError = (imageId: string) => {
+    setFailedImages(prev => new Set(prev).add(imageId));
+  };
 
   if (isLoading) {
     return (
@@ -72,7 +77,7 @@ export function AccountAssets({ nfts, isLoading }: AccountAssetsProps) {
   };
 
   return (
-    <div className="flex flex-col gap-3 px-4">
+    <div className="flex flex-col gap-3">
       {collections.map(collection => {
         const isExpanded = expandedCollections.has(collection.collection_id);
 
@@ -84,11 +89,12 @@ export function AccountAssets({ nfts, isLoading }: AccountAssetsProps) {
               className="flex w-full items-center justify-between"
             >
               <div className="flex items-center gap-1">
-                {collection.collection_image && (
+                {collection.collection_image && !failedImages.has(`collection-${collection.collection_id}`) && (
                   <img
                     src={collection.collection_image}
                     alt={collection.collection_name}
                     className="h-5 w-5 shrink-0 rounded object-cover"
+                    onError={() => handleImageError(`collection-${collection.collection_id}`)}
                   />
                 )}
                 <p className="font-neue-montreal-medium text-[14px] text-[#3f3f46]">
@@ -115,17 +121,23 @@ export function AccountAssets({ nfts, isLoading }: AccountAssetsProps) {
             {isExpanded && (
               <div className="flex gap-3 overflow-x-auto">
                 {collection.nfts.map(nft => (
-                  <div key={nft.nft_id} className="relative h-[98px] w-[98px] shrink-0 overflow-hidden rounded-lg">
-                    <img
-                      src={
-                        nft.previews?.image_medium_url ||
-                        nft.extra_metadata?.image_original_url ||
-                        nft.collection?.image_url ||
-                        ""
-                      }
-                      alt={nft.name || "NFT"}
-                      className="h-full w-full object-cover"
-                    />
+                  <div
+                    key={nft.nft_id}
+                    className="bg-b3-react-muted relative h-[98px] w-[98px] shrink-0 overflow-hidden rounded-lg"
+                  >
+                    {!failedImages.has(nft.nft_id) && (
+                      <img
+                        src={
+                          nft.previews?.image_medium_url ||
+                          nft.extra_metadata?.image_original_url ||
+                          nft.collection?.image_url ||
+                          ""
+                        }
+                        alt={nft.name || "NFT"}
+                        className="h-full w-full object-cover"
+                        onError={() => handleImageError(nft.nft_id)}
+                      />
+                    )}
                   </div>
                 ))}
               </div>

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

@@ -10,16 +10,15 @@ import {
   AnySpendTournament,
   OrderHistory,
 } from "@b3dotfun/sdk/anyspend/react";
+import { AnySpendDeposit } from "@b3dotfun/sdk/anyspend/react/components/AnySpendDeposit";
 import { AnySpendDepositHype } from "@b3dotfun/sdk/anyspend/react/components/AnyspendDepositHype";
 import { AnySpendDepositUpside } from "@b3dotfun/sdk/anyspend/react/components/AnySpendDepositUpside";
 import { AnySpendStakeUpside } from "@b3dotfun/sdk/anyspend/react/components/AnySpendStakeUpside";
 import { AnySpendStakeUpsideExactIn } from "@b3dotfun/sdk/anyspend/react/components/AnySpendStakeUpsideExactIn";
-import { useB3Config, useGlobalAccount, useIsMobile, useModalStore } from "@b3dotfun/sdk/global-account/react";
+import { useB3Config, useIsMobile, useModalStore } from "@b3dotfun/sdk/global-account/react";
 import { cn } from "@b3dotfun/sdk/shared/utils/cn";
 import { debugB3React } from "@b3dotfun/sdk/shared/utils/debug";
 import { AnimatePresence, motion } from "framer-motion";
-import { useEffect, useRef } from "react";
-import { useSetActiveWallet } from "thirdweb/react";
 import { AvatarEditor } from "./AvatarEditor/AvatarEditor";
 import { Deposit } from "./Deposit/Deposit";
 import { LinkAccount } from "./LinkAccount/LinkAccount";
@@ -43,22 +42,8 @@ export function B3DynamicModal() {
   const navigateBack = useModalStore(state => state.navigateBack);
   const { theme } = useB3Config();
   const isMobile = useIsMobile();
-  const prevIsOpenRef = useRef(isOpen);
-  const { wallet } = useGlobalAccount();
-  const setActiveWallet = useSetActiveWallet();
   const { toasts, removeToast } = useToastContext();
 
-  // anyspend cleanup global account chnages by setting account back
-  useEffect(() => {
-    if (prevIsOpenRef.current && !isOpen) {
-      if (wallet) {
-        setActiveWallet(wallet);
-      }
-    }
-
-    prevIsOpenRef.current = isOpen;
-  }, [isOpen, wallet, setActiveWallet]);
-
   // Define arrays for different modal type groups
   const fullWidthTypes = [
     "anySpend",
@@ -81,6 +66,7 @@ export function B3DynamicModal() {
     "deposit",
     "send",
     "notifications",
+    "anySpendDeposit",
   ];
 
   const freestyleTypes = [
@@ -169,6 +155,8 @@ export function B3DynamicModal() {
         return <AnySpendDepositHype {...contentType} mode="modal" />;
       case "anySpendCollectorClubPurchase":
         return <AnySpendCollectorClubPurchase {...contentType} mode="modal" />;
+      case "anySpendDeposit":
+        return <AnySpendDeposit {...contentType} mode="modal" />;
       case "avatarEditor":
         return <AvatarEditor onSetAvatar={contentType.onSuccess} />;
       case "deposit":

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

@@ -0,0 +1,84 @@
+import { CreateOnrampOrderParams } from "@b3dotfun/sdk/anyspend/react/hooks/useAnyspendCreateOnrampOrder";
+import { CreateOrderParams } from "@b3dotfun/sdk/anyspend/react/hooks/useAnyspendCreateOrder";
+import { PermissionsConfig } from "@b3dotfun/sdk/global-account/types/permissions";
+import { createContext, useContext } from "react";
+import { Account } from "thirdweb/wallets";
+import { ClientType } from "../../../client-manager";
+
+/**
+ * Default permissions configuration for B3 provider
+ */
+const DEFAULT_PERMISSIONS: PermissionsConfig = {
+  approvedTargets: ["0xa8e42121e318e3D3BeD7f5969AF6D360045317DD"],
+  nativeTokenLimitPerTransaction: 0.1,
+  startDate: new Date(),
+  endDate: new Date(Date.now() + 1000 * 60 * 60 * 24 * 365), // 1 year from now
+};
+
+export interface B3ConfigContextType {
+  accountOverride?: Account;
+  automaticallySetFirstEoa: boolean;
+  environment: "development" | "production";
+  defaultPermissions: PermissionsConfig;
+  theme: "light" | "dark";
+  clientType: ClientType;
+  partnerId: string;
+  stripePublishableKey?: string;
+  createClientReferenceId?: (params: CreateOrderParams | CreateOnrampOrderParams) => Promise<string>;
+  enableTurnkey: boolean;
+}
+
+const B3ConfigContext = createContext<B3ConfigContextType | null>(null);
+
+export function B3ConfigProvider({
+  children,
+  accountOverride,
+  environment = "development",
+  defaultPermissions = DEFAULT_PERMISSIONS,
+  automaticallySetFirstEoa = false,
+  theme = "light",
+  clientType = "rest",
+  partnerId,
+  stripePublishableKey,
+  createClientReferenceId,
+  enableTurnkey = false,
+}: {
+  children: React.ReactNode;
+  accountOverride?: Account;
+  environment?: "development" | "production";
+  defaultPermissions?: PermissionsConfig;
+  automaticallySetFirstEoa?: boolean;
+  theme?: "light" | "dark";
+  clientType?: ClientType;
+  partnerId: string;
+  stripePublishableKey?: string;
+  createClientReferenceId?: (params: CreateOrderParams | CreateOnrampOrderParams) => Promise<string>;
+  enableTurnkey?: boolean;
+}) {
+  return (
+    <B3ConfigContext.Provider
+      value={{
+        accountOverride,
+        environment,
+        defaultPermissions,
+        automaticallySetFirstEoa,
+        theme,
+        clientType,
+        partnerId,
+        stripePublishableKey,
+        createClientReferenceId,
+        enableTurnkey,
+      }}
+    >
+      {children}
+    </B3ConfigContext.Provider>
+  );
+}
+
+export function useB3Config(): B3ConfigContextType {
+  const context = useContext(B3ConfigContext);
+  if (!context) {
+    throw new Error("useB3Config must be used within a B3ConfigProvider");
+  }
+  return context;
+}

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

@@ -1,15 +1,14 @@
 import { PermissionsConfig } from "@b3dotfun/sdk/global-account/types/permissions";
 import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
-import { useEffect } from "react";
 import { ThirdwebProvider } from "thirdweb/react";
 import { Account, Wallet } from "thirdweb/wallets";
 
 import { ClientType } from "../../../client-manager";
 
 import { WagmiProvider } from "wagmi";
-import { useB3ConfigStore } from "../../stores/configStore";
 import { createWagmiConfig } from "../../utils/createWagmiConfig";
 import AuthenticationProvider from "./AuthenticationProvider";
+import { B3ConfigProvider } from "./B3ConfigProvider";
 import { LocalSDKProvider } from "./LocalSDKProvider";
 
 // Create queryClient instance
@@ -39,28 +38,23 @@ export function B3Provider({
   onConnect?: (wallet: Wallet, b3Jwt: string) => void | Promise<void>;
   defaultPermissions?: PermissionsConfig;
 }) {
-  const setConfig = useB3ConfigStore(state => state.setConfig);
-
-  // Initialize config store on mount - props are static and never change
-  useEffect(() => {
-    setConfig({
-      accountOverride,
-      environment: environment ?? "development",
-      automaticallySetFirstEoa: false,
-      theme,
-      clientType,
-      partnerId,
-      defaultPermissions,
-    });
-  }, []); // eslint-disable-line react-hooks/exhaustive-deps
-
   return (
     <ThirdwebProvider>
       <LocalSDKProvider onConnectCallback={onConnect}>
-        {/* <RelayKitProviderWrapper> */}
-        {children}
-        <AuthenticationProvider partnerId={partnerId} automaticallySetFirstEoa={false} />
-        {/* </RelayKitProviderWrapper> */}
+        <B3ConfigProvider
+          accountOverride={accountOverride}
+          environment={environment}
+          automaticallySetFirstEoa={false}
+          theme={theme}
+          clientType={clientType}
+          partnerId={partnerId}
+          defaultPermissions={defaultPermissions}
+        >
+          {/* <RelayKitProviderWrapper> */}
+          {children}
+          <AuthenticationProvider partnerId={partnerId} automaticallySetFirstEoa={false} />
+          {/* </RelayKitProviderWrapper> */}
+        </B3ConfigProvider>
       </LocalSDKProvider>
     </ThirdwebProvider>
   );
@@ -88,25 +82,23 @@ export function InnerProvider({
   partnerId: string;
   rpcUrls?: Record<number, string>;
 }) {
-  const setConfig = useB3ConfigStore(state => state.setConfig);
   const wagmiConfig = createWagmiConfig({ partnerId, rpcUrls });
 
-  // Initialize config store on mount - props are static and never change
-  useEffect(() => {
-    setConfig({
-      accountOverride,
-      environment: environment ?? "development",
-      automaticallySetFirstEoa: false,
-      theme,
-      clientType,
-      partnerId,
-      defaultPermissions,
-    });
-  }, []); // eslint-disable-line react-hooks/exhaustive-deps
-
   return (
     <WagmiProvider config={wagmiConfig}>
-      <QueryClientProvider client={queryClient}>{children}</QueryClientProvider>
+      <QueryClientProvider client={queryClient}>
+        <B3ConfigProvider
+          accountOverride={accountOverride}
+          environment={environment}
+          automaticallySetFirstEoa={false}
+          theme={theme}
+          clientType={clientType}
+          partnerId={partnerId}
+          defaultPermissions={defaultPermissions}
+        >
+          {children}
+        </B3ConfigProvider>
+      </QueryClientProvider>
     </WagmiProvider>
   );
 }

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

@@ -1,3 +1,4 @@
+import { Users } from "@b3dotfun/b3-api";
 import { CreateOnrampOrderParams } from "@b3dotfun/sdk/anyspend/react/hooks/useAnyspendCreateOnrampOrder";
 import { CreateOrderParams } from "@b3dotfun/sdk/anyspend/react/hooks/useAnyspendCreateOrder";
 import { RelayKitProviderWrapper, TooltipProvider } from "@b3dotfun/sdk/global-account/react";
@@ -11,10 +12,10 @@ import { ThirdwebProvider } from "thirdweb/react";
 import { Account, Wallet } from "thirdweb/wallets";
 import { CreateConnectorFn, WagmiProvider } from "wagmi";
 import { ClientType, setClientType } from "../../../client-manager";
-import { useB3ConfigStore } from "../../stores/configStore";
 import { StyleRoot } from "../StyleRoot";
 import { setToastContext, ToastProvider, useToastContext } from "../Toast/index";
 import AuthenticationProvider from "./AuthenticationProvider";
+import { B3ConfigProvider } from "./B3ConfigProvider";
 import { LocalSDKProvider } from "./LocalSDKProvider";
 
 // Create queryClient instance
@@ -37,11 +38,13 @@ export function B3Provider({
   partnerId,
   stripePublishableKey,
   onConnect,
+  onLogout,
   connectors,
   overrideDefaultConnectors = false,
   createClientReferenceId,
   enableTurnkey = false,
   defaultPermissions,
+  onTurnkeyConnect,
 }: {
   theme: "light" | "dark";
   children: React.ReactNode;
@@ -59,42 +62,14 @@ export function B3Provider({
   /** Partner-specific Stripe publishable key. If not provided, uses default B3 Stripe account. */
   stripePublishableKey?: string;
   onConnect?: (wallet: Wallet, b3Jwt: string) => void | Promise<void>;
+  onLogout?: () => void | Promise<void>;
   connectors?: CreateConnectorFn[];
   overrideDefaultConnectors?: boolean;
   createClientReferenceId?: (params: CreateOrderParams | CreateOnrampOrderParams) => Promise<string>;
   enableTurnkey?: boolean;
   defaultPermissions?: PermissionsConfig;
+  onTurnkeyConnect?: (user: Users) => void | Promise<void>;
 }) {
-  const setConfig = useB3ConfigStore(state => state.setConfig);
-
-  // Initialize config store on mount
-  useEffect(() => {
-    setConfig({
-      accountOverride,
-      environment: environment ?? "development",
-      automaticallySetFirstEoa: !!automaticallySetFirstEoa,
-      theme,
-      clientType,
-      partnerId,
-      stripePublishableKey,
-      createClientReferenceId,
-      enableTurnkey,
-      defaultPermissions,
-    });
-  }, [
-    accountOverride,
-    environment,
-    automaticallySetFirstEoa,
-    theme,
-    clientType,
-    partnerId,
-    stripePublishableKey,
-    createClientReferenceId,
-    enableTurnkey,
-    defaultPermissions,
-    setConfig,
-  ]); // eslint-disable-line react-hooks/exhaustive-deps
-
   // Initialize Google Analytics on mount
   useEffect(() => {
     loadGA4Script();
@@ -116,14 +91,31 @@ export function B3Provider({
         <QueryClientProvider client={queryClient}>
           <TooltipProvider>
             <ToastProvider>
-              <LocalSDKProvider onConnectCallback={onConnect}>
-                <ToastContextConnector />
-                <RelayKitProviderWrapper simDuneApiKey={simDuneApiKey}>
-                  {children}
-                  {/* For the modal https://github.com/b3-fun/b3/blob/main/packages/sdk/src/global-account/react/components/ui/dialog.tsx#L46 */}
-                  <StyleRoot id="b3-root" />
-                </RelayKitProviderWrapper>
-                <AuthenticationProvider partnerId={partnerId} automaticallySetFirstEoa={!!automaticallySetFirstEoa} />
+              <LocalSDKProvider
+                onConnectCallback={onConnect}
+                onLogoutCallback={onLogout}
+                onTurnkeyConnect={onTurnkeyConnect}
+              >
+                <B3ConfigProvider
+                  accountOverride={accountOverride}
+                  environment={environment}
+                  automaticallySetFirstEoa={!!automaticallySetFirstEoa}
+                  theme={theme}
+                  clientType={clientType}
+                  partnerId={partnerId}
+                  stripePublishableKey={stripePublishableKey}
+                  createClientReferenceId={createClientReferenceId}
+                  enableTurnkey={enableTurnkey}
+                  defaultPermissions={defaultPermissions}
+                >
+                  <ToastContextConnector />
+                  <RelayKitProviderWrapper simDuneApiKey={simDuneApiKey}>
+                    {children}
+                    {/* For the modal https://github.com/b3-fun/b3/blob/main/packages/sdk/src/global-account/react/components/ui/dialog.tsx#L46 */}
+                    <StyleRoot id="b3-root" />
+                  </RelayKitProviderWrapper>
+                  <AuthenticationProvider partnerId={partnerId} automaticallySetFirstEoa={!!automaticallySetFirstEoa} />
+                </B3ConfigProvider>
               </LocalSDKProvider>
             </ToastProvider>
           </TooltipProvider>

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

@@ -1,3 +1,4 @@
+import { Users } from "@b3dotfun/b3-api";
 import { createContext } from "react";
 import { Wallet } from "thirdweb/wallets";
 
@@ -7,10 +8,14 @@ import { Wallet } from "thirdweb/wallets";
  */
 export interface LocalSDKContextType {
   onConnectCallback?: (wallet: Wallet, b3Jwt: string) => void | Promise<void>;
+  onLogoutCallback?: () => void | Promise<void>;
+  onTurnkeyConnect?: (user: Users) => void | Promise<void>;
 }
 
 export const LocalSDKContext = createContext<LocalSDKContextType>({
   onConnectCallback: undefined,
+  onLogoutCallback: undefined,
+  onTurnkeyConnect: undefined,
 });
 
 /**
@@ -19,14 +24,20 @@ export const LocalSDKContext = createContext<LocalSDKContextType>({
 export function LocalSDKProvider({
   children,
   onConnectCallback,
+  onLogoutCallback,
+  onTurnkeyConnect,
 }: {
   children: React.ReactNode;
   onConnectCallback?: (wallet: Wallet, b3Jwt: string) => void | Promise<void>;
+  onLogoutCallback?: () => void | Promise<void>;
+  onTurnkeyConnect?: (user: Users) => void | Promise<void>;
 }) {
   return (
     <LocalSDKContext.Provider
       value={{
         onConnectCallback,
+        onLogoutCallback,
+        onTurnkeyConnect,
       }}
     >
       {children}

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

@@ -1,21 +1 @@
-import { useB3ConfigStore } from "../../stores/configStore";
-
-/**
- * Hook to access B3 configuration
- * Returns all config values from the Zustand store
- * Since config is static (set once at initialization), destructuring is fine here
- */
-export const useB3Config = () => {
-  return useB3ConfigStore(state => ({
-    automaticallySetFirstEoa: state.automaticallySetFirstEoa,
-    environment: state.environment,
-    theme: state.theme,
-    clientType: state.clientType,
-    partnerId: state.partnerId,
-    createClientReferenceId: state.createClientReferenceId,
-    enableTurnkey: state.enableTurnkey,
-    stripePublishableKey: state.stripePublishableKey,
-    defaultPermissions: state.defaultPermissions,
-    accountOverride: state.accountOverride,
-  }));
-};
+export { useB3Config } from "./B3ConfigProvider";

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

@@ -1,6 +1,6 @@
 import { useActiveWallet } from "thirdweb/react";
 import { AccountAssets } from "..";
-import { useAccountAssets } from "../../hooks";
+import { useSimCollectibles } from "../../hooks";
 
 const NFTContent = () => {
   // Get active wallet state
@@ -8,12 +8,12 @@ const NFTContent = () => {
   const activeAccount = activeWallet?.getAccount();
   const activeAddress = activeAccount?.address;
 
-  const { data: nfts, isLoading } = useAccountAssets(activeAddress);
+  const { data: nfts, isLoading } = useSimCollectibles(activeAddress, [1, 8453], { filterSpam: true });
 
   return (
     <div style={{ minHeight: "100px" }}>
-      {nfts?.nftResponse ? (
-        <AccountAssets nfts={nfts.nftResponse} isLoading={isLoading} />
+      {nfts ? (
+        <AccountAssets nfts={nfts} isLoading={isLoading} />
       ) : (
         <div className="py-12 text-center text-gray-500">No NFTs found</div>
       )}