@b3dotfun/sdk 0.0.88-alpha.4 → 0.0.88-alpha.6

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

@@ -6,6 +6,7 @@ import { shortenAddress } from "@b3dotfun/sdk/shared/utils/formatAddress";
 import { client } from "@b3dotfun/sdk/shared/utils/thirdweb";
 import { ChevronLeft, ChevronRightCircle, Wallet, X, ZapIcon } from "lucide-react";
 import { useConnectModal, useDisconnect, useWalletInfo } from "thirdweb/react";
+import { createWallet } from "thirdweb/wallets";
 import { useConnectedWalletDisplay } from "../../hooks/useConnectedWalletDisplay";
 
 export enum CryptoPaymentMethodType {
@@ -15,6 +16,13 @@ export enum CryptoPaymentMethodType {
   TRANSFER_CRYPTO = "transfer_crypto",
 }
 
+const recommendWallets = [
+  createWallet("io.metamask"),
+  createWallet("com.coinbase.wallet"),
+  createWallet("me.rainbow"),
+  createWallet("io.rabby"),
+];
+
 interface CryptoPaymentMethodProps {
   selectedPaymentMethod: CryptoPaymentMethodType;
   setSelectedPaymentMethod: (method: CryptoPaymentMethodType) => void;
@@ -47,7 +55,13 @@ export function CryptoPaymentMethod({
       if (connectedEOAWallet) {
         await disconnect(connectedEOAWallet);
       }
-      const wallet = await openConnectModal({ client, setActive: false });
+      const wallet = await openConnectModal({
+        client,
+        setActive: false,
+        size: "compact",
+        showThirdwebBranding: false,
+        wallets: recommendWallets,
+      });
       if (wallet) {
         // setActiveWallet(wallet);
         setSelectedPaymentMethod(CryptoPaymentMethodType.CONNECT_WALLET);

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

@@ -21,7 +21,7 @@ import {
   TextLoop,
   TextShimmer,
   useAccountWallet,
-  useB3,
+  useB3Config,
   useModalStore,
   useProfile,
   useUnifiedChainSwitchAndExecute,
@@ -222,7 +222,7 @@ export const OrderDetails = memo(function OrderDetails({
   const searchParams = useSearchParams();
 
   // Get theme from B3Provider context
-  const { theme } = useB3();
+  const { theme } = useB3Config();
   const colorMode = theme || "light";
 
   // Read crypto payment method from URL parameters
@@ -905,6 +905,12 @@ export const OrderDetails = memo(function OrderDetails({
         )}
 
         {/* <DelayedSupportMessage /> */}
+        <button
+          className="text-b3-primary-blue hover:text-b3-primary-blue/50 order-details-cancel-btn flex w-full items-center justify-center gap-2 underline"
+          onClick={handleBack}
+        >
+          <RefreshCcw className="ml-2 h-4 w-4" /> Cancel and start over
+        </button>
       </>
     );
   }

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

@@ -1,9 +1,8 @@
-import { getStripePromise } from "@b3dotfun/sdk/shared/utils/payment.utils";
 import { OrderDetailsCollapsible, useStripeClientSecret } from "@b3dotfun/sdk/anyspend/react";
 import { components } from "@b3dotfun/sdk/anyspend/types/api";
-import { ShinyButton, useB3, useModalStore, useProfile } from "@b3dotfun/sdk/global-account/react";
+import { ShinyButton, useB3Config, useModalStore, useProfile } from "@b3dotfun/sdk/global-account/react";
 import { formatTokenAmount } from "@b3dotfun/sdk/shared/utils/number";
-import { formatStripeAmount } from "@b3dotfun/sdk/shared/utils/payment.utils";
+import { formatStripeAmount, getStripePromise } from "@b3dotfun/sdk/shared/utils/payment.utils";
 import { AddressElement, Elements, PaymentElement, useElements, useStripe } from "@stripe/react-stripe-js";
 import { PaymentIntentResult, StripePaymentElementOptions } from "@stripe/stripe-js";
 import { X } from "lucide-react";
@@ -19,7 +18,7 @@ interface PaymentStripeWeb2Props {
 }
 
 export default function PaymentStripeWeb2({ order, stripePaymentIntentId, onPaymentSuccess }: PaymentStripeWeb2Props) {
-  const { theme, stripePublishableKey } = useB3();
+  const { theme, stripePublishableKey } = useB3Config();
   const fingerprintConfig = getFingerprintConfig();
 
   const { clientSecret, isLoadingStripeClientSecret, stripeClientSecretError } =

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

@@ -3,7 +3,7 @@ import { anyspendService } from "@b3dotfun/sdk/anyspend/services/anyspend";
 import { components } from "@b3dotfun/sdk/anyspend/types/api";
 import { VisitorData } from "@b3dotfun/sdk/anyspend/types/fingerprint";
 import { buildMetadata, buildPayload, normalizeAddress } from "@b3dotfun/sdk/anyspend/utils";
-import { useB3 } from "@b3dotfun/sdk/global-account/react";
+import { useB3Config } from "@b3dotfun/sdk/global-account/react";
 import { useVisitorData } from "@fingerprintjs/fingerprintjs-pro-react";
 import { useMutation } from "@tanstack/react-query";
 import { useMemo } from "react";
@@ -36,7 +36,7 @@ export type UseAnyspendCreateOnrampOrderProps = {
  */
 export function useAnyspendCreateOnrampOrder({ onSuccess, onError }: UseAnyspendCreateOnrampOrderProps = {}) {
   // Get B3 context values
-  const { partnerId } = useB3();
+  const { partnerId } = useB3Config();
 
   // Get validated client reference ID from B3 context
   const createValidatedClientReferenceId = useValidatedClientReferenceId();

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

@@ -2,7 +2,7 @@ import { anyspendService } from "@b3dotfun/sdk/anyspend/services/anyspend";
 import { components } from "@b3dotfun/sdk/anyspend/types/api";
 import { VisitorData } from "@b3dotfun/sdk/anyspend/types/fingerprint";
 import { buildMetadata, buildPayload, normalizeAddress } from "@b3dotfun/sdk/anyspend/utils";
-import { useB3 } from "@b3dotfun/sdk/global-account/react";
+import { useB3Config } from "@b3dotfun/sdk/global-account/react";
 import { useVisitorData } from "@fingerprintjs/fingerprintjs-pro-react";
 import { useMutation } from "@tanstack/react-query";
 import { useMemo } from "react";
@@ -36,7 +36,7 @@ export type UseAnyspendCreateOrderProps = {
  */
 export function useAnyspendCreateOrder({ onSuccess, onError }: UseAnyspendCreateOrderProps = {}) {
   // Get B3 context values
-  const { partnerId } = useB3();
+  const { partnerId } = useB3Config();
 
   // Get validated client reference ID from B3 context
   const createValidatedClientReferenceId = useValidatedClientReferenceId();

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

@@ -2,7 +2,7 @@ import { anyspendService } from "@b3dotfun/sdk/anyspend/services/anyspend";
 import { components } from "@b3dotfun/sdk/anyspend/types/api";
 import { VisitorData } from "@b3dotfun/sdk/anyspend/types/fingerprint";
 import { normalizeAddress } from "@b3dotfun/sdk/anyspend/utils";
-import { useB3 } from "@b3dotfun/sdk/global-account/react";
+import { useB3Config } from "@b3dotfun/sdk/global-account/react";
 import { useVisitorData } from "@fingerprintjs/fingerprintjs-pro-react";
 import { useMutation } from "@tanstack/react-query";
 import { useMemo } from "react";
@@ -29,7 +29,7 @@ export type UseCreateDepositFirstOrderProps = {
  * This order type doesn't require srcAmount - the user deposits tokens after the order is created.
  */
 export function useCreateDepositFirstOrder({ onSuccess, onError }: UseCreateDepositFirstOrderProps = {}) {
-  const { partnerId } = useB3();
+  const { partnerId } = useB3Config();
 
   const { data: fpData } = useVisitorData({ extendedResult: true }, { immediate: true });
   const visitorData: VisitorData | undefined = fpData && {

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

@@ -1,5 +1,5 @@
 import { Validators } from "@b3dotfun/sdk/anyspend/utils/validation";
-import { useB3 } from "@b3dotfun/sdk/global-account/react";
+import { useB3Config } from "@b3dotfun/sdk/global-account/react";
 import { useCallback } from "react";
 import { CreateOnrampOrderParams } from "./useAnyspendCreateOnrampOrder";
 import { CreateOrderParams } from "./useAnyspendCreateOrder";
@@ -9,7 +9,7 @@ import { CreateOrderParams } from "./useAnyspendCreateOrder";
  * Gets the createClientReferenceId function from B3 context and validates the result
  */
 export function useValidatedClientReferenceId() {
-  const { createClientReferenceId } = useB3();
+  const { createClientReferenceId } = useB3Config();
 
   const createValidatedClientReferenceId = useCallback(
     async (params: CreateOrderParams | CreateOnrampOrderParams) => {

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

@@ -14,14 +14,13 @@ import { AnySpendDepositHype } from "@b3dotfun/sdk/anyspend/react/components/Any
 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 { useGlobalAccount, useIsMobile, useModalStore } from "@b3dotfun/sdk/global-account/react";
+import { useB3Config, useGlobalAccount, 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 { useB3 } from "./B3Provider/useB3";
 import { Deposit } from "./Deposit/Deposit";
 import { LinkAccount } from "./LinkAccount/LinkAccount";
 import { LinkNewAccount } from "./LinkAccount/LinkNewAccount";
@@ -30,8 +29,8 @@ import NotificationsContent from "./ManageAccount/NotificationsContent";
 import { RequestPermissions } from "./RequestPermissions/RequestPermissions";
 import { Send } from "./Send/Send";
 import { SignInWithB3Flow } from "./SignInWithB3/SignInWithB3Flow";
-import { TurnkeyAuthModal } from "./TurnkeyAuthModal";
 import { ToastContainer, useToastContext } from "./Toast/index";
+import { TurnkeyAuthModal } from "./TurnkeyAuthModal";
 import { Dialog, DialogContent, DialogDescription, DialogTitle } from "./ui/dialog";
 import { Drawer, DrawerContent, DrawerDescription, DrawerTitle } from "./ui/drawer";
 
@@ -42,7 +41,7 @@ export function B3DynamicModal() {
   const setB3ModalOpen = useModalStore(state => state.setB3ModalOpen);
   const contentType = useModalStore(state => state.contentType);
   const navigateBack = useModalStore(state => state.navigateBack);
-  const { theme } = useB3();
+  const { theme } = useB3Config();
   const isMobile = useIsMobile();
   const prevIsOpenRef = useRef(isOpen);
   const { wallet } = useGlobalAccount();

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

@@ -0,0 +1,19 @@
+import { useAuthentication } from "../../hooks";
+import { useAutoSelectWallet } from "../../hooks/useAutoSelectWallet";
+
+const AuthenticationProvider = ({
+  partnerId,
+  automaticallySetFirstEoa,
+}: {
+  partnerId: string;
+  automaticallySetFirstEoa: boolean;
+}) => {
+  useAuthentication(partnerId);
+  useAutoSelectWallet({
+    enabled: automaticallySetFirstEoa,
+  });
+
+  return null;
+};
+
+export default AuthenticationProvider;

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

@@ -1,24 +1,16 @@
 import { PermissionsConfig } from "@b3dotfun/sdk/global-account/types/permissions";
 import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
-import { ThirdwebProvider, useActiveAccount } from "thirdweb/react";
+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 { LocalSDKProvider } from "./LocalSDKProvider";
-import { B3Context, B3ContextType } from "./types";
-
-/**
- * Default permissions configuration for B3 provider
- */
-const DEFAULT_PERMISSIONS = {
-  approvedTargets: ["0xa8e42121e318e3D3BeD7f5969AF6D360045317DD"], // Example contract
-  nativeTokenLimitPerTransaction: 0.1, // in ETH
-  startDate: new Date(),
-  endDate: new Date(Date.now() + 1000 * 60 * 60 * 24 * 365), // 1 year from now
-};
 
 // Create queryClient instance
 const queryClient = new QueryClient();
@@ -35,44 +27,53 @@ export function B3Provider({
   partnerId,
   rpcUrls,
   onConnect,
+  defaultPermissions,
 }: {
   theme: "light" | "dark";
   children: React.ReactNode;
   accountOverride?: Account;
-  environment: B3ContextType["environment"];
+  environment?: "development" | "production";
   clientType?: ClientType;
   partnerId: string;
   rpcUrls?: Record<number, string>;
   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}>
-        <InnerProvider
-          accountOverride={accountOverride}
-          environment={environment}
-          theme={theme}
-          clientType={clientType}
-          partnerId={partnerId}
-          rpcUrls={rpcUrls}
-        >
-          {/* <RelayKitProviderWrapper> */}
-          {children}
-          {/* </RelayKitProviderWrapper> */}
-        </InnerProvider>
+        {/* <RelayKitProviderWrapper> */}
+        {children}
+        <AuthenticationProvider partnerId={partnerId} automaticallySetFirstEoa={false} />
+        {/* </RelayKitProviderWrapper> */}
       </LocalSDKProvider>
     </ThirdwebProvider>
   );
 }
 
 /**
- * Inner provider component that provides the actual B3Context
+ * Inner provider component for native
  */
 export function InnerProvider({
   children,
   accountOverride,
   environment,
-  defaultPermissions = DEFAULT_PERMISSIONS,
+  defaultPermissions,
   theme = "light",
   clientType = "socket",
   partnerId,
@@ -80,44 +81,32 @@ export function InnerProvider({
 }: {
   children: React.ReactNode;
   accountOverride?: Account;
-  environment: B3ContextType["environment"];
+  environment?: "development" | "production";
   defaultPermissions?: PermissionsConfig;
   theme: "light" | "dark";
   clientType?: ClientType;
   partnerId: string;
   rpcUrls?: Record<number, string>;
 }) {
-  const activeAccount = useActiveAccount();
-  //const { user, setUser, refetchUser } = useAuthentication(partnerId);
+  const setConfig = useB3ConfigStore(state => state.setConfig);
   const wagmiConfig = createWagmiConfig({ partnerId, rpcUrls });
 
-  // Use given accountOverride or activeAccount from thirdweb
-  const effectiveAccount = accountOverride || activeAccount;
+  // 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}>
-        <B3Context.Provider
-          value={{
-            //account: effectiveAccount,
-            automaticallySetFirstEoa: false,
-            //setWallet: () => {},
-            wallet: undefined,
-            //user,
-            //setUser,
-            initialized: true,
-            ready: !!effectiveAccount,
-            environment,
-            defaultPermissions,
-            theme,
-            clientType,
-            partnerId,
-            //refetchUser,
-          }}
-        >
-          {children}
-        </B3Context.Provider>
-      </QueryClientProvider>
+      <QueryClientProvider client={queryClient}>{children}</QueryClientProvider>
     </WagmiProvider>
   );
 }

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

@@ -1,36 +1,21 @@
 import { CreateOnrampOrderParams } from "@b3dotfun/sdk/anyspend/react/hooks/useAnyspendCreateOnrampOrder";
 import { CreateOrderParams } from "@b3dotfun/sdk/anyspend/react/hooks/useAnyspendCreateOrder";
-import {
-  RelayKitProviderWrapper,
-  TooltipProvider,
-  useAuthentication,
-  useAuthStore,
-} from "@b3dotfun/sdk/global-account/react";
-import { useAutoSelectWallet } from "@b3dotfun/sdk/global-account/react/hooks/useAutoSelectWallet";
+import { RelayKitProviderWrapper, TooltipProvider } from "@b3dotfun/sdk/global-account/react";
 import { createWagmiConfig } from "@b3dotfun/sdk/global-account/react/utils/createWagmiConfig";
 import { PermissionsConfig } from "@b3dotfun/sdk/global-account/types/permissions";
 import { loadGA4Script } from "@b3dotfun/sdk/global-account/utils/analytics";
 import "@relayprotocol/relay-kit-ui/styles.css";
 import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
 import { useEffect, useMemo } from "react";
-import { ThirdwebProvider, useActiveAccount } from "thirdweb/react";
+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 { LocalSDKProvider } from "./LocalSDKProvider";
-import { B3Context, B3ContextType } from "./types";
-
-/**
- * Default permissions configuration for B3 provider
- */
-const DEFAULT_PERMISSIONS = {
-  approvedTargets: ["0xa8e42121e318e3D3BeD7f5969AF6D360045317DD"], // Example contract
-  nativeTokenLimitPerTransaction: 0.1, // in ETH
-  startDate: new Date(),
-  endDate: new Date(Date.now() + 1000 * 60 * 60 * 24 * 365), // 1 year from now
-};
 
 // Create queryClient instance
 const queryClient = new QueryClient();
@@ -56,11 +41,12 @@ export function B3Provider({
   overrideDefaultConnectors = false,
   createClientReferenceId,
   enableTurnkey = false,
+  defaultPermissions,
 }: {
   theme: "light" | "dark";
   children: React.ReactNode;
   accountOverride?: Account;
-  environment: B3ContextType["environment"];
+  environment?: "development" | "production";
   automaticallySetFirstEoa?: boolean;
   simDuneApiKey?: string;
   toaster?: {
@@ -77,7 +63,26 @@ export function B3Provider({
   overrideDefaultConnectors?: boolean;
   createClientReferenceId?: (params: CreateOrderParams | CreateOnrampOrderParams) => Promise<string>;
   enableTurnkey?: boolean;
+  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: !!automaticallySetFirstEoa,
+      theme,
+      clientType,
+      partnerId,
+      stripePublishableKey,
+      createClientReferenceId,
+      enableTurnkey,
+      defaultPermissions,
+    });
+  }, []); // eslint-disable-line react-hooks/exhaustive-deps
+
   // Initialize Google Analytics on mount
   useEffect(() => {
     loadGA4Script();
@@ -100,24 +105,13 @@ export function B3Provider({
           <TooltipProvider>
             <ToastProvider>
               <LocalSDKProvider onConnectCallback={onConnect}>
-                <InnerProvider
-                  accountOverride={accountOverride}
-                  environment={environment}
-                  theme={theme}
-                  automaticallySetFirstEoa={!!automaticallySetFirstEoa}
-                  clientType={clientType}
-                  partnerId={partnerId}
-                  stripePublishableKey={stripePublishableKey}
-                  createClientReferenceId={createClientReferenceId}
-                  enableTurnkey={enableTurnkey}
-                >
-                  <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>
-                </InnerProvider>
+                <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>
             </ToastProvider>
           </TooltipProvider>
@@ -127,85 +121,6 @@ export function B3Provider({
   );
 }
 
-/**
- * Inner provider component that provides the actual B3Context
- */
-export function InnerProvider({
-  children,
-  accountOverride,
-  environment,
-  defaultPermissions = DEFAULT_PERMISSIONS,
-  automaticallySetFirstEoa,
-  theme = "light",
-  clientType = "socket",
-  partnerId,
-  stripePublishableKey,
-  createClientReferenceId,
-  enableTurnkey,
-}: {
-  children: React.ReactNode;
-  accountOverride?: Account;
-  environment: B3ContextType["environment"];
-  defaultPermissions?: PermissionsConfig;
-  automaticallySetFirstEoa: boolean;
-  theme: "light" | "dark";
-  clientType?: ClientType;
-  partnerId: string;
-  stripePublishableKey?: string;
-  createClientReferenceId?: (params: CreateOrderParams | CreateOnrampOrderParams) => Promise<string>;
-  enableTurnkey?: boolean;
-}) {
-  const activeAccount = useActiveAccount();
-  const isAuthenticated = useAuthStore(state => state.isAuthenticated);
-  //const isConnected = useAuthStore(state => state.isConnected);
-  //const justCompletedLogin = useAuthStore(state => state.justCompletedLogin);
-
-  // Note: This fixes a bug where useAuthentication is no longer rendered on every page, as of this PR https://github.com/b3-fun/b3/pull/385/files#diff-3ef996931b8fc8e49021ba1b42ddaa97535214681610dc5fdacf63542e261af7
-  // The above PR removes useAuthentication from the overall B3Provider. useAuthentication should be everywhere the provider is, since it sets the overall auth state
-  // By just calling it manually, we fix that issue
-  // As a follow up, we should fix the SDK directly
-  useAuthentication(partnerId);
-
-  // Use given accountOverride or activeAccount from thirdweb
-  // WOJ: why if isAuthenticated is false, we don't use activeAccount, which should be undefined?
-  // skip isAuthenticated check ?
-  const effectiveAccount = isAuthenticated ? accountOverride || activeAccount : undefined;
-
-  // Wrapper to set active wallet via thirdweb
-  // Note: `wallet` in context is deprecated - use useActiveWallet() from thirdweb/react instead
-
-  // Auto-select first EOA wallet when enabled
-  useAutoSelectWallet({
-    enabled: automaticallySetFirstEoa,
-  });
-
-  return (
-    <B3Context.Provider
-      value={{
-        account: effectiveAccount,
-        // setWallet,
-        //wallet: undefined, // Deprecated: use useActiveWallet() from thirdweb/react instead
-        //user,
-        //setUser,
-        //refetchUser,
-        initialized: true,
-        ready: !!effectiveAccount,
-        automaticallySetFirstEoa,
-        environment,
-        defaultPermissions,
-        theme,
-        clientType,
-        partnerId: partnerId,
-        stripePublishableKey,
-        createClientReferenceId,
-        enableTurnkey,
-      }}
-    >
-      {children}
-    </B3Context.Provider>
-  );
-}
-
 /**
  * Component to connect the toast context to the global toast API
  */

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

@@ -1,18 +1,9 @@
-import { useContext, useMemo } from "react";
-import { B3Context } from "./types";
+import { useB3Config } from "./useB3Config";
 
 /**
- * Hook to access the B3 context
- * @throws Error if used outside a B3Provider
- * @deprecated Use useB3Config or useB3Account instead
+ * Hook to access the B3 configuration
+ * @deprecated This is just an alias for useB3Config. Use useB3Config directly instead.
  */
 export function useB3() {
-  const context = useContext(B3Context);
-
-  if (!context.initialized) {
-    throw new Error("useB3 must be used within a B3Provider");
-  }
-
-  // Return a stable reference
-  return useMemo(() => context, [context]);
+  return useB3Config();
 }

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

@@ -1,7 +1,11 @@
 import { useActiveAccount } from "thirdweb/react";
+import { useAuthStore } from "../../stores/useAuthStore";
 
 // Wrapper around useActiveAccount
 export const useB3Account = () => {
-  const account = useActiveAccount();
-  return account;
+  const isAuthenticated = useAuthStore(state => state.isAuthenticated);
+  const activeAccount = useActiveAccount();
+  const effectiveAccount = isAuthenticated ? activeAccount : undefined;
+
+  return effectiveAccount;
 };

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

@@ -1,34 +1,21 @@
-import { useContext, useMemo } from "react";
-import { B3Context } from "./types";
+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 = () => {
-  const context = useContext(B3Context);
-
-  if (!context) {
-    throw new Error("useB3 must be used within a B3Provider");
-  }
-
-  const {
-    automaticallySetFirstEoa,
-    environment,
-    theme,
-    clientType,
-    partnerId,
-    createClientReferenceId,
-    enableTurnkey,
-  } = context;
-
-  // Return a stable reference
-  return useMemo(
-    () => ({
-      automaticallySetFirstEoa,
-      environment,
-      theme,
-      clientType,
-      partnerId,
-      createClientReferenceId,
-      enableTurnkey,
-    }),
-    [automaticallySetFirstEoa, environment, theme, clientType, partnerId, createClientReferenceId, enableTurnkey],
-  );
+  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,
+  }));
 };