chore: migrate to Crossmint wallets v1 SDK

app/home.tsx

@@ -2,12 +2,12 @@
 
 import { Login } from "@/components/Login";
 import { MainScreen } from "@/components/MainScreen";
-import { useAuth, useWallet } from "@crossmint/client-sdk-react-ui";
+import { useCrossmintAuth, useWallet } from "@crossmint/client-sdk-react-ui";
 import { useProcessWithdrawal } from "@/hooks/useProcessWithdrawal";
 
 export function HomeContent() {
   const { wallet, status: walletStatus } = useWallet();
-  const { status, status: authStatus, user } = useAuth();
+  const { status, status: authStatus, user } = useCrossmintAuth();
 
   useProcessWithdrawal(user?.id, wallet);
 

app/providers.tsx

@@ -32,10 +32,9 @@ export function Providers({ children }: { children: React.ReactNode }) {
           }
         >
           <CrossmintWalletProvider
-            showPasskeyHelpers={chain !== "solana"}
             createOnLogin={{
               chain,
-              signer: { type: "email" },
+              recovery: { type: "email" },
             }}
           >
             {children}

components/Login.tsx

@@ -1,10 +1,10 @@
 "use client";
 
-import { useAuth } from "@crossmint/client-sdk-react-ui";
+import { useCrossmintAuth } from "@crossmint/client-sdk-react-ui";
 import { useEffect } from "react";
 
 export function Login() {
-  const { login, status } = useAuth();
+  const { login, status } = useCrossmintAuth();
   useEffect(() => {
     if (status === "logged-out") {
       login();

components/Logout.tsx

@@ -1,9 +1,9 @@
 "use client";
 
-import { useAuth } from "@crossmint/client-sdk-react-ui";
+import { useCrossmintAuth } from "@crossmint/client-sdk-react-ui";
 
 export function LogoutButton() {
-  const { logout } = useAuth();
+  const { logout } = useCrossmintAuth();
 
   return (
     <button

components/MainScreen.tsx

@@ -1,6 +1,6 @@
 import { useState } from "react";
 import Image from "next/image";
-import { useAuth } from "@crossmint/client-sdk-react-ui";
+import { useCrossmintAuth } from "@crossmint/client-sdk-react-ui";
 import { DepositModal } from "@/components/deposit";
 import { SendFundsModal } from "@/components/send-funds";
 import { EarnYieldModal } from "@/components/earn-yield";
@@ -16,7 +16,7 @@ export function MainScreen({ walletAddress }: MainScreenProps) {
   const [showDepositModal, setShowDepositModal] = useState(false);
   const [showSendModal, setShowSendModal] = useState(false);
   const [showEarnYieldModal, setShowEarnYieldModal] = useState(false);
-  const { logout } = useAuth();
+  const { logout } = useCrossmintAuth();
 
   return (
     <div className="flex h-full w-full justify-center gap-2 px-4 py-6">

components/dashboard-summary/WalletDetails.tsx

@@ -1,4 +1,4 @@
-import { useAuth, useWallet } from "@crossmint/client-sdk-react-ui";
+import { useCrossmintAuth, useWallet } from "@crossmint/client-sdk-react-ui";
 import Image from "next/image";
 import { Dialog, DialogContent, DialogTitle } from "../common/Dialog";
 import { Details } from "../common/Details";
@@ -7,7 +7,7 @@ import { shortenAddress } from "@/utils/shortenAddress";
 
 export function WalletDetails({ onClose, open }: { onClose: () => void; open: boolean }) {
   const { wallet } = useWallet();
-  const { user } = useAuth();
+  const { user } = useCrossmintAuth();
 
   // Format chain name for display (e.g., "base-sepolia" -> "Base-Sepolia")
   const formatChainName = (chain: string) => {

components/dashboard-summary/index.tsx

@@ -12,7 +12,7 @@ import {
   DropdownMenuTrigger,
 } from "../common/DropdownMenu";
 import { WalletDetails } from "./WalletDetails";
-import { useWallet, useAuth } from "@crossmint/client-sdk-react-ui";
+import { useWallet, useCrossmintAuth } from "@crossmint/client-sdk-react-ui";
 
 interface DashboardSummaryProps {
   onDepositClick: () => void;
@@ -22,7 +22,7 @@ interface DashboardSummaryProps {
 export function DashboardSummary({ onDepositClick, onSendClick }: DashboardSummaryProps) {
   const [showWalletDetails, setShowWalletDetails] = useState(false);
   const { wallet } = useWallet();
-  const { user } = useAuth();
+  const { user } = useCrossmintAuth();
   const [openWarningModal, setOpenWarningModal] = useState(false);
 
   const handleWithdraw = () => {

components/deposit/index.tsx

@@ -2,7 +2,7 @@ import React, { useCallback, useState } from "react";
 import {
   CrossmintCheckoutProvider,
   CrossmintProvider,
-  useAuth,
+  useCrossmintAuth,
 } from "@crossmint/client-sdk-react-ui";
 import { Checkout } from "./Checkout";
 import { AmountInput } from "../common/AmountInput";
@@ -23,7 +23,7 @@ const MAX_AMOUNT = 50; // Max amount in USD allowed in staging
 
 export function DepositModal({ open, onClose, walletAddress }: DepositModalProps) {
   const [step, setStep] = useState<"options" | "processing" | "completed">("options");
-  const { user } = useAuth();
+  const { user } = useCrossmintAuth();
   const receiptEmail = user?.email;
   const [amount, setAmount] = useState("");
   const { refetch: refetchActivityFeed } = useActivityFeed();

components/send-funds/index.tsx

@@ -1,5 +1,5 @@
 import React, { useState } from "react";
-import { useAuth, useWallet } from "@crossmint/client-sdk-react-ui";
+import { useCrossmintAuth, useWallet } from "@crossmint/client-sdk-react-ui";
 import { AmountInput } from "../common/AmountInput";
 import { OrderPreview } from "./OrderPreview";
 import { RecipientInput } from "./RecipientInput";
@@ -16,7 +16,7 @@ interface SendFundsModalProps {
 
 export function SendFundsModal({ open, onClose }: SendFundsModalProps) {
   const { wallet } = useWallet();
-  const { user } = useAuth();
+  const { user } = useCrossmintAuth();
   const [recipient, setRecipient] = useState("");
   const [amount, setAmount] = useState("");
   const [showPreview, setShowPreview] = useState(false);

hooks/useActivityFeed.ts

@@ -32,7 +32,7 @@ export function useActivityFeed() {
   // Fetch wallet activity
   const walletActivityQuery = useQuery({
     queryKey: ["walletActivity", wallet?.address],
-    queryFn: async () => await wallet?.experimental_activity(),
+    queryFn: async () => await wallet?.transfers({ tokens: "usdc", status: "successful" }),
     enabled: !!wallet?.address,
   });
 
@@ -46,7 +46,15 @@ export function useActivityFeed() {
 
   // Combine and sort events
   const combinedEvents = (() => {
-    const walletEvents: ActivityEvent[] = walletActivityQuery.data?.events || [];
+    // Map V1 transfers to ActivityEvent format
+    const walletEvents: ActivityEvent[] = (walletActivityQuery.data?.data || []).map((tx: any) => ({
+      from_address: tx.sender?.address || "",
+      to_address: tx.recipient?.address,
+      timestamp: new Date(tx.completedAt).getTime(),
+      type: tx.type || "",
+      amount: tx.token?.amount || "0",
+      token_symbol: tx.token?.symbol,
+    }));
 
     // Transform yield actions to activity events
     const yieldEvents: ActivityEvent[] = (yieldActionsQuery.data || []).map(

package.json

@@ -10,7 +10,7 @@
     "format:check": "prettier --check ."
   },
   "dependencies": {
-    "@crossmint/client-sdk-react-ui": "2.6.16",
+    "@crossmint/client-sdk-react-ui": "^4.0.1",
     "@heroicons/react": "2.0.18",
     "@radix-ui/react-dialog": "1.1.1",
     "@radix-ui/react-dropdown-menu": "2.1.1",
@@ -37,4 +37,4 @@
     "tailwindcss": "^4",
     "typescript": "^5"
   }
-}
+}