@b3dotfun/sdk 0.0.58-alpha.3 → 0.0.58-test.1

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

@@ -1,6 +1,5 @@
 "use client";
 
-import { useGlobalWalletState } from "@b3dotfun/sdk/anyspend/utils";
 import { useAccountWallet } from "@b3dotfun/sdk/global-account/react";
 import { cn } from "@b3dotfun/sdk/shared/utils/cn";
 import { shortenAddress } from "@b3dotfun/sdk/shared/utils/formatAddress";
@@ -10,7 +9,7 @@ import { ChevronLeft, ChevronRightCircle, Wallet, X, ZapIcon } from "lucide-reac
 import { useState } from "react";
 import { createPortal } from "react-dom";
 import { toast } from "sonner";
-import { useActiveWallet, useSetActiveWallet, useWalletInfo } from "thirdweb/react";
+import { useSetActiveWallet, useWalletInfo } from "thirdweb/react";
 import { WalletId, createWallet } from "thirdweb/wallets";
 import { useAccount, useConnect, useDisconnect, useWalletClient } from "wagmi";
 
@@ -52,12 +51,10 @@ export function CryptoPaymentMethod({
   const { disconnect } = useDisconnect();
   const { data: walletClient } = useWalletClient();
   const [showWalletModal, setShowWalletModal] = useState(false);
+
   const setActiveWallet = useSetActiveWallet();
   const { data: eoaWalletInfo } = useWalletInfo(connectedEOAWallet?.id);
 
-  const activeWallet = useActiveWallet();
-  const setGlobalAccountWallet = useGlobalWalletState(state => state.setGlobalAccountWallet);
-
   const isConnected = !!connectedEOAWallet;
   const globalAddress = connectedSmartWallet?.getAccount()?.address;
 
@@ -236,7 +233,6 @@ export function CryptoPaymentMethod({
                     onClick={() => {
                       setSelectedPaymentMethod(CryptoPaymentMethodType.CONNECT_WALLET);
                       onSelectPaymentMethod(CryptoPaymentMethodType.CONNECT_WALLET);
-                      setGlobalAccountWallet(activeWallet);
                       setActiveWallet(connectedEOAWallet);
                       toast.success(`Selected ${eoaWalletInfo?.name || connector?.name || "wallet"}`);
                     }}

package/src/anyspend/utils/index.ts

@@ -1,4 +1,3 @@
-export * from "./accountStore";
 export * from "./address";
 export * from "./chain";
 export * from "./format";

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

@@ -10,11 +10,9 @@ import {
 } from "@b3dotfun/sdk/anyspend/react";
 import { AnySpendDepositHype } from "@b3dotfun/sdk/anyspend/react/components/AnyspendDepositHype";
 import { AnySpendStakeUpside } from "@b3dotfun/sdk/anyspend/react/components/AnySpendStakeUpside";
-import { useGlobalWalletState } from "@b3dotfun/sdk/anyspend/utils";
 import { 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 { useEffect, useRef } from "react";
 import { AvatarEditor } from "./AvatarEditor/AvatarEditor";
 import { useB3 } from "./B3Provider/useB3";
 import { LinkAccount } from "./LinkAccount/LinkAccount";
@@ -23,7 +21,6 @@ import { RequestPermissions } from "./RequestPermissions/RequestPermissions";
 import { SignInWithB3Flow } from "./SignInWithB3/SignInWithB3Flow";
 import { Dialog, DialogContent, DialogDescription, DialogTitle } from "./ui/dialog";
 import { Drawer, DrawerContent, DrawerDescription, DrawerTitle } from "./ui/drawer";
-import { useSetActiveWallet } from "thirdweb/react";
 
 const debug = debugB3React("B3DynamicModal");
 
@@ -31,23 +28,6 @@ export function B3DynamicModal() {
   const { isOpen, setB3ModalOpen, contentType, history, navigateBack } = useModalStore();
   const { theme } = useB3();
   const isMobile = useIsMobile();
-  const prevIsOpenRef = useRef(isOpen);
-
-  const globalAccountWallet = useGlobalWalletState(state => state.globalAccountWallet);
-  const setGlobalAccountWallet = useGlobalWalletState(state => state.setGlobalAccountWallet);
-  const setActiveWallet = useSetActiveWallet();
-
-  // anyspend cleanup global account chnages by setting account back
-  useEffect(() => {
-    if (prevIsOpenRef.current && !isOpen) {
-      if (globalAccountWallet) {
-        setActiveWallet(globalAccountWallet);
-        setGlobalAccountWallet(undefined);
-      }
-    }
-
-    prevIsOpenRef.current = isOpen;
-  }, [isOpen, globalAccountWallet, setActiveWallet, setGlobalAccountWallet]);
 
   // Define arrays for different modal type groups
   const fullWidthTypes = [

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

@@ -1,7 +1,6 @@
 import { ecosystemWalletId } from "@b3dotfun/sdk/shared/constants";
 import { supportedChains } from "@b3dotfun/sdk/shared/constants/chains/supported";
 import { client } from "@b3dotfun/sdk/shared/utils/thirdweb";
-import { farcasterMiniApp as miniAppConnector } from "@farcaster/miniapp-wagmi-connector";
 import { inAppWalletConnector } from "@thirdweb-dev/wagmi-adapter";
 import { useMemo } from "react";
 import { http } from "viem";
@@ -35,7 +34,6 @@ export function useWagmiConfig(partnerId: string, rpcUrls?: Record<number, strin
           ...ecocystemConfig,
           client,
         }),
-        miniAppConnector(),
         // injected(),
         // coinbaseWallet({ appName: "HypeDuel" }),
       ],

package/src/shared/react/components/CurrencySelector.tsx

@@ -9,16 +9,9 @@ import {
   DropdownMenuSeparator,
   DropdownMenuTrigger,
 } from "../../../global-account/react/components/ui/dropdown-menu";
-import {
-  CURRENCY_NAMES,
-  CURRENCY_SYMBOLS,
-  SupportedCurrency,
-  useCurrencyStore,
-  getCurrencyName,
-  getCurrencySymbol,
-} from "../stores/currencyStore";
+import { CURRENCY_NAMES, CURRENCY_SYMBOLS, SupportedCurrency, useCurrencyStore } from "../stores/currencyStore";
 
-const builtInCurrencies: SupportedCurrency[] = ["B3", "ETH", "SOL", "USD", "EUR", "GBP", "KRW", "JPY", "CAD", "AUD"];
+const currencies: SupportedCurrency[] = ["B3", "ETH", "SOL", "USD", "EUR", "GBP", "KRW", "JPY", "CAD", "AUD"];
 
 interface CurrencySelectorProps {
   labelClassName?: string;
@@ -27,13 +20,7 @@ interface CurrencySelectorProps {
 }
 
 export function CurrencySelector({ labelClassName, buttonVariant = "dark", label }: CurrencySelectorProps) {
-  const selectedCurrency = useCurrencyStore(state => state.selectedCurrency);
-  const setSelectedCurrency = useCurrencyStore(state => state.setSelectedCurrency);
-  const customCurrencies = useCurrencyStore(state => state.customCurrencies);
-
-  // Separate built-in and custom for better organization
-  const customCurrencyCodes = Object.keys(customCurrencies);
-  const hasCustomCurrencies = customCurrencyCodes.length > 0;
+  const { selectedCurrency, setSelectedCurrency } = useCurrencyStore();
 
   return (
     <div className="flex items-center gap-2">
@@ -51,7 +38,7 @@ export function CurrencySelector({ labelClassName, buttonVariant = "dark", label
               </span>
             )}
             <Button variant={buttonVariant as any} className="flex items-center gap-2">
-              <span className="text-sm font-medium">{getCurrencyName(selectedCurrency)}</span>
+              <span className="text-sm font-medium">{CURRENCY_NAMES[selectedCurrency]}</span>
               <svg className="h-4 w-4" fill="currentColor" viewBox="0 0 20 20">
                 <path
                   fillRule="evenodd"
@@ -63,7 +50,7 @@ export function CurrencySelector({ labelClassName, buttonVariant = "dark", label
           </div>
         </DropdownMenuTrigger>
         <DropdownMenuContent align="end" className="z-[100] min-w-[200px]">
-          {builtInCurrencies.map(currency => (
+          {currencies.map(currency => (
             <div key={currency}>
               <DropdownMenuItem
                 onClick={() => setSelectedCurrency(currency)}
@@ -77,24 +64,6 @@ export function CurrencySelector({ labelClassName, buttonVariant = "dark", label
               {currency === "SOL" && <DropdownMenuSeparator key="separator" className="bg-border my-1" />}
             </div>
           ))}
-
-          {hasCustomCurrencies && (
-            <>
-              <DropdownMenuSeparator className="bg-border my-1" />
-              {customCurrencyCodes.map(currency => (
-                <DropdownMenuItem
-                  key={currency}
-                  onClick={() => setSelectedCurrency(currency)}
-                  className={`flex cursor-pointer items-center justify-between gap-3 px-3 py-2.5 transition-colors ${
-                    selectedCurrency === currency ? "bg-accent" : "hover:bg-accent/50"
-                  }`}
-                >
-                  <span className="text-foreground text-sm font-medium">{getCurrencyName(currency)}</span>
-                  <span className="text-muted-foreground text-xs font-medium">{getCurrencySymbol(currency)}</span>
-                </DropdownMenuItem>
-              ))}
-            </>
-          )}
         </DropdownMenuContent>
       </DropdownMenu>
     </div>

package/src/shared/react/components/FormattedCurrency.tsx

@@ -5,56 +5,47 @@ import { cn } from "@b3dotfun/sdk/shared/utils";
 import { Tooltip, TooltipContent, TooltipTrigger } from "../../../global-account/react/components/ui/tooltip";
 import { useCurrencyConversion } from "../hooks/useCurrencyConversion";
 import { useCurrencyModalStore } from "../stores/currencyModalStore";
-import { getCurrencyDecimalPlaces } from "../stores/currencyStore";
 
 interface FormattedCurrencyProps {
-  amount: string; // Wei amount as string (will be divided by 1e18)
-  sourceCurrency: string; // The currency the amount is in (e.g., "WIN", "B3", "USD")
+  amount: number;
   showChange?: boolean;
   showColor?: boolean;
   className?: string;
   subB3Icon?: boolean;
   clickable?: boolean;
   decimals?: number;
+  currency?: string; // Override currency (e.g., "ETH", "USDC", "B3")
 }
 
 export function FormattedCurrency({
   amount,
-  sourceCurrency,
   showChange = false,
   showColor = false,
   className,
   subB3Icon = true,
   clickable = true,
   decimals,
+  currency,
 }: FormattedCurrencyProps) {
   const { formatCurrencyValue, formatTooltipValue, selectedCurrency, baseCurrency } = useCurrencyConversion();
   const { openModal } = useCurrencyModalStore();
 
-  // Convert from smallest unit to human-readable using currency's decimal places
-  const decimalPlaces = getCurrencyDecimalPlaces(sourceCurrency);
-  const divisor = Math.pow(10, decimalPlaces);
+  // Use passed currency or fall back to selected currency
+  const activeCurrency = currency || selectedCurrency;
 
-  // Parse amount - handle both string and numeric inputs, including negatives
-  let parsedAmount: number;
-  if (typeof amount === "string") {
-    // Handle BigInt strings and negative values
-    const numericAmount = amount.startsWith("-") ? -Math.abs(parseFloat(amount.replace("-", ""))) : parseFloat(amount);
-    parsedAmount = numericAmount / divisor;
-  } else {
-    parsedAmount = amount / divisor;
-  }
-
-  const isPositive = parsedAmount >= 0;
+  const isPositive = amount >= 0;
 
-  // Always format with absolute value, we'll add the sign separately
-  const absoluteAmount = Math.abs(parsedAmount);
+  // Get the formatted value (using absolute value for negative numbers when showing change)
+  const baseAmount = showChange ? Math.abs(amount) : amount;
 
-  // Format value with automatic conversion from source to display currency
-  const formattedValue = formatCurrencyValue(absoluteAmount, sourceCurrency, { decimals });
+  // Use centralized formatting from hook with optional overrides
+  const formattedValue = formatCurrencyValue(baseAmount, {
+    decimals,
+    currency,
+  });
 
   // Generate tooltip using the centralized hook function
-  const baseTooltipValue = formatTooltipValue(parsedAmount, sourceCurrency);
+  const baseTooltipValue = formatTooltipValue(amount, currency);
 
   // Add change indicator if needed
   const tooltipValue = showChange ? `${isPositive ? "+" : "-"}${baseTooltipValue}` : baseTooltipValue;
@@ -69,14 +60,14 @@ export function FormattedCurrency({
     }
   }
 
-  // Build display value with appropriate sign
+  // Add change indicator
   let displayValue = formattedValue;
   if (showChange) {
-    // Add +/- prefix for change indicators
-    displayValue = `${isPositive ? "+" : "-"}${formattedValue}`;
-  } else if (!isPositive) {
-    // Add minus sign for negative values
-    displayValue = `-${formattedValue}`;
+    if (isPositive) {
+      displayValue = `+${formattedValue}`;
+    } else {
+      displayValue = `-${formattedValue}`;
+    }
   }
 
   const handleClick = () => {
@@ -85,9 +76,6 @@ export function FormattedCurrency({
     }
   };
 
-  // Check if we should show B3 icon (when displaying in B3 and baseCurrency is B3)
-  const shouldShowB3Icon = subB3Icon && selectedCurrency === "B3" && baseCurrency === "B3";
-
   return (
     <Tooltip>
       <TooltipTrigger asChild>
@@ -100,10 +88,16 @@ export function FormattedCurrency({
             clickable && "cursor-pointer transition-opacity hover:opacity-80",
           )}
         >
-          {shouldShowB3Icon ? displayValue.split(" ")[0] : displayValue}
-          {shouldShowB3Icon && (
-            <img src={B3_COIN_IMAGE_URL} className="inline-block h-4 w-4 align-middle" alt="B3 coin" />
-          )}
+          {subB3Icon &&
+          (currency === baseCurrency || (!currency && activeCurrency === baseCurrency)) &&
+          baseCurrency === "B3"
+            ? displayValue.split(" ")[0]
+            : displayValue}
+          {subB3Icon &&
+            (currency === baseCurrency || (!currency && activeCurrency === baseCurrency)) &&
+            baseCurrency === "B3" && (
+              <img src={B3_COIN_IMAGE_URL} className="inline-block h-4 w-4 align-middle" alt="B3 coin" />
+            )}
         </span>
       </TooltipTrigger>
       <TooltipContent>{tooltipValue}</TooltipContent>

package/src/shared/react/hooks/__tests__/useCurrencyConversion.test.ts

@@ -67,7 +67,7 @@ describe("useCurrencyConversion", () => {
       mockStoreState.baseCurrency = "B3";
 
       const { result } = renderHook(() => useCurrencyConversion());
-      const formatted = result.current.formatCurrencyValue(100, "B3");
+      const formatted = result.current.formatCurrencyValue(100);
 
       expect(formatted).toContain("B3");
       expect(formatted).toContain("100");
@@ -79,7 +79,7 @@ describe("useCurrencyConversion", () => {
       mockStoreState.baseCurrency = "B3";
 
       const { result } = renderHook(() => useCurrencyConversion());
-      const formatted = result.current.formatCurrencyValue(100, "B3");
+      const formatted = result.current.formatCurrencyValue(100);
 
       expect(formatted).toContain("B3");
       expect(formatted).not.toContain("$");
@@ -91,7 +91,7 @@ describe("useCurrencyConversion", () => {
       mockStoreState.baseCurrency = "B3";
 
       const { result } = renderHook(() => useCurrencyConversion());
-      const formatted = result.current.formatCurrencyValue(100, "B3");
+      const formatted = result.current.formatCurrencyValue(100);
 
       expect(formatted).toMatch(/^\$/);
       expect(formatted).toContain("200");
@@ -104,7 +104,7 @@ describe("useCurrencyConversion", () => {
       mockStoreState.baseCurrency = "B3";
 
       const { result } = renderHook(() => useCurrencyConversion());
-      const formatted = result.current.formatCurrencyValue(100, "B3");
+      const formatted = result.current.formatCurrencyValue(100);
 
       expect(formatted).toMatch(/^€/);
     });
@@ -116,7 +116,7 @@ describe("useCurrencyConversion", () => {
       mockStoreState.baseCurrency = "B3";
 
       const { result } = renderHook(() => useCurrencyConversion());
-      const formatted = result.current.formatCurrencyValue(100, "B3");
+      const formatted = result.current.formatCurrencyValue(100);
 
       expect(formatted).toContain("¥");
       expect(formatted).not.toContain(".");
@@ -129,7 +129,7 @@ describe("useCurrencyConversion", () => {
       mockStoreState.baseCurrency = "B3";
 
       const { result } = renderHook(() => useCurrencyConversion());
-      const formatted = result.current.formatCurrencyValue(100, "B3");
+      const formatted = result.current.formatCurrencyValue(100);
 
       expect(formatted).toContain("₩");
       expect(formatted).not.toContain(".");
@@ -142,7 +142,7 @@ describe("useCurrencyConversion", () => {
       mockStoreState.baseCurrency = "B3";
 
       const { result } = renderHook(() => useCurrencyConversion());
-      const formatted = result.current.formatCurrencyValue(100, "B3");
+      const formatted = result.current.formatCurrencyValue(100);
 
       expect(formatted).toContain("ETH");
       expect(formatted).not.toMatch(/^ETH/);
@@ -155,7 +155,7 @@ describe("useCurrencyConversion", () => {
       mockStoreState.baseCurrency = "B3";
 
       const { result } = renderHook(() => useCurrencyConversion());
-      const formatted = result.current.formatCurrencyValue(100, "B3");
+      const formatted = result.current.formatCurrencyValue(100);
 
       expect(formatted).toContain("SOL");
       expect(formatted).not.toMatch(/^SOL/);
@@ -167,7 +167,7 @@ describe("useCurrencyConversion", () => {
       mockStoreState.baseCurrency = "B3";
 
       const { result } = renderHook(() => useCurrencyConversion());
-      const formatted = result.current.formatCurrencyValue(10, "B3");
+      const formatted = result.current.formatCurrencyValue(10);
 
       // 10 * 1.5 = 15
       expect(formatted).toMatch(/^\$/);
@@ -182,7 +182,7 @@ describe("useCurrencyConversion", () => {
 
       const { result } = renderHook(() => useCurrencyConversion());
       const inputValue = 100;
-      const formatted = result.current.formatCurrencyValue(inputValue, "B3");
+      const formatted = result.current.formatCurrencyValue(inputValue);
 
       expect(formatted).toContain("350");
     });
@@ -236,7 +236,7 @@ describe("useCurrencyConversion", () => {
       mockStoreState.baseCurrency = "B3";
 
       const { result } = renderHook(() => useCurrencyConversion());
-      const tooltip = result.current.formatTooltipValue(100, "B3");
+      const tooltip = result.current.formatTooltipValue(100);
 
       expect(tooltip).toContain("USD");
       expect(tooltip).toContain("150");
@@ -249,7 +249,7 @@ describe("useCurrencyConversion", () => {
       mockStoreState.baseCurrency = "B3";
 
       const { result } = renderHook(() => useCurrencyConversion());
-      const tooltip = result.current.formatTooltipValue(100, "B3");
+      const tooltip = result.current.formatTooltipValue(100);
 
       expect(tooltip).toContain("B3");
       expect(tooltip).toContain("100");
@@ -286,7 +286,7 @@ describe("useCurrencyConversion", () => {
       mockStoreState.baseCurrency = "B3";
 
       const { result } = renderHook(() => useCurrencyConversion());
-      const tooltip = result.current.formatTooltipValue(-100, "B3");
+      const tooltip = result.current.formatTooltipValue(-100);
 
       expect(tooltip).toContain("USD");
       expect(tooltip).toContain("150");
@@ -299,7 +299,7 @@ describe("useCurrencyConversion", () => {
       mockStoreState.baseCurrency = "B3";
 
       const { result } = renderHook(() => useCurrencyConversion());
-      const tooltip = result.current.formatTooltipValue(100, "B3");
+      const tooltip = result.current.formatTooltipValue(100);
 
       expect(tooltip).toContain("USD");
       expect(tooltip).toContain("100");