@b3dotfun/sdk 0.1.69-alpha.17 → 0.1.69-alpha.18

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@b3dotfun/sdk",
-  "version": "0.1.69-alpha.17",
+  "version": "0.1.69-alpha.18",
   "source": "src/index.ts",
   "main": "./dist/cjs/index.js",
   "react-native": "./dist/cjs/index.native.js",
@@ -329,6 +329,7 @@
     "@stripe/stripe-js": "^7.3.1",
     "@thirdweb-dev/wagmi-adapter": "0.2.165",
     "@web3icons/react": "3.16.0",
+    "better-auth": "^1.5.6",
     "big.js": "^7.0.1",
     "boring-avatars": "^2.0.4",
     "class-variance-authority": "0.7.0",

package/src/anyspend/utils/chain.ts

@@ -3,7 +3,6 @@ import {
   ABSTRACT_PUBLIC_RPC,
   ARBITRUM_PUBLIC_RPC,
   AVALANCHE_PUBLIC_RPC,
-  B3_PUBLIC_RPC,
   BASE_PUBLIC_RPC,
   BSC_PUBLIC_RPC,
   ETHEREUM_PUBLIC_RPC,
@@ -12,6 +11,7 @@ import {
   POLYGON_PUBLIC_RPC,
 } from "@b3dotfun/sdk/anyspend/constants/rpc";
 import { components } from "@b3dotfun/sdk/anyspend/types/api";
+import { b3Viem } from "@b3dotfun/sdk/shared/constants/chains/b3Viem";
 import invariant from "invariant";
 import {
   Account,
@@ -25,7 +25,6 @@ import {
   Transport,
   WalletClient,
 } from "viem";
-import { b3Viem } from "@b3dotfun/sdk/shared/constants/chains/b3Viem";
 import { abstract, arbitrum, avalanche, base, bsc, mainnet, optimism, polygon } from "viem/chains";
 import { ChainType, IBaseChain, IEVMChain, IHyperliquidChain, ISolanaChain } from "../types/chain";
 import {

package/src/global-account/better-auth-client.ts

@@ -0,0 +1,17 @@
+import { createAuthClient } from "better-auth/client";
+import { B3_API_URL } from "../app.shared";
+
+export type B3BetterAuthClient = ReturnType<typeof createB3BetterAuthClient>;
+
+export function createB3BetterAuthClient(baseURL: string = B3_API_URL) {
+  return createAuthClient({
+    baseURL,
+    basePath: "/auth",
+    fetchOptions: {
+      credentials: "include",
+    },
+  });
+}
+
+// Default singleton for standard usage
+export const betterAuthClient = createB3BetterAuthClient();

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

@@ -15,6 +15,8 @@ const DEFAULT_PERMISSIONS: PermissionsConfig = {
   endDate: new Date(Date.now() + 1000 * 60 * 60 * 24 * 365), // 1 year from now
 };
 
+export type AuthStrategy = "thirdweb" | "better-auth";
+
 export interface B3ConfigContextType {
   accountOverride?: Account;
   automaticallySetFirstEoa: boolean;
@@ -25,6 +27,7 @@ export interface B3ConfigContextType {
   partnerId: string;
   stripePublishableKey?: string;
   createClientReferenceId?: (params: CreateOrderParams | CreateOnrampOrderParams) => Promise<string>;
+  authStrategy: AuthStrategy;
 }
 
 const B3ConfigContext = createContext<B3ConfigContextType | null>(null);
@@ -40,6 +43,7 @@ export function B3ConfigProvider({
   partnerId,
   stripePublishableKey,
   createClientReferenceId,
+  authStrategy = "thirdweb",
 }: {
   children: React.ReactNode;
   accountOverride?: Account;
@@ -51,6 +55,7 @@ export function B3ConfigProvider({
   partnerId: string;
   stripePublishableKey?: string;
   createClientReferenceId?: (params: CreateOrderParams | CreateOnrampOrderParams) => Promise<string>;
+  authStrategy?: AuthStrategy;
 }) {
   return (
     <B3ConfigContext.Provider
@@ -64,6 +69,7 @@ export function B3ConfigProvider({
         partnerId,
         stripePublishableKey,
         createClientReferenceId,
+        authStrategy,
       }}
     >
       {children}

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

@@ -3,6 +3,7 @@ import { CreateOrderParams } from "@b3dotfun/sdk/anyspend/react/hooks/useAnyspen
 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 type { AuthStrategy } from "./B3ConfigProvider";
 import { loadGA4Script } from "@b3dotfun/sdk/global-account/utils/analytics";
 import { WalletProvider } from "@b3dotfun/sdk/wallet/react";
 import "@relayprotocol/relay-kit-ui/styles.css";
@@ -15,6 +16,7 @@ import { StyleRoot } from "../StyleRoot";
 import { setToastContext, ToastProvider, useToastContext } from "../Toast/index";
 import AuthenticationProvider from "./AuthenticationProvider";
 import { B3ConfigProvider } from "./B3ConfigProvider";
+import BetterAuthProvider from "./BetterAuthProvider";
 import { LocalSDKProvider } from "./LocalSDKProvider";
 
 /**
@@ -42,6 +44,7 @@ export function B3Provider({
   defaultPermissions,
   disableBSMNTAuthentication = false,
   queryClient,
+  authStrategy = "thirdweb",
 }: {
   theme: "light" | "dark";
   children: React.ReactNode;
@@ -69,6 +72,8 @@ export function B3Provider({
   disableBSMNTAuthentication?: boolean;
   /** Provide your own QueryClient for React Query. If omitted, WalletProvider creates one internally. */
   queryClient?: QueryClient;
+  /** Auth strategy: "thirdweb" (default, ecosystem wallet) or "better-auth" (email/password via Better Auth) */
+  authStrategy?: AuthStrategy;
 }) {
   // Initialize Google Analytics on mount
   useEffect(() => {
@@ -104,6 +109,7 @@ export function B3Provider({
               stripePublishableKey={stripePublishableKey}
               createClientReferenceId={createClientReferenceId}
               defaultPermissions={defaultPermissions}
+              authStrategy={authStrategy}
             >
               <ToastContextConnector />
               <RelayKitProviderWrapper simDuneApiKey={simDuneApiKey}>
@@ -111,11 +117,15 @@ export function B3Provider({
                 {/* 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}
-                defaultEoaProvider={defaultEoaProvider}
-              />
+              {authStrategy === "better-auth" ? (
+                <BetterAuthProvider partnerId={partnerId} />
+              ) : (
+                <AuthenticationProvider
+                  partnerId={partnerId}
+                  automaticallySetFirstEoa={!!automaticallySetFirstEoa}
+                  defaultEoaProvider={defaultEoaProvider}
+                />
+              )}
             </B3ConfigProvider>
           </LocalSDKProvider>
         </ToastProvider>

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

@@ -0,0 +1,127 @@
+import app from "@b3dotfun/sdk/global-account/app";
+import { useAuthStore } from "@b3dotfun/sdk/global-account/react";
+import { B3_AUTH_COOKIE_NAME } from "@b3dotfun/sdk/shared/constants";
+import { debugB3React } from "@b3dotfun/sdk/shared/utils/debug";
+import Cookies from "js-cookie";
+import { useEffect, useRef } from "react";
+import { betterAuthClient } from "../../../better-auth-client";
+import { useUserQuery } from "../../hooks/useUserQuery";
+
+const debug = debugB3React("BetterAuthProvider");
+
+/**
+ * Parallel to AuthenticationProvider for Better Auth strategy.
+ *
+ * Manages the isAuthenticating lifecycle for Better Auth:
+ * 1. On mount, try to restore an existing Feathers JWT (from a previous login)
+ * 2. If no Feathers JWT, check for a Better Auth session (e.g. after OAuth redirect)
+ *    and exchange it for a Feathers JWT
+ * 3. If neither exists, set isAuthenticating: false so the login UI renders
+ *
+ * Also patches app.logout() so any code path that calls it (useAuthentication,
+ * useAuth, SignIn component, etc.) automatically clears the Better Auth session.
+ */
+const BetterAuthProvider = ({ partnerId }: { partnerId: string }) => {
+  const setIsAuthenticated = useAuthStore(state => state.setIsAuthenticated);
+  const setIsAuthenticating = useAuthStore(state => state.setIsAuthenticating);
+  const setIsConnected = useAuthStore(state => state.setIsConnected);
+  const { setUser } = useUserQuery();
+  const hasAttemptedRestore = useRef(false);
+  const hasPatched = useRef(false);
+
+  // Patch app.logout() to also clear the Better Auth session.
+  // This ensures any existing logout path (useAuthentication, useAuth, SignIn
+  // dropdown, etc.) clears both the Feathers JWT and the Better Auth session.
+  // Patch app.logout() to also clear the Better Auth session.
+  // Only handles Better Auth signOut — state cleanup (isAuthenticated, isConnected,
+  // setUser, localStorage) is handled by useAuthentication/useAuth's own logout.
+  useEffect(() => {
+    if (hasPatched.current) return;
+    hasPatched.current = true;
+
+    const originalLogout = app.logout.bind(app);
+    (app as any).logout = async () => {
+      debug("Patched logout: clearing Better Auth session");
+      try {
+        await betterAuthClient.signOut();
+      } catch {
+        debug("Better Auth signOut failed (non-critical)");
+      }
+      return originalLogout();
+    };
+
+    return () => {
+      (app as any).logout = originalLogout;
+      hasPatched.current = false;
+    };
+  }, []);
+
+  // Session restore on mount
+  useEffect(() => {
+    if (hasAttemptedRestore.current) return;
+    hasAttemptedRestore.current = true;
+
+    const restoreSession = async () => {
+      debug("Attempting session restore");
+
+      // 1. Try existing Feathers JWT first (fastest — no network call to Better Auth)
+      try {
+        const response = await app.reAuthenticate();
+        if (response?.user) {
+          debug("Feathers JWT restored", { userId: response.user.userId });
+          setUser(response.user);
+          setIsAuthenticated(true);
+          setIsConnected(true);
+          setIsAuthenticating(false);
+          return;
+        }
+      } catch {
+        debug("No existing Feathers JWT");
+      }
+
+      // 2. Check for a Better Auth session (e.g. after OAuth redirect sets a cookie)
+      try {
+        const session = await betterAuthClient.getSession();
+        if (session.data?.session?.token) {
+          debug("Better Auth session found, exchanging for Feathers JWT", {
+            betterAuthUserId: session.data.user?.id,
+          });
+
+          const response = await app.authenticate({
+            strategy: "better-auth",
+            accessToken: session.data.session.token,
+            partnerId,
+          } as any);
+
+          if (response.accessToken) {
+            Cookies.set(B3_AUTH_COOKIE_NAME, response.accessToken, {
+              secure: true,
+              sameSite: "Lax",
+            });
+          }
+
+          if (response.user) {
+            setUser(response.user);
+            setIsAuthenticated(true);
+            setIsConnected(true);
+          }
+
+          debug("OAuth session exchanged for Feathers JWT", { userId: response.user?.userId });
+          setIsAuthenticating(false);
+          return;
+        }
+      } catch {
+        debug("No Better Auth session to restore");
+      }
+
+      // 3. Nothing found — show login UI
+      setIsAuthenticating(false);
+    };
+
+    restoreSession();
+  }, [setIsAuthenticated, setIsAuthenticating, setIsConnected, setUser, partnerId]);
+
+  return null;
+};
+
+export default BetterAuthProvider;

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

@@ -0,0 +1,146 @@
+import { Button, Input } from "@b3dotfun/sdk/global-account/react";
+import { debugB3React } from "@b3dotfun/sdk/shared/utils/debug";
+import { useState } from "react";
+import { useBetterAuth } from "../../hooks/useBetterAuth";
+
+const debug = debugB3React("BetterAuthResetPassword");
+
+export interface BetterAuthResetPasswordProps {
+  /** The reset token from the URL query param */
+  token: string;
+  /** Called after password is successfully reset */
+  onSuccess?: () => void;
+  /** Called on error */
+  onError?: (error: Error) => void;
+  /** Optional class name */
+  className?: string;
+}
+
+/**
+ * Standalone reset password form. Render this on your reset password page.
+ * Reads the token from props (extract it from the URL query string).
+ *
+ * Usage:
+ * ```tsx
+ * const token = new URLSearchParams(window.location.search).get("token");
+ * <BetterAuthResetPassword token={token} onSuccess={() => navigate("/login")} />
+ * ```
+ */
+export function BetterAuthResetPassword({ token, onSuccess, onError, className }: BetterAuthResetPasswordProps) {
+  const { resetPassword } = useBetterAuth();
+
+  const [password, setPassword] = useState("");
+  const [confirmPassword, setConfirmPassword] = useState("");
+  const [isLoading, setIsLoading] = useState(false);
+  const [error, setError] = useState<string | null>(null);
+  const [success, setSuccess] = useState(false);
+
+  const handleSubmit = async () => {
+    if (!password) {
+      setError("Please enter a new password");
+      return;
+    }
+
+    if (password.length < 8) {
+      setError("Password must be at least 8 characters");
+      return;
+    }
+
+    if (password !== confirmPassword) {
+      setError("Passwords do not match");
+      return;
+    }
+
+    try {
+      setIsLoading(true);
+      setError(null);
+      await resetPassword(password, token);
+      setSuccess(true);
+      debug("Password reset successful");
+      onSuccess?.();
+    } catch (err) {
+      const message = err instanceof Error ? err.message : "Password reset failed";
+      setError(message);
+      debug("Password reset failed", err);
+      onError?.(err as Error);
+    } finally {
+      setPassword("");
+      setConfirmPassword("");
+      setIsLoading(false);
+    }
+  };
+
+  if (!token) {
+    return (
+      <div className={`w-full max-w-[400px] px-6 text-center ${className || ""}`}>
+        <p className="text-sm text-red-500">Invalid or missing reset token.</p>
+      </div>
+    );
+  }
+
+  return (
+    <div className={`w-full max-w-[400px] px-6 ${className || ""}`}>
+      <div className="mb-10 text-center">
+        <h1 className="text-[28px] font-semibold tracking-tight text-gray-900 dark:text-gray-100">
+          {success ? "Password reset" : "Set new password"}
+        </h1>
+        <p className="mt-3 text-[15px] text-gray-500 dark:text-gray-400">
+          {success ? "Your password has been updated." : "Enter your new password below."}
+        </p>
+      </div>
+
+      {success ? (
+        <div className="space-y-4 text-center">
+          <div className="mx-auto flex h-12 w-12 items-center justify-center rounded-full bg-green-100">
+            <svg className="h-6 w-6 text-green-600" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+              <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M5 13l4 4L19 7" />
+            </svg>
+          </div>
+        </div>
+      ) : (
+        <div className="space-y-5">
+          <div>
+            <label className="mb-2 block text-xs font-medium uppercase tracking-wide text-gray-700 dark:text-gray-300">
+              New password
+            </label>
+            <Input
+              type="password"
+              placeholder="At least 8 characters"
+              value={password}
+              onChange={e => setPassword(e.target.value)}
+              disabled={isLoading}
+              className="h-11 px-4 text-[15px]"
+            />
+          </div>
+
+          <div>
+            <label className="mb-2 block text-xs font-medium uppercase tracking-wide text-gray-700 dark:text-gray-300">
+              Confirm password
+            </label>
+            <Input
+              type="password"
+              placeholder="Repeat your password"
+              value={confirmPassword}
+              onChange={e => setConfirmPassword(e.target.value)}
+              disabled={isLoading}
+              onKeyDown={e => {
+                if (e.key === "Enter") handleSubmit();
+              }}
+              className="h-11 px-4 text-[15px]"
+            />
+          </div>
+
+          {error && <p className="text-sm text-red-500">{error}</p>}
+
+          <Button
+            onClick={handleSubmit}
+            disabled={isLoading}
+            className="h-11 w-full bg-gray-900 text-[15px] font-medium text-white hover:bg-gray-800 dark:bg-white dark:text-gray-900 dark:hover:bg-gray-100"
+          >
+            {isLoading ? "Resetting..." : "Reset password"}
+          </Button>
+        </div>
+      )}
+    </div>
+  );
+}