@rhinestone/deposit-modal 0.1.7 → 0.1.9

package/dist/index.cjs

@@ -1058,12 +1058,16 @@ function createDepositService(baseUrl) {
       }
       return { tokens: [], totalUsd: 0 };
     },
-    async fetchStatus(address) {
-      const response = await fetch(apiUrl(`/status/${address}`), {
-        method: "GET",
-        headers: { "Content-Type": "application/json" },
-        cache: "no-store"
-      });
+    async fetchStatus(address, txHash) {
+      const txHashParam = encodeURIComponent(txHash.toLowerCase());
+      const response = await fetch(
+        apiUrl(`/status/${address}?txHash=${txHashParam}`),
+        {
+          method: "GET",
+          headers: { "Content-Type": "application/json" },
+          cache: "no-store"
+        }
+      );
       if (!response.ok) {
         return { lastEvent: void 0 };
       }
@@ -2142,6 +2146,34 @@ var INITIAL_POLL_INTERVAL = 3e3;
 var MAX_POLL_INTERVAL = 3e4;
 var BACKOFF_MULTIPLIER = 1.5;
 var PROCESS_TIMEOUT_MS = 10 * 60 * 1e3;
+function getEventTxHash(event) {
+  if (!event?.type) return void 0;
+  if (event.type === "deposit-received") {
+    const data = event.data;
+    return typeof data?.transactionHash === "string" ? data.transactionHash : void 0;
+  }
+  if (event.type === "bridge-started" || event.type === "bridge-complete") {
+    const data = event.data;
+    const txHash = data?.source?.transactionHash;
+    return typeof txHash === "string" ? txHash : void 0;
+  }
+  if (event.type === "bridge-failed") {
+    const data = event.data;
+    const txHash = data?.deposit?.transactionHash;
+    return typeof txHash === "string" ? txHash : void 0;
+  }
+  if (event.type === "error") {
+    const data = event.data;
+    const txHash = data?.deposit?.transactionHash;
+    return typeof txHash === "string" ? txHash : void 0;
+  }
+  return void 0;
+}
+function isEventForTx(event, txHash) {
+  const eventTxHash = getEventTxHash(event);
+  if (!eventTxHash) return false;
+  return eventTxHash.toLowerCase() === txHash.toLowerCase();
+}
 function formatBridgeFailedMessage(event) {
   const eventData = event?.data ?? {};
   const code = typeof eventData.errorCode === "string" ? eventData.errorCode : void 0;
@@ -2180,6 +2212,7 @@ function ProcessingStep({
   const [elapsedSeconds, setElapsedSeconds] = (0, import_react6.useState)(0);
   const startTimeRef = (0, import_react6.useRef)(Date.now());
   const intervalRef = (0, import_react6.useRef)(null);
+  const processTriggerKeyRef = (0, import_react6.useRef)(null);
   const sameChainAndToken = targetChain === sourceChain && targetToken.toLowerCase() === sourceToken.toLowerCase();
   (0, import_react6.useEffect)(() => {
     startTimeRef.current = Date.now();
@@ -2199,13 +2232,21 @@ function ProcessingStep({
     }
   }, [state.type]);
   (0, import_react6.useEffect)(() => {
+    const triggerKey = `${smartAccount.toLowerCase()}:${txHash.toLowerCase()}`;
+    if (processTriggerKeyRef.current === triggerKey) {
+      return;
+    }
+    processTriggerKeyRef.current = triggerKey;
+    let cancelled = false;
     async function triggerProcess() {
       if (!publicClient) {
+        if (cancelled) return;
         setState({ type: "error", message: "No client for source chain" });
         return;
       }
       if (!sender) {
         const message = "Wallet address unavailable";
+        if (cancelled) return;
         setState({ type: "error", message });
         onError?.(message, "PROCESS_ERROR");
         return;
@@ -2214,6 +2255,7 @@ function ProcessingStep({
         await publicClient.waitForTransactionReceipt({ hash: txHash });
       } catch (error) {
         const message = error instanceof Error ? error.message : "Transaction not confirmed";
+        if (cancelled) return;
         setState({ type: "error", message });
         onError?.(message, "PROCESS_ERROR");
         return;
@@ -2226,6 +2268,7 @@ function ProcessingStep({
           txHash,
           sender
         });
+        if (cancelled) return;
         if (result.message.includes("Funds are already on the target chain")) {
           if (sameChainAndToken) {
             setState({ type: "complete" });
@@ -2242,11 +2285,15 @@ function ProcessingStep({
         setState({ type: "processing" });
       } catch (error) {
         const message = error instanceof Error ? error.message : "Process failed";
+        if (cancelled) return;
         setState({ type: "processing", warning: message });
         onError?.(message, "PROCESS_FALLBACK");
       }
     }
     triggerProcess();
+    return () => {
+      cancelled = true;
+    };
   }, [
     smartAccount,
     txHash,
@@ -2272,38 +2319,48 @@ function ProcessingStep({
     let isMounted = true;
     async function pollStatus() {
       try {
-        const data = await service.fetchStatus(smartAccount);
+        const data = await service.fetchStatus(smartAccount, txHash);
         const lastEvent2 = data.lastEvent;
+        const eventMatchesTx = isEventForTx(lastEvent2, txHash);
+        const eventForCurrentTx = eventMatchesTx ? lastEvent2 : void 0;
         if (!isMounted) return;
-        if (lastEvent2?.type === "bridge-complete") {
-          setState({ type: "complete", lastEvent: lastEvent2 });
-          const destinationTxHash2 = lastEvent2.data?.destination?.transactionHash;
+        if (eventForCurrentTx?.type === "bridge-complete") {
+          setState({ type: "complete", lastEvent: eventForCurrentTx });
+          const destinationTxHash2 = eventForCurrentTx.data?.destination?.transactionHash;
           onDepositComplete?.(txHash, destinationTxHash2);
           return;
         }
-        if (!waitForFinalTx && lastEvent2?.type === "bridge-started") {
-          setState({ type: "complete", lastEvent: lastEvent2 });
+        if (!waitForFinalTx && eventForCurrentTx?.type === "bridge-started") {
+          setState({ type: "complete", lastEvent: eventForCurrentTx });
           onDepositComplete?.(txHash);
           return;
         }
-        if (lastEvent2?.type === "deposit-received" && sameChainAndToken) {
-          setState({ type: "complete", lastEvent: lastEvent2 });
+        if (eventForCurrentTx?.type === "deposit-received" && sameChainAndToken) {
+          setState({ type: "complete", lastEvent: eventForCurrentTx });
           onDepositComplete?.(txHash);
           return;
         }
-        if (lastEvent2?.type === "bridge-failed") {
-          const formatted = formatBridgeFailedMessage(lastEvent2);
-          setState({ type: "failed", message: formatted.message, lastEvent: lastEvent2 });
+        if (eventForCurrentTx?.type === "bridge-failed") {
+          const formatted = formatBridgeFailedMessage(eventForCurrentTx);
+          setState({
+            type: "failed",
+            message: formatted.message,
+            lastEvent: eventForCurrentTx
+          });
           onDepositFailed?.(txHash, formatted.message);
           return;
         }
-        if (lastEvent2?.type === "error") {
-          const errorMessage = lastEvent2.data?.message ?? "Unknown error";
-          setState({ type: "failed", message: errorMessage, lastEvent: lastEvent2 });
+        if (eventForCurrentTx?.type === "error") {
+          const errorMessage = eventForCurrentTx.data?.message ?? "Unknown error";
+          setState({
+            type: "failed",
+            message: errorMessage,
+            lastEvent: eventForCurrentTx
+          });
           onDepositFailed?.(txHash, errorMessage);
           return;
         }
-        setState({ type: "processing", lastEvent: lastEvent2 });
+        setState({ type: "processing", lastEvent: eventForCurrentTx });
         scheduleNextPoll();
       } catch {
         scheduleNextPoll();

package/dist/index.mjs

@@ -1020,12 +1020,16 @@ function createDepositService(baseUrl) {
       }
       return { tokens: [], totalUsd: 0 };
     },
-    async fetchStatus(address) {
-      const response = await fetch(apiUrl(`/status/${address}`), {
-        method: "GET",
-        headers: { "Content-Type": "application/json" },
-        cache: "no-store"
-      });
+    async fetchStatus(address, txHash) {
+      const txHashParam = encodeURIComponent(txHash.toLowerCase());
+      const response = await fetch(
+        apiUrl(`/status/${address}?txHash=${txHashParam}`),
+        {
+          method: "GET",
+          headers: { "Content-Type": "application/json" },
+          cache: "no-store"
+        }
+      );
       if (!response.ok) {
         return { lastEvent: void 0 };
       }
@@ -2104,6 +2108,34 @@ var INITIAL_POLL_INTERVAL = 3e3;
 var MAX_POLL_INTERVAL = 3e4;
 var BACKOFF_MULTIPLIER = 1.5;
 var PROCESS_TIMEOUT_MS = 10 * 60 * 1e3;
+function getEventTxHash(event) {
+  if (!event?.type) return void 0;
+  if (event.type === "deposit-received") {
+    const data = event.data;
+    return typeof data?.transactionHash === "string" ? data.transactionHash : void 0;
+  }
+  if (event.type === "bridge-started" || event.type === "bridge-complete") {
+    const data = event.data;
+    const txHash = data?.source?.transactionHash;
+    return typeof txHash === "string" ? txHash : void 0;
+  }
+  if (event.type === "bridge-failed") {
+    const data = event.data;
+    const txHash = data?.deposit?.transactionHash;
+    return typeof txHash === "string" ? txHash : void 0;
+  }
+  if (event.type === "error") {
+    const data = event.data;
+    const txHash = data?.deposit?.transactionHash;
+    return typeof txHash === "string" ? txHash : void 0;
+  }
+  return void 0;
+}
+function isEventForTx(event, txHash) {
+  const eventTxHash = getEventTxHash(event);
+  if (!eventTxHash) return false;
+  return eventTxHash.toLowerCase() === txHash.toLowerCase();
+}
 function formatBridgeFailedMessage(event) {
   const eventData = event?.data ?? {};
   const code = typeof eventData.errorCode === "string" ? eventData.errorCode : void 0;
@@ -2142,6 +2174,7 @@ function ProcessingStep({
   const [elapsedSeconds, setElapsedSeconds] = useState5(0);
   const startTimeRef = useRef4(Date.now());
   const intervalRef = useRef4(null);
+  const processTriggerKeyRef = useRef4(null);
   const sameChainAndToken = targetChain === sourceChain && targetToken.toLowerCase() === sourceToken.toLowerCase();
   useEffect5(() => {
     startTimeRef.current = Date.now();
@@ -2161,13 +2194,21 @@ function ProcessingStep({
     }
   }, [state.type]);
   useEffect5(() => {
+    const triggerKey = `${smartAccount.toLowerCase()}:${txHash.toLowerCase()}`;
+    if (processTriggerKeyRef.current === triggerKey) {
+      return;
+    }
+    processTriggerKeyRef.current = triggerKey;
+    let cancelled = false;
     async function triggerProcess() {
       if (!publicClient) {
+        if (cancelled) return;
         setState({ type: "error", message: "No client for source chain" });
         return;
       }
       if (!sender) {
         const message = "Wallet address unavailable";
+        if (cancelled) return;
         setState({ type: "error", message });
         onError?.(message, "PROCESS_ERROR");
         return;
@@ -2176,6 +2217,7 @@ function ProcessingStep({
         await publicClient.waitForTransactionReceipt({ hash: txHash });
       } catch (error) {
         const message = error instanceof Error ? error.message : "Transaction not confirmed";
+        if (cancelled) return;
         setState({ type: "error", message });
         onError?.(message, "PROCESS_ERROR");
         return;
@@ -2188,6 +2230,7 @@ function ProcessingStep({
           txHash,
           sender
         });
+        if (cancelled) return;
         if (result.message.includes("Funds are already on the target chain")) {
           if (sameChainAndToken) {
             setState({ type: "complete" });
@@ -2204,11 +2247,15 @@ function ProcessingStep({
         setState({ type: "processing" });
       } catch (error) {
         const message = error instanceof Error ? error.message : "Process failed";
+        if (cancelled) return;
         setState({ type: "processing", warning: message });
         onError?.(message, "PROCESS_FALLBACK");
       }
     }
     triggerProcess();
+    return () => {
+      cancelled = true;
+    };
   }, [
     smartAccount,
     txHash,
@@ -2234,38 +2281,48 @@ function ProcessingStep({
     let isMounted = true;
     async function pollStatus() {
       try {
-        const data = await service.fetchStatus(smartAccount);
+        const data = await service.fetchStatus(smartAccount, txHash);
         const lastEvent2 = data.lastEvent;
+        const eventMatchesTx = isEventForTx(lastEvent2, txHash);
+        const eventForCurrentTx = eventMatchesTx ? lastEvent2 : void 0;
         if (!isMounted) return;
-        if (lastEvent2?.type === "bridge-complete") {
-          setState({ type: "complete", lastEvent: lastEvent2 });
-          const destinationTxHash2 = lastEvent2.data?.destination?.transactionHash;
+        if (eventForCurrentTx?.type === "bridge-complete") {
+          setState({ type: "complete", lastEvent: eventForCurrentTx });
+          const destinationTxHash2 = eventForCurrentTx.data?.destination?.transactionHash;
           onDepositComplete?.(txHash, destinationTxHash2);
           return;
         }
-        if (!waitForFinalTx && lastEvent2?.type === "bridge-started") {
-          setState({ type: "complete", lastEvent: lastEvent2 });
+        if (!waitForFinalTx && eventForCurrentTx?.type === "bridge-started") {
+          setState({ type: "complete", lastEvent: eventForCurrentTx });
           onDepositComplete?.(txHash);
           return;
         }
-        if (lastEvent2?.type === "deposit-received" && sameChainAndToken) {
-          setState({ type: "complete", lastEvent: lastEvent2 });
+        if (eventForCurrentTx?.type === "deposit-received" && sameChainAndToken) {
+          setState({ type: "complete", lastEvent: eventForCurrentTx });
           onDepositComplete?.(txHash);
           return;
         }
-        if (lastEvent2?.type === "bridge-failed") {
-          const formatted = formatBridgeFailedMessage(lastEvent2);
-          setState({ type: "failed", message: formatted.message, lastEvent: lastEvent2 });
+        if (eventForCurrentTx?.type === "bridge-failed") {
+          const formatted = formatBridgeFailedMessage(eventForCurrentTx);
+          setState({
+            type: "failed",
+            message: formatted.message,
+            lastEvent: eventForCurrentTx
+          });
           onDepositFailed?.(txHash, formatted.message);
           return;
         }
-        if (lastEvent2?.type === "error") {
-          const errorMessage = lastEvent2.data?.message ?? "Unknown error";
-          setState({ type: "failed", message: errorMessage, lastEvent: lastEvent2 });
+        if (eventForCurrentTx?.type === "error") {
+          const errorMessage = eventForCurrentTx.data?.message ?? "Unknown error";
+          setState({
+            type: "failed",
+            message: errorMessage,
+            lastEvent: eventForCurrentTx
+          });
           onDepositFailed?.(txHash, errorMessage);
           return;
         }
-        setState({ type: "processing", lastEvent: lastEvent2 });
+        setState({ type: "processing", lastEvent: eventForCurrentTx });
         scheduleNextPoll();
       } catch {
         scheduleNextPoll();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rhinestone/deposit-modal",
-  "version": "0.1.7",
+  "version": "0.1.9",
   "description": "React modal component for Rhinestone cross-chain deposits",
   "author": "Rhinestone <dev@rhinestone.wtf>",
   "bugs": {