@b3dotfun/sdk 0.0.83-test.0 → 0.0.83

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

@@ -33,7 +33,7 @@ import { encodeFunctionData } from "viem";
 import { AnySpendCustom } from "./AnySpendCustom";
 
 // Collector Club Shop contract on Base
-const CC_SHOP_ADDRESS = "0x23887D10c81118A9a2E3Af59C423e2f4ee4Cc7Cf";
+const CC_SHOP_ADDRESS = "0x47366E64E4917dd4DdC04Fb9DC507c1dD2b87294";
 const BASE_CHAIN_ID = 8453;
 
 // ABI for buyPacksFor function only

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

@@ -44,7 +44,6 @@ import { motion } from "motion/react";
 import React, { useCallback, useEffect, useMemo, useState } from "react";
 
 import { base } from "viem/chains";
-import { useAutoSetActiveWalletFromWagmi } from "../hooks/useAutoSetActiveWalletFromWagmi";
 import { useCryptoPaymentMethodState } from "../hooks/useCryptoPaymentMethodState";
 import { useRecipientAddressState } from "../hooks/useRecipientAddressState";
 import { AnySpendFingerprintWrapper, getFingerprintConfig } from "./AnySpendFingerprintWrapper";
@@ -247,9 +246,6 @@ function AnySpendCustomInner({
   const searchParams = useSearchParamsSSR();
   const router = useRouter();
 
-  // Auto-set active wallet from wagmi
-  useAutoSetActiveWalletFromWagmi();
-
   const [activePanel, setActivePanel] = useState<PanelView>(
     loadOrder ? PanelView.ORDER_DETAILS : PanelView.CONFIRM_ORDER,
   );

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

@@ -4,13 +4,8 @@ import { toast, useAccountWallet, WalletImage } from "@b3dotfun/sdk/global-accou
 import { cn } from "@b3dotfun/sdk/shared/utils/cn";
 import { shortenAddress } from "@b3dotfun/sdk/shared/utils/formatAddress";
 import { client } from "@b3dotfun/sdk/shared/utils/thirdweb";
-import { WalletCoinbase, WalletMetamask, WalletRainbow, WalletWalletConnect } from "@web3icons/react";
 import { ChevronLeft, ChevronRightCircle, Wallet, X, ZapIcon } from "lucide-react";
-import { useState } from "react";
-import { createPortal } from "react-dom";
-import { useSetActiveWallet, useWalletInfo } from "thirdweb/react";
-import { createWallet, WalletId } from "thirdweb/wallets";
-import { useAccount, useConnect, useDisconnect, useWalletClient } from "wagmi";
+import { useConnectModal, useDisconnect, useWalletInfo } from "thirdweb/react";
 import { useConnectedWalletDisplay } from "../../hooks/useConnectedWalletDisplay";
 
 export enum CryptoPaymentMethodType {
@@ -35,128 +30,32 @@ export function CryptoPaymentMethod({
   onBack,
   onSelectPaymentMethod,
 }: CryptoPaymentMethodProps) {
-  const { connectedEOAWallet: connectedEOAWallet, connectedSmartWallet: connectedSmartWallet } = useAccountWallet();
-  const { connector, address } = useAccount();
-  const { connect, connectors, isPending } = useConnect();
+  const { connectedEOAWallet, connectedSmartWallet } = useAccountWallet();
   const { disconnect } = useDisconnect();
-  const { data: walletClient } = useWalletClient();
-  const [showWalletModal, setShowWalletModal] = useState(false);
-  const setActiveWallet = useSetActiveWallet();
+  const { connect: openConnectModal } = useConnectModal();
   const { data: eoaWalletInfo } = useWalletInfo(connectedEOAWallet?.id);
 
-  const isConnected = !!connectedEOAWallet;
   const globalAddress = connectedSmartWallet?.getAccount()?.address;
 
   // Use custom hook to determine wallet display logic
-  const { shouldShowConnectedEOA, shouldShowWagmiWallet } = useConnectedWalletDisplay(selectedPaymentMethod);
-  console.log("shouldShowWagmiWallet :", shouldShowWagmiWallet);
+  const { shouldShowConnectedEOA } = useConnectedWalletDisplay(selectedPaymentMethod);
 
-  // Map wagmi connector names to thirdweb wallet IDs
-  const getThirdwebWalletId = (connectorName: string): WalletId | null => {
-    const walletMap: Record<string, WalletId> = {
-      MetaMask: "io.metamask",
-      "Coinbase Wallet": "com.coinbase.wallet",
-      Rainbow: "me.rainbow",
-      WalletConnect: "walletConnect",
-      Phantom: "app.phantom",
-    };
-    return walletMap[connectorName] || null;
-  };
-
-  // Create thirdweb wallet from wagmi connector
-  const createThirdwebWalletFromConnector = async (connectorName: string) => {
-    const walletId = getThirdwebWalletId(connectorName);
-    if (!walletId) {
-      console.warn(`No thirdweb wallet ID found for connector: ${connectorName}`);
-      return null;
-    }
-
-    try {
-      const thirdwebWallet = createWallet(walletId);
-      // Connect the wallet to sync with the existing wagmi connection
-      await thirdwebWallet.connect({ client });
-      return thirdwebWallet;
-    } catch (error) {
-      console.error(`Failed to create thirdweb wallet for ${connectorName}:`, error);
-      return null;
-    }
-  };
-
-  // Define available wallet connectors
-  const availableConnectors = connectors.filter(connector =>
-    ["MetaMask", "WalletConnect", "Coinbase Wallet", "Rainbow", "Phantom"].includes(connector.name),
-  );
-
-  // Define wallet options with icons and info
-  const walletOptions = [
-    {
-      id: "metamask",
-      name: "MetaMask",
-      icon: <WalletMetamask size={48} />,
-      description: "Connect using MetaMask browser extension",
-      connector: availableConnectors.find(c => c.name === "MetaMask"),
-    },
-    {
-      id: "coinbase",
-      name: "Coinbase Wallet",
-      icon: <WalletCoinbase size={48} />,
-      description: "Connect using Coinbase Wallet",
-      connector: availableConnectors.find(c => c.name === "Coinbase Wallet"),
-    },
-    {
-      id: "rainbow",
-      name: "Rainbow",
-      icon: <WalletRainbow size={48} />,
-      description: "Connect using Rainbow wallet",
-      connector: availableConnectors.find(c => c.name === "Rainbow"),
-    },
-    {
-      id: "walletconnect",
-      name: "WalletConnect",
-      icon: <WalletWalletConnect size={48} />,
-      description: "Connect using WalletConnect protocol",
-      connector: availableConnectors.find(c => c.name === "WalletConnect"),
-    },
-  ].filter(wallet => wallet.connector); // Only show wallets that have available connectors
-
-  // Reset modal state when closing
-  const handleCloseModal = () => {
-    setShowWalletModal(false);
-  };
-
-  // Function to request wallet permissions for specific wallet
-  const requestWalletPermissions = async (walletConnector?: any) => {
+  // Handle wallet connection using thirdweb modal
+  const handleConnectWallet = async () => {
     try {
-      // If a specific wallet connector is provided and it's different from current
-      if (walletConnector && connector?.name !== walletConnector.name) {
-        // Disconnect current and connect to the selected wallet
-        // if (isConnected) {
-        //   disconnect();
-        //   // Small delay to ensure disconnection
-        //   await new Promise(resolve => setTimeout(resolve, 100));
-        // }
-        await connect({ connector: walletConnector });
-        setSelectedPaymentMethod(CryptoPaymentMethodType.CONNECT_WALLET);
-        onSelectPaymentMethod(CryptoPaymentMethodType.CONNECT_WALLET);
-        toast.success(`Connected to ${walletConnector.name}`);
-        return;
+      // Disconnect current wallet before connecting a new one
+      if (connectedEOAWallet) {
+        await disconnect(connectedEOAWallet);
       }
-
-      // If same wallet or no specific wallet, request permissions for account switching
-      if (walletClient && "request" in walletClient) {
-        await walletClient.request({
-          method: "wallet_requestPermissions",
-          params: [{ eth_accounts: {} }],
-        });
-        toast.success("Account selection completed");
+      const wallet = await openConnectModal({ client, setActive: false });
+      if (wallet) {
+        // setActiveWallet(wallet);
         setSelectedPaymentMethod(CryptoPaymentMethodType.CONNECT_WALLET);
         onSelectPaymentMethod(CryptoPaymentMethodType.CONNECT_WALLET);
-      } else {
-        // Fallback: show modal for manual wallet selection
-        setShowWalletModal(true);
+        toast.success("Wallet connected");
       }
     } catch (error) {
-      console.error("Failed to request wallet permissions:", error);
+      console.error("Failed to connect wallet:", error);
       if (error && typeof error === "object" && "message" in error) {
         const errorMessage = (error as any).message.toLowerCase();
         if (
@@ -164,12 +63,10 @@ export function CryptoPaymentMethod({
           errorMessage.includes("denied") ||
           errorMessage.includes("cancelled")
         ) {
-          toast.error("Account selection cancelled");
+          // User cancelled - no toast needed
         } else {
-          toast.error("Failed to open account selection");
+          toast.error("Failed to connect wallet");
         }
-      } else {
-        toast.error("Failed to open account selection");
       }
     }
   };
@@ -236,7 +133,7 @@ export function CryptoPaymentMethod({
         {/* Payment Methods */}
         <div className="crypto-payment-methods flex flex-col gap-4">
           {/* Installed Wallets Section */}
-          {(shouldShowConnectedEOA || shouldShowWagmiWallet || globalAddress) && (
+          {(shouldShowConnectedEOA || globalAddress) && (
             <div className="installed-wallets">
               <h3 className="text-as-primary/80 mb-3 text-sm font-medium">Connected wallets</h3>
               <div className="space-y-2">
@@ -247,10 +144,7 @@ export function CryptoPaymentMethod({
                     onClick={() => {
                       setSelectedPaymentMethod(CryptoPaymentMethodType.CONNECT_WALLET);
                       onSelectPaymentMethod(CryptoPaymentMethodType.CONNECT_WALLET);
-                      if (connectedEOAWallet) {
-                        setActiveWallet(connectedEOAWallet);
-                      }
-                      toast.success(`Selected ${eoaWalletInfo?.name || connector?.name || "wallet"}`);
+                      toast.success(`Selected ${eoaWalletInfo?.name || "wallet"}`);
                     }}
                     className={cn(
                       "crypto-payment-method-connect-wallet eoa-wallet w-full rounded-xl border p-4 text-left transition-all hover:shadow-md",
@@ -266,7 +160,7 @@ export function CryptoPaymentMethod({
                         </div>
                         <div className="flex flex-col">
                           <span className="text-as-primary font-semibold">
-                            {eoaWalletInfo?.name || connector?.name || "Connected Wallet"}
+                            {eoaWalletInfo?.name || "Connected Wallet"}
                           </span>
                           <span className="text-as-primary/60 text-sm">
                             {shortenAddress(connectedEOAWallet?.getAccount()?.address || "")}
@@ -280,62 +174,9 @@ export function CryptoPaymentMethod({
                         <button
                           onClick={e => {
                             e.stopPropagation();
-                            disconnect();
-                            toast.success("Wallet disconnected");
-                            if (selectedPaymentMethod === CryptoPaymentMethodType.CONNECT_WALLET) {
-                              setSelectedPaymentMethod(CryptoPaymentMethodType.NONE);
+                            if (connectedEOAWallet) {
+                              disconnect(connectedEOAWallet);
                             }
-                          }}
-                          className="text-as-primary/60 hover:text-as-primary/80 rounded-lg p-1.5 transition-colors"
-                        >
-                          <X className="h-4 w-4" />
-                        </button>
-                      </div>
-                    </div>
-                  </button>
-                )}
-
-                {shouldShowWagmiWallet && (
-                  <button
-                    onClick={async () => {
-                      setSelectedPaymentMethod(CryptoPaymentMethodType.CONNECT_WALLET);
-                      onSelectPaymentMethod(CryptoPaymentMethodType.CONNECT_WALLET);
-
-                      // Create thirdweb wallet from wagmi connector
-                      if (connector?.name) {
-                        const thirdwebWallet = await createThirdwebWalletFromConnector(connector.name);
-                        if (thirdwebWallet) {
-                          setActiveWallet(thirdwebWallet);
-                        }
-                      }
-
-                      toast.success(`Selected ${connector?.name || "wallet"}`);
-                    }}
-                    className={cn(
-                      "crypto-payment-method-connect-wallet wagmi-wallet w-full rounded-xl border p-4 text-left transition-all hover:shadow-md",
-                      selectedPaymentMethod === CryptoPaymentMethodType.CONNECT_WALLET
-                        ? "connected-wallet border-as-brand bg-as-brand/5"
-                        : "border-as-border-secondary bg-as-surface-primary hover:border-as-secondary/80",
-                    )}
-                  >
-                    <div className="flex items-center justify-between">
-                      <div className="flex items-center gap-3">
-                        <div className="wallet-icon flex h-10 w-10 items-center justify-center rounded-full bg-blue-100">
-                          <Wallet className="h-5 w-5 text-blue-600" />
-                        </div>
-                        <div className="flex flex-col">
-                          <span className="text-as-primary font-semibold">{connector?.name || "Connected Wallet"}</span>
-                          <span className="text-as-primary/60 text-sm">{shortenAddress(address || "")}</span>
-                        </div>
-                      </div>
-                      <div className="flex items-center gap-2">
-                        {selectedPaymentMethod === CryptoPaymentMethodType.CONNECT_WALLET && (
-                          <div className="h-2 w-2 rounded-full bg-green-500"></div>
-                        )}
-                        <button
-                          onClick={e => {
-                            e.stopPropagation();
-                            disconnect();
                             toast.success("Wallet disconnected");
                             if (selectedPaymentMethod === CryptoPaymentMethodType.CONNECT_WALLET) {
                               setSelectedPaymentMethod(CryptoPaymentMethodType.NONE);
@@ -398,10 +239,7 @@ export function CryptoPaymentMethod({
             <div className="space-y-3">
               {/* Connect Wallet Section */}
               <button
-                onClick={() => {
-                  // Always show wallet selection modal first
-                  setShowWalletModal(true);
-                }}
+                onClick={handleConnectWallet}
                 className="crypto-payment-method-connect-wallet bg-as-surface-primary border-as-border-secondary hover:border-as-secondary/80 group flex w-full items-center justify-between gap-4 rounded-xl border px-4 py-3.5 transition-all duration-200 hover:shadow-md"
               >
                 <div className="flex items-center gap-3">
@@ -438,75 +276,6 @@ export function CryptoPaymentMethod({
           </div>
         </div>
       </div>
-
-      {/* Wallet Connection Modal */}
-      {showWalletModal &&
-        createPortal(
-          <div className="wallet-connection-modal pointer-events-auto fixed inset-0 z-[9999] flex items-center justify-center bg-black/50">
-            <div className="max-h-[80vh] w-[400px] max-w-[90vw] overflow-auto rounded-xl bg-white p-6 dark:bg-gray-900">
-              <div className="mb-4 flex items-center justify-between">
-                <h3 className="text-lg font-semibold text-gray-900 dark:text-white">
-                  {isConnected ? "Switch wallet or account" : "Choose wallet to connect"}
-                </h3>
-                <button
-                  onClick={handleCloseModal}
-                  className="text-gray-500 hover:text-gray-700 dark:text-gray-400 dark:hover:text-gray-200"
-                >
-                  <X className="h-5 w-5" />
-                </button>
-              </div>
-
-              <div className="space-y-4">
-                {/* Custom wallet options */}
-                <div className="space-y-3">
-                  {walletOptions.map(walletOption => {
-                    const isCurrentWallet = isConnected && connector?.name === walletOption.connector?.name;
-
-                    return (
-                      <button
-                        key={walletOption.id}
-                        onClick={async () => {
-                          handleCloseModal();
-                          await requestWalletPermissions(walletOption.connector);
-                        }}
-                        disabled={isPending}
-                        className={`wallet-option w-full rounded-xl border p-4 text-left transition-all hover:shadow-md disabled:opacity-50 ${
-                          isCurrentWallet
-                            ? "wallet-option--active border-blue-500 bg-blue-50 dark:bg-blue-900/20"
-                            : "border-gray-200 bg-white hover:border-gray-300 dark:border-gray-600 dark:bg-gray-800 dark:hover:border-gray-500"
-                        }`}
-                      >
-                        <div className="flex items-center justify-between">
-                          <div className="flex items-center gap-3">
-                            {walletOption.icon}
-
-                            <div>
-                              <div className="wallet-option-name flex items-center gap-2">
-                                <div className="text-sm font-semibold text-gray-900 dark:text-white">
-                                  {walletOption.name}
-                                </div>
-                                {isCurrentWallet && (
-                                  <span className="rounded-full bg-blue-100 px-2 py-0.5 text-xs font-medium text-blue-700 dark:bg-blue-800 dark:text-blue-200">
-                                    Connected
-                                  </span>
-                                )}
-                              </div>
-                              <div className="text-xs text-gray-500 dark:text-gray-400">
-                                {isCurrentWallet ? "Switch account or reconnect" : walletOption.description}
-                              </div>
-                            </div>
-                          </div>
-                          <ChevronRightCircle className="h-5 w-5 text-gray-400" />
-                        </div>
-                      </button>
-                    );
-                  })}
-                </div>
-              </div>
-            </div>
-          </div>,
-          typeof window !== "undefined" ? document.getElementById("b3-root") || document.body : document.body,
-        )}
     </div>
   );
 }

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

@@ -24,7 +24,6 @@ import { components } from "../../types/api";
 import { CryptoPaymentMethodType } from "../components/common/CryptoPaymentMethod";
 import { FiatPaymentMethod } from "../components/common/FiatPaymentMethod";
 import { useAutoSelectCryptoPaymentMethod } from "./useAutoSelectCryptoPaymentMethod";
-import { useAutoSetActiveWalletFromWagmi } from "./useAutoSetActiveWalletFromWagmi";
 import { useConnectedWalletDisplay } from "./useConnectedWalletDisplay";
 import { useCryptoPaymentMethodState } from "./useCryptoPaymentMethodState";
 import { useRecipientAddressState } from "./useRecipientAddressState";
@@ -111,9 +110,6 @@ export function useAnyspendFlow({
   const { address: globalAddress } = useAccountWallet();
   const { walletAddress } = useConnectedWalletDisplay(effectiveCryptoPaymentMethod);
 
-  // Auto-set active wallet from wagmi
-  useAutoSetActiveWalletFromWagmi();
-
   // Recipient address state - hook automatically manages priority: props > user selection > wallet/global
   const { setSelectedRecipientAddress, effectiveRecipientAddress } = useRecipientAddressState({
     recipientAddressFromProps: recipientAddress,

package/src/anyspend/utils/chain.ts

@@ -15,12 +15,28 @@ import {
 } from "viem";
 import { abstract, arbitrum, avalanche, b3, base, bsc, mainnet, optimism, polygon } from "viem/chains";
 import { ChainType, IBaseChain, IEVMChain, ISolanaChain } from "../types/chain";
-import { getAvaxToken, getBnbToken, getEthToken, getPolToken, getSolanaToken } from "./token";
+import {
+  getAvaxToken,
+  getBnbToken,
+  getEthToken,
+  getHyperEVMNativeToken,
+  getPolToken,
+  getSolanaToken,
+  HYPEREVM_CHAIN_ID,
+} from "./token";
 
 function getCustomEvmChain(chain: Chain, rpcUrl: string): Chain {
   return defineChain({ ...chain, rpcUrls: { default: { http: [rpcUrl] } } });
 }
 
+export const hyperEVM = defineChain({
+  id: HYPEREVM_CHAIN_ID,
+  name: "HyperEVM",
+  nativeCurrency: { name: "HyperEVM", symbol: "HYPE", decimals: 18 },
+  rpcUrls: { default: { http: ["https://rpc.hyperliquid.xyz/evm"] } },
+  blockExplorers: { default: { name: "HyperEVM Explorer", url: "https://hyperevmscan.io/" } },
+});
+
 // export const b4testnet = defineChain({
 //   id: 19934,
 //   name: "B4 Testnet",
@@ -189,6 +205,20 @@ export const EVM_MAINNET: Record<number, IEVMChain> = {
     coingeckoName: "abstract",
     wethAddress: "0x3439153eb7af838ad19d56e1571fbd09333c2809",
   },
+  [hyperEVM.id]: {
+    id: hyperEVM.id,
+    name: hyperEVM.name,
+    logoUrl: "https://s2.coinmarketcap.com/static/img/coins/64x64/32196.png",
+    type: ChainType.EVM,
+    nativeRequired: parseEther("0.01"),
+    canDepositNative: true,
+    defaultToken: getHyperEVMNativeToken(),
+    nativeToken: getHyperEVMNativeToken(),
+    viem: hyperEVM,
+    pollingInterval: 1000, // 1 second for Hyperliquid
+    coingeckoName: "hyperevm",
+    wethAddress: "0x5555555555555555555555555555555555555555",
+  },
 };
 
 export const EVM_TESTNET: Record<number, IEVMChain> = {

package/src/anyspend/utils/token.ts

@@ -1,6 +1,9 @@
-import { avalanche, bsc, polygon } from "viem/chains";
 import { RELAY_ETH_ADDRESS, RELAY_SOL_ADDRESS, RELAY_SOLANA_MAINNET_CHAIN_ID } from "@b3dotfun/sdk/anyspend/constants";
 import { components } from "@b3dotfun/sdk/anyspend/types/api";
+import { avalanche, bsc, polygon } from "viem/chains";
+
+export const HYPERLIQUID_CHAIN_ID = 1337;
+export const HYPEREVM_CHAIN_ID = 999;
 
 export function isNativeToken(address: string): boolean {
   return address.toLowerCase() === RELAY_ETH_ADDRESS || address.toLowerCase() === RELAY_SOL_ADDRESS;
@@ -70,3 +73,16 @@ export function getAvaxToken(): components["schemas"]["Token"] {
     },
   };
 }
+
+export function getHyperEVMNativeToken(): components["schemas"]["Token"] {
+  return {
+    chainId: HYPEREVM_CHAIN_ID,
+    address: RELAY_ETH_ADDRESS,
+    symbol: "HYPE",
+    name: "HYPE",
+    decimals: 18,
+    metadata: {
+      logoURI: "https://s2.coinmarketcap.com/static/img/coins/64x64/32196.png",
+    },
+  };
+}

package/src/global-account/react/components/SignInWithB3/SignInWithB3Flow.tsx

@@ -10,7 +10,6 @@ import { debugB3React } from "@b3dotfun/sdk/shared/utils/debug";
 import { useCallback, useEffect, useState } from "react";
 import { useActiveAccount } from "thirdweb/react";
 import { Account } from "thirdweb/wallets";
-import { TurnkeyAuthModal } from "../TurnkeyAuthModal";
 import { SignInWithB3Privy } from "./SignInWithB3Privy";
 import { LoginStep, LoginStepContainer } from "./steps/LoginStep";
 import { LoginStepCustom } from "./steps/LoginStepCustom";
@@ -41,9 +40,7 @@ export function SignInWithB3Flow({
   const account = useActiveAccount();
   const isAuthenticating = useAuthStore(state => state.isAuthenticating);
   const isAuthenticated = useAuthStore(state => state.isAuthenticated);
-  const setIsAuthenticated = useAuthStore(state => state.setIsAuthenticated);
   const isConnected = useAuthStore(state => state.isConnected);
-  const setIsConnected = useAuthStore(state => state.setIsConnected);
   const setJustCompletedLogin = useAuthStore(state => state.setJustCompletedLogin);
   const [refetchCount, setRefetchCount] = useState(0);
   const [refetchError, setRefetchError] = useState<string | null>(null);
@@ -157,11 +154,6 @@ export function SignInWithB3Flow({
       await refetchUser();
       debug("User refetched successfully");
 
-      // Set authentication and connection state so UI updates properly
-      setIsAuthenticated(true);
-      setIsConnected(true);
-      setJustCompletedLogin(true);
-
       // After user data is refreshed, close Turnkey modal and go back to sign-in flow
       debug("Switching back to signInWithB3 modal");
       setB3ModalContentType({
@@ -192,9 +184,6 @@ export function SignInWithB3Flow({
       closeAfterLogin,
       source,
       signersEnabled,
-      setIsAuthenticated,
-      setIsConnected,
-      setJustCompletedLogin,
     ],
   );
 
@@ -351,76 +340,32 @@ export function SignInWithB3Flow({
         <div className="p-4 text-center text-red-500">{refetchError}</div>
       </LoginStepContainer>
     );
+  } else if (isAuthenticating || (isFetchingSigners && step === "login") || source === "requestPermissions") {
+    content = (
+      <LoginStepContainer partnerId={partnerId}>
+        <div className="my-8 flex min-h-[350px] items-center justify-center">
+          <Loading variant="white" size="lg" />
+        </div>
+      </LoginStepContainer>
+    );
   } else if (step === "login") {
-    // PRIORITY: If Turnkey is enabled, show Turnkey modal FIRST as the primary authentication option
-    // Show Turnkey when enabled and not already completed in this session
-    const shouldShowTurnkeyFirst = enableTurnkey && !turnkeyAuthCompleted;
-
-    if (shouldShowTurnkeyFirst) {
-      // Don't show loading spinner for Turnkey - let the modal handle its own loading state
-      // This prevents the infinite loop where isAuthenticating causes the modal to be replaced
-      debug("Showing Turnkey as primary authentication option", {
-        enableTurnkey,
-        turnkeyAuthCompleted,
-        isAuthenticated,
-      });
-      // Show Turnkey authentication as primary option
+    // Custom strategy
+    if (strategies?.[0] === "privy") {
+      content = <SignInWithB3Privy onSuccess={handleLoginSuccess} chain={chain} />;
+    } else if (strategies) {
+      // Strategies are explicitly provided
       content = (
-        <LoginStepContainer partnerId={partnerId}>
-          <TurnkeyAuthModal
-            onSuccess={async (authenticatedUser: any) => {
-              debug("Turnkey authentication successful in primary flow", { authenticatedUser });
-              setTurnkeyAuthCompleted(true);
-              // After Turnkey auth, refetch user to get the full user object
-              await refetchUser();
-              // User is now authenticated via Turnkey
-              // Set both isAuthenticated and isConnected to true so UI updates properly
-              // Wallet connection is optional and can happen later for signing transactions
-              setIsAuthenticated(true);
-              setIsConnected(true);
-              setJustCompletedLogin(true);
-              // Call the login success callback
-              onLoginSuccess?.({} as Account);
-            }}
-            onClose={() => {
-              // If user closes Turnkey modal, they can still use wallet connection as fallback
-              setTurnkeyAuthCompleted(true);
-            }}
-            initialEmail=""
-            skipToOtp={false}
-          />
-        </LoginStepContainer>
+        <LoginStepCustom
+          strategies={strategies}
+          chain={chain}
+          onSuccess={handleLoginSuccess}
+          onError={onError}
+          automaticallySetFirstEoa={!!automaticallySetFirstEoa}
+        />
       );
     } else {
-      // Show loading spinner only if not in Turnkey flow
-      if (isAuthenticating || (isFetchingSigners && step === "login") || source === "requestPermissions") {
-        content = (
-          <LoginStepContainer partnerId={partnerId}>
-            <div className="my-8 flex min-h-[350px] items-center justify-center">
-              <Loading variant="white" size="lg" />
-            </div>
-          </LoginStepContainer>
-        );
-      } else {
-        // Custom strategy
-        if (strategies?.[0] === "privy") {
-          content = <SignInWithB3Privy onSuccess={handleLoginSuccess} chain={chain} />;
-        } else if (strategies) {
-          // Strategies are explicitly provided
-          content = (
-            <LoginStepCustom
-              strategies={strategies}
-              chain={chain}
-              onSuccess={handleLoginSuccess}
-              onError={onError}
-              automaticallySetFirstEoa={!!automaticallySetFirstEoa}
-            />
-          );
-        } else {
-          // Default to handle all strategies we support
-          content = <LoginStep chain={chain} onSuccess={handleLoginSuccess} onError={onError} />;
-        }
-      }
+      // Default to handle all strategies we support
+      content = <LoginStep chain={chain} onSuccess={handleLoginSuccess} onError={onError} />;
     }
   }
 

package/src/global-account/react/hooks/index.ts

@@ -3,7 +3,6 @@ export { useAccountAssets } from "./useAccountAssets";
 export { useAccountWallet } from "./useAccountWallet";
 export { useAddTWSessionKey } from "./useAddTWSessionKey";
 export { useAnalytics } from "./useAnalytics";
-export { useAuth } from "./useAuth";
 export { useAuthentication } from "./useAuthentication";
 export { useB3BalanceFromAddresses } from "./useB3BalanceFromAddresses";
 export { useB3EnsName } from "./useB3EnsName";