@volr/react-ui 0.1.124 → 0.1.126

package/dist/index.js

@@ -1,6 +1,6 @@
 import React13, { createContext, useContext, useState, useMemo, useEffect, useCallback, useRef, useId, useReducer } from 'react';
 import { createPortal } from 'react-dom';
-import { useVolrContext, useInternalAuth, usePasskeyEnrollment, checkPrfCompatibility, getPlatformHint, useMpcConnection, VolrProvider, useVolrAuthCallback, useVolrPaymentApi, useUserBalances, useVolrLogin, useVolr, useWithdraw, useDepositListener, createGetNetworkInfo, useEIP6963 } from '@volr/react';
+import { useVolrContext, useInternalAuth, usePasskeyEnrollment, checkPrfCompatibility, getPlatformHint, useMpcConnection, VolrProvider, useVolrAuthCallback, useVolrPaymentApi, completeMigration, requestMigration, decryptEntropyForMigration, listenForSeedRequests, useUserBalances, useVolrLogin, useVolr, useWithdraw, useDepositListener, createGetNetworkInfo, useEIP6963 } from '@volr/react';
 export { VolrProvider, useDepositListener, usePasskeyEnrollment, useVolr, useVolrLogin, useVolrPaymentApi } from '@volr/react';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { clsx } from 'clsx';
@@ -2157,7 +2157,12 @@ function PasskeyEnrollView({
   }
   if (migrationInfo.needsMigration && migrationInfo.sourcePasskey) {
     const handleMigration = async () => {
-      await handleEnroll();
+      const targetOrigin = typeof window !== "undefined" ? window.location.origin : "";
+      const sourceRpId = migrationInfo.sourcePasskey.rpId;
+      const sourceOrigin = sourceRpId === "localhost" ? "http://localhost" : `https://${sourceRpId}`;
+      const url = new URL(sourceOrigin);
+      url.searchParams.set("volr_migrate_to", targetOrigin);
+      window.open(url.toString(), "_blank", "noopener,noreferrer");
     };
     return /* @__PURE__ */ jsx(
       PasskeyMigrationView,
@@ -5125,6 +5130,8 @@ function AccountModal({ isOpen, onClose, onError }) {
   const [currentView, setCurrentView] = useState("main");
   const [selectedPayment, setSelectedPayment] = useState(null);
   const [isLoggingOut, setIsLoggingOut] = useState(false);
+  const prevUserRef = useRef(user ?? null);
+  const [closingAfterLogin, setClosingAfterLogin] = useState(false);
   const [depositAssets, setDepositAssets] = useState([]);
   const [depositLoading, setDepositLoading] = useState(false);
   const [depositError, setDepositError] = useState(null);
@@ -5155,6 +5162,29 @@ function AccountModal({ isOpen, onClose, onError }) {
       }, 200);
     }
   }, [onClose]);
+  useEffect(() => {
+    if (!isOpen) {
+      setClosingAfterLogin(false);
+      prevUserRef.current = user ?? null;
+      return;
+    }
+    const wasLoggedOut = prevUserRef.current == null;
+    const isNowLoggedIn = user != null;
+    if (wasLoggedOut && isNowLoggedIn) {
+      setClosingAfterLogin(true);
+      setTimeout(() => {
+        onClose();
+      }, 0);
+    }
+    prevUserRef.current = user ?? null;
+  }, [isOpen, user, onClose]);
+  if (closingAfterLogin && isOpen) {
+    return /* @__PURE__ */ jsxs(Modal, { open: isOpen, onOpenChange: handleOpenChange, children: [
+      /* @__PURE__ */ jsx(ModalHeader, { onClose: () => {
+      } }),
+      /* @__PURE__ */ jsx("div", { className: "volr:text-center volr:py-8", children: /* @__PURE__ */ jsx("p", { className: "volr:text-sm volr-text-secondary", children: "Completing login..." }) })
+    ] });
+  }
   if (!user) {
     return /* @__PURE__ */ jsx(SigninModal, { isOpen, onClose, onError });
   }
