@getpara/react-sdk-lite 2.0.0-alpha.66 → 2.0.0-alpha.68

package/dist/provider/providers/ExternalWalletProvider.js

@@ -5,17 +5,22 @@ import {
   __spreadValues
 } from "../../chunk-MMUBH76A.js";
 import { jsx } from "react/jsx-runtime";
-import { createContext, useCallback, useContext, useEffect, useMemo, useState } from "react";
+import { createContext, useCallback, useContext, useEffect, useMemo, useRef, useState } from "react";
 import { isMobile, truncateAddress } from "@getpara/web-sdk";
 import { useInternalClient } from "../hooks/utils/useInternalClient.js";
 import { useStore } from "../stores/useStore.js";
-import { ModalStep } from "../../modal/index.js";
+import { ModalStep, openPopup } from "../../modal/index.js";
 import { useModalStore } from "../../modal/stores/index.js";
 import { useAccount, useModal, useParaStatus, useVerifyExternalWallet, useWalletState } from "../hooks/index.js";
+import {
+  openMobileUrl
+} from "@getpara/react-common";
 import { ParaEvent, dispatchEvent } from "@getpara/web-sdk";
 import { useAuthActions } from "./AuthProvider.js";
 import { IS_FULLY_LOGGED_IN_BASE_KEY } from "../hooks/queries/useIsFullyLoggedIn.js";
 import { useQueryClient } from "@tanstack/react-query";
