@rhinestone/deposit-modal 0.20.1 → 0.21.0

package/dist/{chunk-FW7ZMXQS.mjs → chunk-B2LUWNFX.mjs}

@@ -59,6 +59,7 @@ import {
   getExchangeLogoSrc,
   getPublicClient,
   hasReached,
+  hostedOrderState,
   hostedOrderStateFromSwapped,
   isDepositEvent,
   isDepositPolicyRefusal,
@@ -97,7 +98,7 @@ import {
   useTokenDisplay,
   useTokenDisplays,
   warnRemovedProps
-} from "./chunk-OZPMRTW3.mjs";
+} from "./chunk-UNXUOV3F.mjs";
 import {
   AppleIcon,
   BankIcon,
@@ -118,6 +119,12 @@ import {
   WalletIcon,
   useLatestRef
 } from "./chunk-YY4ZOAH5.mjs";
+import {
+  rampQuery
+} from "./chunk-PP4QE32S.mjs";
+import {
+  createBearerTransport
+} from "./chunk-PZIKRYMO.mjs";
 import {
   HYPERCORE_CHAIN_ID,
   HYPERCORE_MIN_DEPOSIT_USD,
@@ -169,7 +176,7 @@ function getReownDependencies() {
 
 // src/DepositModal.tsx
 import {
-  useMemo as useMemo9,
+  useMemo as useMemo10,
   useEffect as useEffect15,
   useRef as useRef11,
   useState as useState15,
@@ -4185,7 +4192,7 @@ SwappedProviderStep.displayName = "SwappedProviderStep";
 // src/components/steps/RampOrderStep.tsx
 import { jsx as jsx18 } from "react/jsx-runtime";
 var BankOnrampStep = lazy2(async () => {
-  const module = await import("./BankOnrampStep-4D24HVHV.mjs");
+  const module = await import("./BankOnrampStep-JTU7WS5R.mjs");
   return { default: module.BankOnrampStep };
 });
 var HOSTED = {
@@ -4210,7 +4217,7 @@ function RampOrderStep(props) {
       {
         backendUrl: order.backendUrl,
         smartAccount,
-        bankOnramp: order.bankOnramp,
+        getCustomerSession: order.getCustomerSession,
         onJourney: order.onJourney,
         onGoBack: props.onGoBack,
         onError: props.onError,
@@ -4274,6 +4281,47 @@ function HostedOrder({
 }
 RampOrderStep.displayName = "RampOrderStep";
 
+// src/core/ramp-rows.ts
+var NOT_SERVED_NOTICE = "Bank transfer isn't available in your region.";
+function resolveRampRows(input) {
+  const { providers } = input;
+  const has = (provider, kind) => providers === null || providers !== "loading" && providers.some((p) => p.provider === provider && p.kinds.includes(kind));
+  const loading = providers === "loading";
+  const exchange = !input.enableExchangeConnect ? "hidden" : loading ? "loading" : has("swapped", "exchange") ? "offered" : "hidden";
+  const bankRequested = input.virtualAccounts && input.customerSession && input.bankTransferAllowed;
+  const swappedFiat = has("swapped", "fiat");
+  const bankBy = !bankRequested ? null : has("noah", "fiat") && !input.noahNotServed ? "noah" : swappedFiat && !refusesBank(input.swappedMethods) ? "swapped" : null;
+  const notice = bankRequested && input.noahNotServed && !bankBy ? NOT_SERVED_NOTICE : null;
+  const offered = input.enableFiatOnramp && swappedFiat ? input.swappedMethods : { kind: "hidden" };
+  const swapped = offered.kind === "hidden" && bankBy ? {
+    kind: "list",
+    methods: [],
+    recommendedMethod: input.bankRow.method,
+    country: null,
+    source: "configured"
+  } : offered;
+  if (loading && (input.enableFiatOnramp || bankRequested)) {
+    return { cash: { kind: "loading" }, exchange, notice: null };
+  }
+  if (swapped.kind !== "list") return { cash: swapped, exchange, notice };
+  const methods = swapped.methods.map((m) => ({
+    ...m,
+    provider: isBankRow(m) && bankBy ? bankBy : "swapped"
+  }));
+  if (bankBy && !methods.some(isBankRow)) {
+    methods.push({ ...input.bankRow, provider: bankBy });
+  }
+  return { cash: { ...swapped, methods }, exchange, notice };
+}
+function refusesBank(swapped) {
+  if (swapped.kind === "hidden") return true;
+  if (swapped.kind !== "list" || swapped.source === "fallback") return false;
+  return !swapped.methods.some(isBankRow);
+}
+function isBankRow(m) {
+  return m.method === "bank-transfer";
+}
+
 // src/components/steps/ExchangeSelectStep.tsx
 import { useCallback as useCallback4, useEffect as useEffect9, useState as useState9 } from "react";
 import { jsx as jsx19, jsxs as jsxs16 } from "react/jsx-runtime";
@@ -6117,6 +6165,7 @@ function analyticsStepForFlowStep(method, step) {
 }
 var BANK_FAILURES = {
   BANK_ONRAMP_OPTIONS_FAILED: "bank_options_failed",
+  BANK_ONRAMP_SESSION_REFUSED: "bank_session_refused",
   BANK_ONRAMP_SETUP_FAILED: "bank_setup_failed",
   BANK_ONRAMP_DETAILS_FAILED: "bank_details_failed",
   BANK_ONRAMP_DETAILS_PENDING: "bank_details_pending"
@@ -7663,7 +7712,8 @@ function DepositFlow({
   initialAssetMigration,
   enableWallet = true,
   enableFiatOnramp = false,
-  bankOnramp,
+  virtualAccountOnramp,
+  getCustomerSession,
   onBankJourney,
   backendUrl,
   enableQrTransfer = true,
@@ -7720,7 +7770,7 @@ function DepositFlow({
     [debug]
   );
   const bankOnrampEnabled = Boolean(
-    bankOnramp && (fiatMethods === void 0 || fiatMethods["bank-transfer"] === true)
+    virtualAccountOnramp && getCustomerSession && (fiatMethods === void 0 || fiatMethods["bank-transfer"] === true)
   );
   const hasSwappedFiatMethod = Boolean(
     enableFiatOnramp && (!fiatMethods || Object.entries(fiatMethods).some(
@@ -8692,11 +8742,6 @@ function DepositFlow({
       clearTimeout(timer);
     };
   }, [bankOnrampEnabled, enableExchangeConnect, enableFiatOnramp, service]);
-  const providersLoading = providers === "loading";
-  const offers = (provider, kind) => providers === null || providers !== "loading" && providers.some((p) => p.provider === provider && p.kinds.includes(kind));
-  const swappedFiatOffered = offers("swapped", "fiat");
-  const noahOffered = offers("noah", "fiat");
-  const exchangeOffered = enableExchangeConnect && offers("swapped", "exchange");
   const [regionalMethods, setRegionalMethods] = useState13({
     status: "loading",
     country: null,
@@ -8743,57 +8788,51 @@ function DepositFlow({
       clearTimeout(timeoutTimer);
     };
   }, [analytics, enableFiatOnramp, hasConfiguredFiatMethods, service]);
-  const swappedCashDisplay = useMemo8(
-    () => !enableFiatOnramp || !swappedFiatOffered ? { kind: "hidden" } : hasConfiguredFiatMethods ? {
+  const swappedMethods = useMemo8(
+    () => hasConfiguredFiatMethods ? {
       kind: "list",
       methods: configuredFiatMethods,
       recommendedMethod: configuredFiatMethods[0]?.method ?? "bank-transfer",
       country: null,
       source: "configured"
     } : composeFiatMethods(regionalMethods, FIAT_ONRAMP_METHODS),
+    [configuredFiatMethods, hasConfiguredFiatMethods, regionalMethods]
+  );
+  const [noahNotServedFor, setNoahNotServedFor] = useState13(null);
+  const noahNotServed = noahNotServedFor !== null && noahNotServedFor === setupSlice.smartAccount?.toLowerCase();
+  const rampRowInputs = useMemo8(
+    () => ({
+      enableFiatOnramp,
+      virtualAccounts: Boolean(virtualAccountOnramp),
+      customerSession: Boolean(getCustomerSession),
+      bankTransferAllowed: fiatMethods === void 0 || fiatMethods["bank-transfer"] === true,
+      enableExchangeConnect,
+      providers,
+      swappedMethods,
+      bankRow: FIAT_ONRAMP_METHODS.find(({ method }) => method === "bank-transfer"),
+      noahNotServed
+    }),
     [
-      configuredFiatMethods,
+      enableExchangeConnect,
       enableFiatOnramp,
-      hasConfiguredFiatMethods,
-      regionalMethods,
-      swappedFiatOffered
+      fiatMethods,
+      getCustomerSession,
+      noahNotServed,
+      providers,
+      swappedMethods,
+      virtualAccountOnramp
     ]
   );
-  const swappedOffersBank = swappedCashDisplay.kind === "list" && swappedCashDisplay.methods.some(({ method }) => method === "bank-transfer");
-  const [bankOnrampUnavailable, setBankOnrampUnavailable] = useState13(false);
-  const bankRowOffered = bankOnrampEnabled && noahOffered && !bankOnrampUnavailable;
-  const swappedRefusesBank = hasConfiguredFiatMethods ? !configuredFiatMethods.some(({ method }) => method === "bank-transfer") : regionalMethods.status === "ready" && regionalMethods.country !== null && !regionalMethods.methods.some(({ method }) => method === "bank-transfer");
-  const handleBankOnrampUnavailable = useCallback6(() => {
-    setBankOnrampUnavailable(true);
-    if (swappedRefusesBank) handleProviderBack();
-  }, [handleProviderBack, swappedRefusesBank]);
-  const cashDisplay = useMemo8(() => {
-    if (providersLoading && fiatEnabled) return { kind: "loading" };
-    const swappedDisplay = swappedCashDisplay;
-    if (!bankRowOffered || swappedDisplay.kind === "loading") {
-      return swappedDisplay;
-    }
-    const asNoah = (m) => m.method === "bank-transfer" ? { ...m, provider: "noah" } : m;
-    if (swappedOffersBank && swappedDisplay.kind === "list") {
-      return { ...swappedDisplay, methods: swappedDisplay.methods.map(asNoah) };
-    }
-    const bankTransfer = asNoah(
-      FIAT_ONRAMP_METHODS.find(({ method }) => method === "bank-transfer")
-    );
-    return {
-      kind: "list",
-      methods: swappedDisplay.kind === "list" ? [...swappedDisplay.methods, bankTransfer] : [bankTransfer],
-      recommendedMethod: swappedDisplay.kind === "list" ? swappedDisplay.recommendedMethod : bankTransfer.method,
-      country: swappedDisplay.kind === "list" ? swappedDisplay.country : null,
-      source: swappedDisplay.kind === "list" ? swappedDisplay.source : "configured"
-    };
-  }, [
-    bankRowOffered,
-    fiatEnabled,
-    providersLoading,
-    swappedCashDisplay,
-    swappedOffersBank
-  ]);
+  const rampRows = useMemo8(() => resolveRampRows(rampRowInputs), [rampRowInputs]);
+  const cashDisplay = rampRows.cash;
+  const handleNoahNotServed = useCallback6(
+    (smartAccount) => {
+      setNoahNotServedFor(smartAccount.toLowerCase());
+      const after = resolveRampRows({ ...rampRowInputs, noahNotServed: true });
+      if (after.notice) handleProviderBack();
+    },
+    [handleProviderBack, rampRowInputs]
+  );
   useEffect13(() => {
     if (cashDisplay.kind === "hidden" && fiatEnabled) {
       analytics.friction(
@@ -9354,12 +9393,12 @@ function DepositFlow({
         ),
         fiatPaymentMethods: cashDisplay.kind === "list" ? cashDisplay.methods : void 0,
         fiatLoading: cashDisplay.kind === "loading",
-        fiatNotice: bankOnrampUnavailable && swappedRefusesBank ? "Bank transfer isn't available in your region." : void 0,
+        fiatNotice: rampRows.notice ?? void 0,
         recommendedMethod: cashDisplay.kind === "list" ? cashDisplay.recommendedMethod : void 0,
         onSelectFiatMethod: cashDisplay.kind === "list" ? handleSelectDisplayedFiatMethod : void 0,
         onPrefetchFiatMethod: cashDisplay.kind === "list" ? handlePrefetchDisplayedFiatMethod : void 0,
-        onSelectFundFromExchange: exchangeOffered || enableExchangeConnect && providersLoading ? () => handleSelectExchange() : void 0,
-        fundFromExchangeLoading: enableExchangeConnect && providersLoading,
+        onSelectFundFromExchange: rampRows.exchange === "hidden" ? void 0 : () => handleSelectExchange(),
+        fundFromExchangeLoading: rampRows.exchange === "loading",
         onRequestConnect: enableWallet ? onRequestConnect : void 0,
         onConnect: enableWallet ? onConnect : void 0,
         onDisconnect,
@@ -9510,12 +9549,12 @@ function DepositFlow({
             {
               ...rampCallbacks,
               smartAccount: step.smartAccount,
-              order: step.provider === "noah" && bankRowOffered && bankOnramp ? {
+              order: step.provider === "noah" && !noahNotServed && getCustomerSession ? {
                 flow: "funding_account",
                 backendUrl,
-                bankOnramp,
+                getCustomerSession,
                 onJourney: onBankJourney,
-                onUnavailable: handleBankOnrampUnavailable
+                onUnavailable: () => handleNoahNotServed(step.smartAccount)
               } : {
                 flow: "hosted",
                 kind: "fiat",
@@ -9964,9 +10003,9 @@ function DepositFlow({
   ] });
 }
 
-// src/components/history/useBankHistory.ts
-import { useCallback as useCallback7, useEffect as useEffect14, useRef as useRef10, useState as useState14 } from "react";
-function useBankHistory(source, open, panelOpen) {
+// src/components/history/useOrderHistory.ts
+import { useCallback as useCallback7, useEffect as useEffect14, useMemo as useMemo9, useRef as useRef10, useState as useState14 } from "react";
+function useOrderHistory(source, open, panelOpen) {
   const [orders, setOrders] = useState14([]);
   const [unread, setUnread] = useState14(false);
   const [loading, setLoading] = useState14(false);
@@ -9992,9 +10031,11 @@ function useBankHistory(source, open, panelOpen) {
           ...next ? { cursor: next } : {}
         });
         if (current !== generation.current) return;
-        const bank = page.items.filter((order) => order.provider === "noah");
+        const listed = page.items.filter(
+          (order) => order.provider === "noah" || hostedOrderState(order).progress !== "awaiting_payment"
+        );
         let changed = false;
-        for (const order of bank) {
+        for (const order of listed) {
           const fingerprint = JSON.stringify(order.stages);
           if (!next && seen.current.get(order.id) !== fingerprint)
             changed = true;
@@ -10004,7 +10045,7 @@ function useBankHistory(source, open, panelOpen) {
         if (!next) baselined.current = true;
         setOrders((previous) => {
           const merged = new Map(previous.map((order) => [order.id, order]));
-          for (const order of bank) merged.set(order.id, order);
+          for (const order of listed) merged.set(order.id, order);
           return [...merged.values()].sort(
             (a, b) => b.createdAt.localeCompare(a.createdAt)
           );
@@ -10014,7 +10055,7 @@ function useBankHistory(source, open, panelOpen) {
         setError(null);
       } catch {
         if (current === generation.current)
-          setError("Bank transfer history is unavailable. Try again shortly.");
+          setError("Order history is unavailable. Try again shortly.");
       } finally {
         if (current === generation.current) {
           busy.current = false;
@@ -10067,12 +10108,53 @@ function useBankHistory(source, open, panelOpen) {
     }
   };
 }
+function useSessionOrders(backendUrl, getCustomerSession, smartAccount) {
+  const getSession = useLatestRef(getCustomerSession);
+  const enabled = Boolean(getCustomerSession);
+  return useMemo9(() => {
+    if (!enabled || !smartAccount) return null;
+    return {
+      listOrders: async ({ cursor, limit }) => {
+        let refused = false;
+        const request = createBearerTransport({
+          backendUrl,
+          getSession: async () => {
+            try {
+              return await getSession.current(smartAccount, {
+                resumeOnly: true
+              });
+            } catch (error) {
+              refused = true;
+              throw error;
+            }
+          }
+        });
+        try {
+          return await request(
+            `/onramp/orders?${rampQuery({ cursor, limit })}`
+          );
+        } catch (error) {
+          if (refused) return { items: [], nextCursor: null };
+          throw error;
+        }
+      }
+    };
+  }, [backendUrl, enabled, smartAccount, getSession]);
+}
 
 // src/DepositModal.tsx
 import { jsx as jsx28, jsxs as jsxs24 } from "react/jsx-runtime";
+var warnedNoCustomerSession = false;
+function warnNoCustomerSession() {
+  if (warnedNoCustomerSession) return;
+  warnedNoCustomerSession = true;
+  console.warn(
+    "[rhinestone] `virtualAccountOnramp` needs `getCustomerSession`; it is ignored without one."
+  );
+}
 var ReownDepositInner = lazy4(async () => {
   await loadReownDependencies();
-  const module = await import("./DepositModalReown-SYQ2SCHC.mjs");
+  const module = await import("./DepositModalReown-FJBSF4VL.mjs");
   return { default: module.DepositModalReown };
 });
 function buildDepositAnalyticsSessionProperties({
@@ -10131,6 +10213,7 @@ function hasSuppliedWalletClient(props) {
 }
 function DepositModal(props) {
   warnRemovedProps("DepositModal", props);
+  if (props.virtualAccountOnramp && !props.getCustomerSession) warnNoCustomerSession();
   checkBackendUrl("DepositModal", props.backendUrl);
   const needsReown = !!props.reownAppId;
   const hasWalletClientProp = hasSuppliedWalletClient(props);
@@ -10174,7 +10257,8 @@ function DepositModalInner({
   assetMigrations,
   initialAssetMigration,
   enableFiatOnramp = false,
-  bankOnramp,
+  virtualAccountOnramp,
+  getCustomerSession,
   enableQrTransfer = true,
   enableGaslessDeposit = false,
   fiatMethods,
@@ -10208,22 +10292,10 @@ function DepositModalInner({
   const onReadyRef = useLatestRef(onReady);
   const onUiStateRef = useLatestRef(onUiState);
   const [currentScreen, setCurrentScreen] = useState15("connect");
-  const bankScope = `${backendUrl}:${recipient}:${typeof targetChainProp === "string" ? targetChainProp : getChainId(targetChainProp)}:${targetToken}`;
-  const [bankSession, setBankSession] = useState15(null);
   const [bankJourneyVisible, setBankJourneyVisible] = useState15(false);
-  const onBankJourney = useCallback8((journey) => {
-    setBankJourneyVisible(Boolean(journey));
-    if (journey)
-      setBankSession(
-        journey.source ? { source: journey.source, scope: bankScope } : null
-      );
-  }, [bankScope]);
-  const bankSource = bankSession?.scope === bankScope ? bankSession.source : null;
+  const [smartAccount, setSmartAccount] = useState15(null);
   useEffect15(() => {
-    if (!isOpen) {
-      setBankSession(null);
-      setBankJourneyVisible(false);
-    }
+    if (!isOpen) setBankJourneyVisible(false);
   }, [isOpen]);
   const [swappedImmersive, setSwappedImmersive] = useState15(false);
   const [submitting, setSubmitting] = useState15(false);
@@ -10238,15 +10310,21 @@ function DepositModalInner({
   }));
   const targetChain = typeof targetChainProp === "string" ? targetChainProp : getChainId(targetChainProp);
   const sourceChain = sourceChainProp ? getChainId(sourceChainProp) : void 0;
+  const accountScope = `${isOpen}|${backendUrl}|${recipient}|${targetChain}|${targetToken}`;
+  const [scope, setScope] = useState15(accountScope);
+  if (scope !== accountScope) {
+    setScope(accountScope);
+    setSmartAccount(null);
+  }
   const rpcUrls = useStableRpcUrls(rpcUrlsProp);
-  const service = useMemo9(
+  const service = useMemo10(
     () => createDepositService(backendUrl, {
       debug,
       debugScope: "service:deposit"
     }),
     [backendUrl, debug]
   );
-  const historyAnalytics = useMemo9(
+  const historyAnalytics = useMemo10(
     () => createHistoryAnalytics({
       modal: "deposit",
       controllerRef: analyticsControllerRef,
@@ -10261,18 +10339,21 @@ function DepositModalInner({
     canRecover: Boolean(signRecovery),
     analytics: historyAnalytics
   });
-  const bankOrders = useBankHistory(bankSource, isOpen && !payment, history.isPanelOpen);
-  const bankHistory = bankJourneyVisible && !bankSource ? { ...bankOrders, loading: true } : bankOrders;
+  const orderHistory = useOrderHistory(
+    useSessionOrders(backendUrl, getCustomerSession, smartAccount),
+    isOpen && !payment,
+    history.isPanelOpen
+  );
   const historyDepositsRef = useLatestRef(history.deposits);
   useEffect15(() => {
-    const waitingForSettlement = bankHistory.orders.some((order) => {
+    const waitingForSettlement = orderHistory.orders.some((order) => {
       if (order.stages.delivery.status !== "completed") return false;
       const { depositId } = order.stages.delivery;
       const deposit = historyDepositsRef.current.find((item) => item.id === depositId);
       return !deposit || deposit.status === "pending" || deposit.status === "processing";
     });
     if (waitingForSettlement) history.markStale();
-  }, [bankHistory.orders, history.markStale, historyDepositsRef]);
+  }, [orderHistory.orders, history.markStale, historyDepositsRef]);
   const {
     markStale: markHistoryStale,
     invalidate: invalidateHistory,
@@ -10296,7 +10377,7 @@ function DepositModalInner({
       console.debug("[deposit] client setup config (not shown yet)", clientSetup);
     }
   }, [debug, clientSetup]);
-  const store = useMemo9(
+  const store = useMemo10(
     () => createDepositStore({ targetChain, targetToken }),
     // eslint-disable-next-line react-hooks/exhaustive-deps
     []
@@ -10339,8 +10420,9 @@ function DepositModalInner({
   const handleLifecycle = useCallback8(
     (event) => {
       onLifecycleRef.current?.(event);
-      if (event.type === "smart-account-changed" && !event.evm && !event.solana) {
-        invalidateHistory();
+      if (event.type === "smart-account-changed") {
+        setSmartAccount(event.evm);
+        if (!event.evm && !event.solana) invalidateHistory();
       }
       if (event.type === "submitted" || event.type === "complete" || event.type === "failed") {
         markHistoryStale();
@@ -10404,7 +10486,7 @@ function DepositModalInner({
     sourceToken,
     defaultAmount,
     bankOnrampEnabled: Boolean(
-      bankOnramp && (fiatMethods === void 0 || fiatMethods["bank-transfer"] === true)
+      virtualAccountOnramp && getCustomerSession && (fiatMethods === void 0 || fiatMethods["bank-transfer"] === true)
     ),
     walletIntegration,
     targetChain,
@@ -10454,7 +10536,7 @@ function DepositModalInner({
                       HistoryEntryButton,
                       {
                         badge: bankJourneyVisible ? null : history.badge,
-                        unread: bankHistory.unread,
+                        unread: orderHistory.unread,
                         onClick: history.openPanel,
                         disabled: !recipient
                       }
@@ -10492,8 +10574,9 @@ function DepositModalInner({
                     assetMigrations,
                     initialAssetMigration,
                     enableFiatOnramp,
-                    bankOnramp,
-                    onBankJourney,
+                    virtualAccountOnramp,
+                    getCustomerSession,
+                    onBankJourney: setBankJourneyVisible,
                     backendUrl,
                     enableQrTransfer,
                     enableGaslessDeposit,
@@ -10523,8 +10606,8 @@ function DepositModalInner({
                   HistoryOverlay,
                   {
                     controller: history,
-                    bankHistory,
-                    bankSupportUrl: bankOnramp?.supportUrl,
+                    orderHistory,
+                    bankSupportUrl: virtualAccountOnramp?.supportUrl,
                     backLabel: "Deposit",
                     recipient,
                     backendUrl,