@@ -6632,6 +6662,17 @@ function SignRequestModal({ open, onOpenChange }) {
   );
 }
 var VolrUIContext = React13.createContext(null);
+function getCurrentRpId() {
+  if (typeof window === "undefined") return "localhost";
+  return window.location.hostname;
+}
+function isPasskeyDomainMismatch(user) {
+  const currentRpId = getCurrentRpId();
+  const registered = user?.registeredPasskeys;
+  if (user?.keyStorageType !== "passkey") return false;
+  if (!Array.isArray(registered) || registered.length === 0) return false;
+  return !registered.some((p) => p?.rpId === currentRpId);
+}
 var useVolrUI = () => {
   const context = useContext(VolrUIContext);
   if (!context) {
@@ -6762,6 +6803,13 @@ function VolrUIProviderInner({
         keyStorageType
       },
       children: /* @__PURE__ */ jsxs(VolrModalProvider, { children: [
+        /* @__PURE__ */ jsx(
+          MigrationCoordinator,
+          {
+            onShowOnboarding: () => setShowOnboarding(true),
+            onHideOnboarding: () => setShowOnboarding(false)
+          }
+        ),
         /* @__PURE__ */ jsx(
           OAuthCallbackHandler,
           {
@@ -6804,6 +6852,130 @@ function VolrUIProviderInner({
     }
   ) }) });
 }
+function normalizeOrigin(input) {
+  try {
+    const u = new URL(input);
+    return `${u.protocol}//${u.host}`;
+  } catch {
+    return input;
+  }
+}
+function MigrationCoordinator({
+  onShowOnboarding,
+  onHideOnboarding
+}) {
+  const { user, setUser } = useVolrContext();
+  const { client } = useInternalAuth();
+  const [running, setRunning] = useState(false);
+  useEffect(() => {
+    if (typeof window === "undefined") return;
+    const handler = (event) => {
+      const data = event.data;
+      if (data?.type === "VOLR_MIGRATION_DONE") {
+        client.refreshSession().then((u) => u && setUser(u)).catch(() => void 0);
+        onHideOnboarding();
+      }
+    };
+    window.addEventListener("message", handler);
+    return () => window.removeEventListener("message", handler);
+  }, [client, setUser, onHideOnboarding]);
+  useEffect(() => {
+    if (typeof window === "undefined") return;
+    if (running) return;
+    const params = new URLSearchParams(window.location.search);
+    const migrationToken = params.get("migration_token");
+    const sourceOriginParam = params.get("source_origin");
+    const isTargetPopup = Boolean(migrationToken && sourceOriginParam);
+    const migrateTo = params.get("volr_migrate_to");
+    const isSourceFlow = Boolean(migrateTo);
+    if (!isTargetPopup && !isSourceFlow) {
+      return;
+    }
+    const run = async () => {
+      setRunning(true);
+      try {
+        if (isTargetPopup) {
+          const sourceOrigin2 = normalizeOrigin(sourceOriginParam);
+          const token2 = migrationToken;
+          const refreshedUser2 = await client.refreshSession();
+          const effectiveUser2 = refreshedUser2 ?? user;
+          if (refreshedUser2) setUser(refreshedUser2);
+          if (!effectiveUser2?.id || !effectiveUser2?.projectId) {
+            throw new Error(
+              "Migration requires an active session on the target site. Please log in first."
+            );
+          }
+          const { requestSeedFromOpener } = await import('@volr/react');
+          const seed = await requestSeedFromOpener(sourceOrigin2, token2);
+          await completeMigration({
+            client,
+            userId: seed.userId,
+            projectId: seed.projectId,
+            migrationToken: token2,
+            masterSeed: seed.masterSeed,
+            rpName: effectiveUser2.projectName ?? "Volr",
+            userEmail: effectiveUser2.email ?? null
+          });
+          try {
+            window.opener?.postMessage({ type: "VOLR_MIGRATION_DONE" }, "*");
+          } catch {
+          }
+          window.close();
+          return;
+        }
+        const targetOrigin = normalizeOrigin(migrateTo);
+        const sourceOrigin = window.location.origin;
+        const refreshedUser = await client.refreshSession();
+        const effectiveUser = refreshedUser ?? user;
+        if (refreshedUser) setUser(refreshedUser);
+        if (!effectiveUser?.id || !effectiveUser?.projectId) {
+          throw new Error(
+            "Migration requires an active session on the source site. Please log in first."
+          );
+        }
+        const currentRpId = getCurrentRpId();
+        const sourcePasskey = effectiveUser.registeredPasskeys?.find((p) => p?.rpId === currentRpId) ?? null;
+        if (!sourcePasskey?.credentialId || !sourcePasskey?.blobUrl || !sourcePasskey?.prfInput) {
+          throw new Error(
+            `No passkey registered for source rpId=${currentRpId}. Cannot migrate from this site.`
+          );
+        }
+        const token = await requestMigration({ client, targetOrigin });
+        const entropy = await decryptEntropyForMigration({
+          client,
+          userId: effectiveUser.id,
+          blobUrl: sourcePasskey.blobUrl,
+          prfInput: sourcePasskey.prfInput,
+          credentialId: sourcePasskey.credentialId,
+          rpName: effectiveUser.projectName ?? "Volr"
+        });
+        const cleanup = listenForSeedRequests(
+          [targetOrigin],
+          async () => entropy,
+          () => ({ userId: effectiveUser.id, projectId: effectiveUser.projectId })
+        );
+        const url = new URL(targetOrigin);
+        url.searchParams.set("migration_token", token.migrationToken);
+        url.searchParams.set("source_origin", sourceOrigin);
+        window.open(
+          url.toString(),
+          "volr_migration",
+          "width=500,height=650,left=100,top=100,popup=1"
+        );
+        onShowOnboarding();
+        setTimeout(() => cleanup(), 2 * 60 * 1e3);
+        return;
+      } finally {
+        setRunning(false);
+      }
+    };
+    run().catch((e) => {
+      console.error("[MigrationCoordinator] failed:", e);
+      setRunning(false);
+    });
+  }, [client, user, setUser, running, onShowOnboarding, onHideOnboarding]);
+  return null;
+}
 function AccountModalPortal() {
   const { isOpen, mode, close } = useVolrModal();
   const [portalRoot, setPortalRoot] = useState(null);
@@ -7033,6 +7205,7 @@ function OnboardingChecker({
   const { user, provider, isLoading } = useVolrContext();
   const { isOpen: isModalOpen } = useVolrModal();
   const modalWasOpened = React13.useRef(false);
+  const pendingMismatchOnboarding = React13.useRef(false);
   useEffect(() => {
     if (isModalOpen) {
       modalWasOpened.current = true;
@@ -7042,15 +7215,21 @@ function OnboardingChecker({
     if (isLoading) {
       return;
     }
+    const passkeyDomainMismatch = isPasskeyDomainMismatch(user);
     if (isModalOpen) {
+      if (passkeyDomainMismatch) {
+        pendingMismatchOnboarding.current = true;
+      }
       onHideOnboarding();
       return;
     }
     if (modalWasOpened.current) {
-      onHideOnboarding();
-      return;
+      if (!passkeyDomainMismatch && !pendingMismatchOnboarding.current) {
+        onHideOnboarding();
+        return;
+      }
     }
-    if (user?.keyStorageType) {
+    if (user?.keyStorageType && !passkeyDomainMismatch && !pendingMismatchOnboarding.current) {
       onHideOnboarding();
       return;
     }
@@ -7058,6 +7237,15 @@ function OnboardingChecker({
       onHideOnboarding();
       return;
     }
+    if (pendingMismatchOnboarding.current) {
+      pendingMismatchOnboarding.current = false;
+      onShowOnboarding();
+      return;
+    }
+    if (passkeyDomainMismatch) {
+      onShowOnboarding();
+      return;
+    }
     if (user && enforceSelection) {
       if (!keyStorageType) {
         console.error(