Merge pull request #88 from argentlabs/fix/webwallet-argent-mobile

Fix/webwallet argent mobile
argentlabs · Mar 21, 2024 · bbee9e8 · bbee9e8
2 parents 646de38 + ce4548b
commit bbee9e8
Show file tree

Hide file tree

Showing 3 changed files with 28 additions and 11 deletions.
diff --git a/src/connectors/argentMobile/modal/argentModal.ts b/src/connectors/argentMobile/modal/argentModal.ts
@@ -72,7 +72,9 @@ class ArgentModal {
     const wcParam = encodeURIComponent(wcUri)
     const href = encodeURIComponent(window.location.href)
 
-    const desktopWcParam = `${this.mobileUrl}app/wc?uri=${wcParam}`
+    const desktopWcParam = encodeURIComponent(
+      `${this.mobileUrl}app/wc?uri=${wcParam}`,
+    )
 
     this.showModal({
       desktop: `${this.bridgeUrl}?wc=${desktopWcParam}&device=desktop`,

diff --git a/src/connectors/webwallet/helpers/openWebwallet.ts b/src/connectors/webwallet/helpers/openWebwallet.ts
@@ -60,17 +60,30 @@ export const openWebwallet = async (
   const { allowedDapps } = await fetchAllowedDapps(network)
 
   if (allowedDapps.includes(window.location.hostname)) {
-    const { iframe, modal } = await createModal(origin, false)
-    const windowProxyClient = trpcProxyClient({})
-    const isConnected = await windowProxyClient.authorize.mutate()
-    if (isConnected) {
-      const starknetWindowObject = await getWebWalletStarknetObject(
-        origin,
-        trpcProxyClient({ iframe: iframe.contentWindow ?? undefined }),
-        { modal, iframe },
-      )
-      return starknetWindowObject
+    const modalId = "argent-webwallet-modal"
+    const iframeId = "argent-webwallet-iframe"
+
+    const existingIframe = document.getElementById(modalId)
+    const existingModal = document.getElementById(iframeId)
+
+    // avoid duplicate iframes
+    if (existingIframe && existingIframe && existingModal) {
+      existingIframe.remove()
+      existingModal.remove()
     }
+    const { iframe, modal } = await createModal(origin, false)
+
+    const iframeTrpcProxyClient = trpcProxyClient({
+      iframe: iframe.contentWindow ?? undefined,
+    })
+    await iframeTrpcProxyClient.authorize.mutate()
+    const starknetWindowObject = await getWebWalletStarknetObject(
+      origin,
+      iframeTrpcProxyClient,
+      { modal, iframe },
+    )
+    return starknetWindowObject
+    /* } */
   } else {
     const windowProxyClient = trpcProxyClient({})
     return await getWebWalletStarknetObject(

diff --git a/src/connectors/webwallet/starknetWindowObject/wormhole.ts b/src/connectors/webwallet/starknetWindowObject/wormhole.ts
@@ -58,9 +58,11 @@ export const createModal = async (targetUrl: string, shouldShow: boolean) => {
     "allow-popups",
   )
   iframe.allow = "clipboard-write"
+  iframe.id = "argent-webwallet-iframe"
 
   const modal = applyModalStyle(iframe)
   modal.style.display = shouldShow ? "block" : "none"
+  modal.id = "argent-webwallet-modal"
 
   // append the modal to the body
   window.document.body.appendChild(modal)