+import { useGoBack } from "../../modal/hooks/useGoBack.js";
+import { validatePortalOrigin } from "../../modal/utils/validatePortalOrigin.js";
 const useWalletDisplayHelpers = (wallet) => {
   const isUsingMobileConnector = useModalStore((state) => state.isUsingMobileConnector);
   return {
@@ -49,9 +54,12 @@ const defaultExternalWallet = {
   isSigningMessage: false,
   getWalletBalance: () => Promise.resolve(void 0),
   requestInfo: (_) => Promise.resolve({}),
-  disconnectBase: (_, __) => Promise.resolve(),
+  disconnectBase: (_, __, ___) => Promise.resolve(),
   connectFarcasterMiniApp: () => Promise.resolve(),
-  verificationStage: void 0
+  verificationStage: void 0,
+  evmDisconnectStatus: "idle",
+  solanaDisconnectStatus: "idle",
+  cosmosDisconnectStatus: "idle"
 };
 const ExternalWalletContext = createContext(defaultExternalWallet);
 function ExternalWalletProvider({ children }) {
@@ -81,7 +89,8 @@ function ExternalWalletProvider({ children }) {
     requestInfo: evmRequestInfo,
     disconnectBase: evmDisconnectBase,
     farcasterStatus: evmFarcasterStatus,
-    verificationStage: evmVerificationStage
+    verificationStage: evmVerificationStage,
+    disconnectStatus: evmDisconnectStatus
   } = useContext(evmContext);
   const {
     wallets: solanaWallets,
@@ -90,7 +99,8 @@ function ExternalWalletProvider({ children }) {
     signVerificationMessage: solanaSignVerificationMessage,
     requestInfo: solanaRequestInfo,
     disconnectBase: solanaDisconnectBase,
-    farcasterStatus: solanaFarcasterStatus
+    farcasterStatus: solanaFarcasterStatus,
+    disconnectStatus: solanaDisconnectStatus
   } = useContext(solanaContext);
   const {
     wallets: cosmosWallets,
@@ -102,7 +112,8 @@ function ExternalWalletProvider({ children }) {
     signMessage: cosmosSignMessage,
     signVerificationMessage: cosmosSignVerificationMessage,
     requestInfo: cosmosRequestInfo,
-    disconnectBase: cosmosDisconnectBase
+    disconnectBase: cosmosDisconnectBase,
+    disconnectStatus: cosmosDisconnectStatus
   } = useContext(cosmosContext);
   const onLoginRef = useStore((state) => state.onLoginRef);
   const setStep = useModalStore((state) => state.setStep);
@@ -119,9 +130,11 @@ function ExternalWalletProvider({ children }) {
   const { onNewAuthState } = useAuthActions();
   const { verifyExternalWalletAsync } = useVerifyExternalWallet();
   const queryClient = useQueryClient();
+  const goBack = useGoBack();
   const [qrUri, setQrUri] = useState();
   const [chainIdSwitchingTo, setChainIdSwitchingTo] = useState();
   const [isSigningMessage, setIsSigningMessage] = useState(false);
+  const popupCloseIntervalRef = useRef(null);
   const allWallets = [...evmWallets, ...solanaWallets, ...cosmosWallets];
   let wallets = allWallets.filter(
     (w) => (w.internalId !== "FARCASTER" || (para == null ? void 0 : para.isFarcasterMiniApp)) && externalWallets.includes(w.internalId)
@@ -136,20 +149,25 @@ function ExternalWalletProvider({ children }) {
     () => wallets.find((w) => w.id === (selectedExternalWallet == null ? void 0 : selectedExternalWallet.id) && w.type === (selectedExternalWallet == null ? void 0 : selectedExternalWallet.type)),
     [wallets, selectedExternalWallet]
   );
-  const updateQrUri = () => __async(this, null, function* () {
-    var _a;
-    const uri = yield (_a = wallet == null ? void 0 : wallet.getQrUri) == null ? void 0 : _a.call(wallet);
-    setQrUri(uri);
-  });
-  useEffect(() => {
-    if (wallet) {
-      if (!qrUri) {
-        updateQrUri();
-      }
-    } else if (qrUri) {
-      setQrUri(void 0);
+  const [walletConnectCleanup, setWalletConnectCleanup] = useState(null);
+  const listenForWalletConnectUri = () => {
+    setQrUri(void 0);
+    if (walletConnectCleanup) {
+      walletConnectCleanup();
     }
-  }, [wallet]);
+    const callback = (event) => {
+      openMobileUrl(event.detail);
+      setQrUri(event.detail);
+      cleanup();
+      setWalletConnectCleanup(null);
+    };
+    const cleanup = () => {
+      window.removeEventListener("PARA_WALLETCONNECT_URI_READY", callback);
+    };
+    window.addEventListener("PARA_WALLETCONNECT_URI_READY", callback);
+    setWalletConnectCleanup(() => cleanup);
+    return cleanup;
+  };
   const isWithFullAuth = (wallet2) => {
     if (connectionOnly) {
       return false;
@@ -345,7 +363,10 @@ function ExternalWalletProvider({ children }) {
     return verifyExternalWalletParams;
   }), [cosmosSignVerificationMessage, evmSignVerificationMessage, solanaSignVerificationMessage, wallet]);
   const signMessage = useCallback(
-    (_0) => __async(this, [_0], function* ({ message, externalWallet: _externalWallet }) {
+    (_0) => __async(this, [_0], function* ({
+      message,
+      externalWallet: _externalWallet
+    }) {
       var _a;
       setExternalWalletError();
       setIsSigningMessage(true);
@@ -356,14 +377,16 @@ function ExternalWalletProvider({ children }) {
         switch (walletType) {
           case "COSMOS":
             {
-              const { address, signature, error, cosmosPublicKeyHex, cosmosSigner } = yield cosmosSignMessage({
-                message,
-                externalWallet
-              });
+              const { address, signature, error, cosmosPublicKeyHex, cosmosSigner, addressBech32 } = yield cosmosSignMessage(
+                {
+                  message,
+                  externalWallet
+                }
+              );
               if (error) {
                 throw new Error(error);
               } else if (signature && address) {
-                response = { address, signature, cosmosPublicKeyHex, cosmosSigner };
+                response = { address, signature, cosmosPublicKeyHex, cosmosSigner, addressBech32 };
               }
             }
             break;
@@ -401,6 +424,7 @@ function ExternalWalletProvider({ children }) {
   );
   const addAdditionalExternalWallet = useCallback(
     (wallet2) => __async(this, null, function* () {
+      setExternalWalletError();
       try {
         const walletInfo = yield requestInfo(wallet2.id, wallet2.type);
         const walletAddress = wallet2.type === "COSMOS" && walletInfo.addressBech32 ? walletInfo.addressBech32 : walletInfo.address;
@@ -464,8 +488,198 @@ function ExternalWalletProvider({ children }) {
     }),
     [para, connectionOnly, includeWalletVerification, setStep, setExternalWalletError]
   );
+  const setupExternalWalletVerificationStatusListener = (wallet2) => {
+    typeof window !== "undefined" && window.addEventListener("message", function handleMessage(event) {
+      return __async(this, null, function* () {
+        var _a, _b, _c, _d;
+        if (!validatePortalOrigin(event, para.ctx)) {
+          return;
+        }
+        if (((_a = event.data) == null ? void 0 : _a.type) === "EW_VERIFY_SUCCESS") {
+          clearPopupWindowCloseListener();
+          const serverAuthState = (_b = event.data) == null ? void 0 : _b.serverAuthState;
+          if (serverAuthState && ((_c = serverAuthState.externalWallet) == null ? void 0 : _c.withFullParaAuth)) {
+            const authState = yield para.verifyExternalWallet({ serverAuthState });
+            yield onNewAuthState(authState);
+          } else {
+            setStep(ModalStep.LOGIN_DONE);
+          }
+          window.removeEventListener("message", handleMessage);
+        }
+        if (((_d = event.data) == null ? void 0 : _d.type) === "EW_VERIFY_RETRY") {
+          yield handleTriggerSignMessage(wallet2, event.data.message);
+          window.removeEventListener("message", handleMessage);
+        }
+      });
+    });
+  };
+  const handlePostMessage = (message) => {
+    var _a;
+    if (refs.popupWindow.current) {
+      refs.popupWindow.current.postMessage(message, "*");
+    } else if (refs.iFrame.current) {
+      (_a = refs.iFrame.current.contentWindow) == null ? void 0 : _a.postMessage(message, "*");
+    }
+  };
+  const handleTriggerSignMessage = (wallet2, message) => __async(this, null, function* () {
+    setupExternalWalletVerificationStatusListener(wallet2);
+    try {
+      const { address, signature, cosmosPublicKeyHex, cosmosSigner, addressBech32 } = yield signMessage({
+        message,
+        externalWallet: wallet2
+      });
+      const paraWallet = Object.values(para.externalWallets)[0];
+      const walletType = paraWallet == null ? void 0 : paraWallet.type;
+      let verifyExternalWalletParams;
+      const withVerification = includeWalletVerification;
+      const isConnectionOnly = connectionOnly;
+      const withFullParaAuth = (paraWallet == null ? void 0 : paraWallet.name) ? isWithFullAuth(paraWallet) : false;
+      const defaultWalletInfo = {
+        withVerification,
+        isConnectionOnly,
+        withFullParaAuth,
+        provider: paraWallet.name,
+        providerId: paraWallet.externalProviderId,
+        isExternal: true
+      };
+      switch (walletType) {
+        case "COSMOS":
+          {
+            verifyExternalWalletParams = {
+              externalWallet: __spreadValues({
+                partnerId: para.partnerId,
+                type: "COSMOS",
+                address,
+                addressBech32
+              }, defaultWalletInfo),
+              signedMessage: signature,
+              cosmosPublicKeyHex,
+              cosmosSigner
+            };
+          }
+          break;
+        case "EVM":
+          {
+            verifyExternalWalletParams = {
+              externalWallet: __spreadValues({
+                partnerId: para.partnerId,
+                type: "EVM",
+                address
+              }, defaultWalletInfo),
+              signedMessage: signature
+            };
+          }
+          break;
+        case "SOLANA":
+          {
+            verifyExternalWalletParams = {
+              externalWallet: __spreadValues({
+                partnerId: para.partnerId,
+                type: "SOLANA",
+                address
+              }, defaultWalletInfo),
+              signedMessage: signature
+            };
+          }
+          break;
+        default:
+          break;
+      }
+      if (!(verifyExternalWalletParams == null ? void 0 : verifyExternalWalletParams.externalWallet) || !(verifyExternalWalletParams == null ? void 0 : verifyExternalWalletParams.signedMessage)) {
+        console.error("No signature or address found on the verifyWalletSignature response.");
+        handlePostMessage({ type: "EW_SIGN_MESSAGE_ERROR", error: "Signature verification failed." });
+        return;
+      }
+      handlePostMessage({ type: "EW_SIGN_MESSAGE_SUCCESS", verifyExternalWalletParams });
+    } catch (error) {
+      handlePostMessage({ type: "EW_SIGN_MESSAGE_ERROR", error: error.message || "Error signing message" });
+    }
+  });
+  const setupExternalWalletVerificationTriggerListener = (wallet2) => {
+    if (!wallet2) {
+      return;
+    }
+    typeof window !== "undefined" && window.addEventListener("message", function handleMessage(event) {
+      return __async(this, null, function* () {
+        var _a;
+        if (!validatePortalOrigin(event, para.ctx)) {
+          return;
+        }
+        if (((_a = event.data) == null ? void 0 : _a.type) === "EW_TRIGGER_SIGN_MESSAGE") {
+          yield handleTriggerSignMessage(wallet2, event.data.message);
+          window.removeEventListener("message", handleMessage);
+        }
+      });
+    });
+  };
+  const setupPopupWindowCloseListener = () => {
+    const popup = refs.popupWindow.current;
+    if (!popup) return;
+    if (popupCloseIntervalRef.current) {
+      clearInterval(popupCloseIntervalRef.current);
+    }
+    popupCloseIntervalRef.current = setInterval(() => {
+      if (popup.closed) {
+        if (popupCloseIntervalRef.current) {
+          clearInterval(popupCloseIntervalRef.current);
+          popupCloseIntervalRef.current = null;
+        }
+        goBack();
+        disconnectExternalWallet();
+      }
+    }, 500);
+  };
+  const clearPopupWindowCloseListener = () => {
+    if (popupCloseIntervalRef.current) {
+      clearInterval(popupCloseIntervalRef.current);
+      popupCloseIntervalRef.current = null;
+    }
+  };
+  const handlePostConnectRetry = () => {
+    handlePostMessage({ type: "EW_CONNECT_RETRY" });
+  };
+  const handlePostConnectError = (error) => {
+    handlePostMessage({ type: "EW_CONNECT_ERROR", error });
+  };
+  const handleConnectRetryMessage = (wallet2) => (event) => __async(this, null, function* () {
+    var _a;
+    if (!validatePortalOrigin(event, para.ctx)) {
+      return;
+    }
+    if (((_a = event.data) == null ? void 0 : _a.type) === "EW_CONNECT_RETRY") {
+      clearExternalWalletConnectionRetryListener(wallet2);
+      yield connectExternalWallet({ wallet: wallet2, isMobileConnect: wallet2.isMobile, isRetryConnection: true });
+    }
+  });
+  const setupExternalWalletConnectionRetryListener = (wallet2) => {
+    typeof window !== "undefined" && window.addEventListener("message", handleConnectRetryMessage(wallet2));
+  };
+  const clearExternalWalletConnectionRetryListener = (wallet2) => {
+    window.removeEventListener("message", handleConnectRetryMessage(wallet2));
+  };
   const connectExternalWallet = useCallback(
-    (wallet2, isMobileConnect, isManualWalletConnect, isResetAfterManualWalletConnect) => __async(this, null, function* () {
+    (_0) => __async(this, [_0], function* ({
+      wallet: wallet2,
+      isManualWalletConnect,
+      isMobileConnect,
+      isResetAfterManualWalletConnect,
+      isRetryConnection
+    }) {
+      if (isRetryConnection) {
+        clearExternalWalletConnectionRetryListener(wallet2);
+        handlePostConnectRetry();
+      }
+      if (!isMobile() && isWithFullAuth(wallet2)) {
+        const popupUrl = yield para.constructPortalUrl("connectExternalWallet");
+        if (typeof window !== void 0) {
+          refs.popupWindow.current = openPopup({
+            url: popupUrl,
+            type: "LOGIN_EXTERNAL_WALLET",
+            target: "ParaExternalWallet"
+          });
+        }
+        setupPopupWindowCloseListener();
+      }
       if (isExternalWalletConnecting && isManualWalletConnect) {
         yield evmDisconnect();
         yield solanaDisconnect();
@@ -473,23 +687,27 @@ function ExternalWalletProvider({ children }) {
         setQrUri(void 0);
         setIsExternalWalletConnecting(false);
       }
-      if (isResetAfterManualWalletConnect || isManualWalletConnect || !isExternalWalletConnecting) {
+      if (isResetAfterManualWalletConnect || isManualWalletConnect || isMobileConnect || !isExternalWalletConnecting) {
         setExternalWalletError();
         setIsExternalWalletConnecting(true);
         setIsUsingMobileConnector(isMobileConnect);
+        listenForWalletConnectUri();
         const { address, error, authState } = yield isMobileConnect ? wallet2.connectMobile(isManualWalletConnect, connectionOnly) : wallet2.connect(connectionOnly);
         if (error) {
           setExternalWalletError([error]);
           setIsUsingMobileConnector();
+          handlePostConnectError(error);
           if (isManualWalletConnect && error === "Connection request rejected") {
             setExternalWalletError();
-            yield connectExternalWallet(wallet2, false, false, true);
-            yield updateQrUri();
+            yield connectExternalWallet({ wallet: wallet2, isResetAfterManualWalletConnect: true });
             return;
           }
+          setupExternalWalletConnectionRetryListener(wallet2);
         } else if (address) {
           if (!!authState && (isWithFullAuth(wallet2) || includeWalletVerification)) {
+            clearExternalWalletConnectionRetryListener(wallet2);
             onNewAuthState(authState);
+            setupExternalWalletVerificationTriggerListener(authState.externalWallet);
           } else {
             setStep(ModalStep.LOGIN_DONE);
           }
@@ -515,7 +733,7 @@ function ExternalWalletProvider({ children }) {
             isConnectionOnly: true
           });
         } else {
-          yield connectExternalWallet(evmWallet, false, true);
+          yield connectExternalWallet({ wallet: evmWallet, isManualWalletConnect: true });
         }
       }
       if (solanaWallet && (solanaFarcasterStatus == null ? void 0 : solanaFarcasterStatus.isPresent)) {
@@ -529,7 +747,7 @@ function ExternalWalletProvider({ children }) {
             isConnectionOnly: true
           });
         } else {
-          yield connectExternalWallet(solanaWallet, false, true);
+          yield connectExternalWallet({ wallet: solanaWallet, isManualWalletConnect: true });
         }
       }
       if (loginWallets.length > 0) {
@@ -541,6 +759,7 @@ function ExternalWalletProvider({ children }) {
     }
   });
   const requestInfo = (providerId, type) => __async(this, null, function* () {
+    listenForWalletConnectUri();
     switch (type) {
       case "EVM": {
         const externalWallet = yield evmRequestInfo(providerId);
@@ -559,19 +778,31 @@ function ExternalWalletProvider({ children }) {
       }
     }
   });
-  const disconnectBase = (providerId, type) => __async(this, null, function* () {
+  const disconnectBase = (providerId, type, opts) => __async(this, null, function* () {
     switch (type) {
       case "EVM":
-        yield evmDisconnectBase(providerId);
+        yield evmDisconnectBase(providerId, opts);
         break;
       case "SOLANA":
-        yield solanaDisconnectBase(providerId);
+        yield solanaDisconnectBase(providerId, opts);
         break;
       default: {
-        yield cosmosDisconnectBase();
+        yield cosmosDisconnectBase(void 0, opts);
         break;
       }
     }
+    if ((opts == null ? void 0 : opts.disconnectType) === "ACCOUNT_WIDGET") {
+      yield para.setExternalWallets(
+        (prev) => Object.entries(prev).reduce((acc, [address, externalWallet]) => {
+          if (externalWallet.type === type && externalWallet.externalProviderId === providerId) {
+            return acc;
+          }
+          return __spreadProps(__spreadValues({}, acc), {
+            [address]: externalWallet
+          });
+        }, {})
+      );
+    }
   });
   const disconnectExternalWallet = () => __async(this, null, function* () {
     if (para.isExternalWalletAuth) yield para.logout();
@@ -683,7 +914,10 @@ function ExternalWalletProvider({ children }) {
           requestInfo,
           disconnectBase,
           connectFarcasterMiniApp,
-          verificationStage
+          verificationStage,
+          evmDisconnectStatus,
+          solanaDisconnectStatus,
+          cosmosDisconnectStatus
         }),
         [
           wallets,
@@ -708,7 +942,10 @@ function ExternalWalletProvider({ children }) {
           requestInfo,
           disconnectBase,
           connectFarcasterMiniApp,
-          verificationStage
+          verificationStage,
+          evmDisconnectStatus,
+          solanaDisconnectStatus,
+          cosmosDisconnectStatus
         ]
       ),
       children

package/dist/provider/stores/getters.d.ts

@@ -1,4 +1,4 @@
 export declare const getClient: () => import("graz").ParaWeb | undefined;
 export declare const getIsOpen: () => boolean;
 export declare const getSelectedWalletId: () => string | undefined;
-export declare const getSelectedWalletType: () => "EVM" | "SOLANA" | "COSMOS" | undefined;
+export declare const getSelectedWalletType: () => "SOLANA" | "COSMOS" | "EVM" | undefined;

package/package.json

@@ -1,13 +1,13 @@
 {
   "name": "@getpara/react-sdk-lite",
-  "version": "2.0.0-alpha.66",
+  "version": "2.0.0-alpha.68",
   "bin": {
     "setup-para": "dist/cli/cli.mjs"
   },
   "dependencies": {
-    "@getpara/react-common": "2.0.0-alpha.66",
-    "@getpara/react-components": "2.0.0-alpha.66",
-    "@getpara/web-sdk": "2.0.0-alpha.66",
+    "@getpara/react-common": "2.0.0-alpha.68",
+    "@getpara/react-components": "2.0.0-alpha.68",
+    "@getpara/web-sdk": "2.0.0-alpha.68",
     "date-fns": "^3.6.0",
     "framer-motion": "^11.3.31",
     "libphonenumber-js": "^1.11.7",
@@ -16,9 +16,9 @@
     "zustand-sync-tabs": "^0.2.2"
   },
   "devDependencies": {
-    "@getpara/cosmos-wallet-connectors": "2.0.0-alpha.66",
-    "@getpara/evm-wallet-connectors": "2.0.0-alpha.66",
-    "@getpara/solana-wallet-connectors": "2.0.0-alpha.66",
+    "@getpara/cosmos-wallet-connectors": "2.0.0-alpha.68",
+    "@getpara/evm-wallet-connectors": "2.0.0-alpha.68",
+    "@getpara/solana-wallet-connectors": "2.0.0-alpha.68",
     "@tanstack/react-query": "^5.74.0",
     "@testing-library/dom": "^10.4.0",
     "@testing-library/react": "^16.3.0",
@@ -38,7 +38,7 @@
     "package.json",
     "styles.css"
   ],
-  "gitHead": "07c8b7b68aa36dec6071e3b3b3a66de2870312c8",
+  "gitHead": "98955203281606201609bb4674f5984acb63d3bf",
   "main": "dist/index.js",
   "peerDependencies": {
     "@tanstack/react-query": ">=5.0.0",

package/dist/modal/utils/routeMobileExternalWallet.d.ts

@@ -1 +0,0 @@
-export declare const routeMobileExternalWallet: (qrUri?: string) => void;

package/dist/modal/utils/routeMobileExternalWallet.js

@@ -1,31 +0,0 @@
-"use client";
-import "../../chunk-MMUBH76A.js";
-import { isAndroid, isMobile, isTelegram } from "@getpara/web-sdk";
-const routeMobileExternalWallet = (qrUri) => {
-  if (typeof window === "undefined") {
-    return;
-  }
-  if (isMobile()) {
-    if (!qrUri) return;
-    if (!isTelegram() && qrUri.startsWith("http")) {
-      const link = document.createElement("a");
-      link.href = qrUri;
-      link.target = "_blank";
-      link.rel = "noreferrer noopener";
-      link.click();
-    } else {
-      if (isTelegram()) {
-        let href = qrUri;
-        if (isAndroid()) {
-          href = encodeURI(qrUri);
-        }
-        window.open(href, "_blank", "noreferrer noopener");
-      } else {
-        window.location.href = qrUri;
-      }
-    }
-  }
-};
-export {
-  routeMobileExternalWallet
-};