@getpara/react-sdk-lite 2.0.0-alpha.52 → 2.0.0-alpha.54

package/dist/provider/providers/AssetsProvider.js

@@ -0,0 +1,68 @@
+"use client";
+import "../../chunk-MMUBH76A.js";
+import { jsx } from "react/jsx-runtime";
+import { createContext, useContext, useMemo } from "react";
+import { formatCurrency, formatAssetQuantity } from "@getpara/web-sdk";
+import { useAssetInfo } from "../hooks/utils/useAssetInfo.js";
+import { useStore } from "../stores/useStore.js";
+import { useProfileBalance } from "../hooks/queries/index.js";
+const AssetsContext = createContext({
+  displayCurrency: "USD",
+  profileBalance: null,
+  profileBalanceIsPending: true,
+  assetMetadata: null,
+  assetMetadataIsPending: true,
+  totalBalance: void 0
+});
+function AssetsProvider({ children }) {
+  const balancesConfig = useStore((state) => {
+    var _a;
+    return (_a = state.modalConfig) == null ? void 0 : _a.balances;
+  });
+  const { data: profileBalance, isPending: profileBalanceIsPending } = useProfileBalance();
+  const { data: assetMetadata, isPending: assetMetadataIsPending } = useAssetInfo();
+  const totalBalance = useMemo(() => {
+    switch (true) {
+      case !balancesConfig:
+      case (balancesConfig == null ? void 0 : balancesConfig.displayType) === "AGGREGATED":
+        if (!(profileBalance == null ? void 0 : profileBalance.value)) {
+          return void 0;
+        }
+        return formatCurrency(profileBalance.value);
+      default: {
+        if (!profileBalance) {
+          return void 0;
+        }
+        const assetQuantity = profileBalance.wallets.reduce((acc, wallet) => {
+          const asset = wallet.assets.find((a) => {
+            var _a;
+            return ((_a = a.metadata) == null ? void 0 : _a.symbol) === balancesConfig.asset.symbol;
+          });
+          if (!asset) {
+            return acc;
+          }
+          return acc + asset.quantity;
+        }, 0);
+        return formatAssetQuantity({ quantity: assetQuantity, symbol: balancesConfig.asset.symbol });
+      }
+    }
+  }, [balancesConfig, profileBalance]);
+  const value = useMemo(
+    () => ({
+      displayCurrency: "USD",
+      profileBalance: profileBalance || null,
+      profileBalanceIsPending,
+      assetMetadata: assetMetadata || null,
+      assetMetadataIsPending,
+      totalBalance
+    }),
+    [profileBalance, totalBalance, profileBalanceIsPending, assetMetadata, assetMetadataIsPending]
+  );
+  return /* @__PURE__ */ jsx(AssetsContext.Provider, { value, children });
+}
+const useAssets = () => useContext(AssetsContext);
+export {
+  AssetsContext,
+  AssetsProvider,
+  useAssets
+};

package/dist/provider/providers/AuthProvider.d.ts

@@ -1,8 +1,8 @@
 import { BiometricHints } from '@getpara/react-common';
 import { PropsWithChildren } from 'react';
-import { AuthMethod, CoreMethodParams, AuthState, AuthStateSignup, AuthStateLogin } from '@getpara/web-sdk';
+import { AuthMethod, CoreMethodParams, AuthState, AuthStateSignup, AuthStateLogin, AuthStateVerify } from '@getpara/web-sdk';
 import { ParaModalProps } from '../../modal/types/modalProps.js';
-import { TelegramAuthResponse, VerifiedAuth } from '@getpara/user-management-client';
+import { VerifiedAuth, VerifyThirdPartyAuth } from '@getpara/user-management-client';
 import { MutationStatus } from '@tanstack/react-query';
 type Value = {
     signUpOrLogIn: (_: VerifiedAuth) => void;
@@ -11,12 +11,14 @@ type Value = {
     verifyNewAccountStatus: MutationStatus;
     verifyNewAccountError: Error | null;
     verifyOAuth: (_: CoreMethodParams<'verifyOAuth'>['method']) => void;
-    verifyFarcaster: () => void;
-    verifyTelegram: (_: TelegramAuthResponse) => void;
+    verifyFarcaster: (_?: VerifyThirdPartyAuth) => void;
+    verifyTelegram: (_: VerifyThirdPartyAuth) => void;
     verifyTelegramStatus: MutationStatus;
+    verifyFarcasterStatus: MutationStatus;
     onNewAuthState: (_: AuthState) => void;
     presentSignupUi: (_: AuthMethod, __: AuthStateSignup) => void;
     presentLoginUi: (_: AuthMethod, __: AuthStateLogin) => void;
+    presentVerifyUi: (_: AuthMethod, __: AuthStateVerify) => void;
     isSetup2faPending: boolean;
     createGuestWallets: () => void;
     isCreateGuestWalletsPending: boolean;

package/dist/provider/providers/AuthProvider.js

@@ -51,6 +51,7 @@ const AuthContext = createContext({
   verifyTelegram: () => {
   },
   verifyTelegramStatus: "idle",
+  verifyFarcasterStatus: "idle",
   onNewAuthState: () => {
   },
   isSetup2faPending: false,
@@ -58,6 +59,8 @@ const AuthContext = createContext({
   },
   presentLoginUi: () => {
   },
+  presentVerifyUi: () => {
+  },
   createGuestWallets: () => {
   },
   isCreateGuestWalletsPending: false,
@@ -103,7 +106,7 @@ function AuthProvider({
     error: verifyNewAccountError
   } = useVerifyNewAccount();
   const { verifyOAuth: mutateVerifyOAuth } = useVerifyOAuth();
-  const { verifyFarcaster: mutateVerifyFarcaster } = useVerifyFarcaster();
+  const { verifyFarcaster: mutateVerifyFarcaster, status: verifyFarcasterStatus } = useVerifyFarcaster();
   const { verifyTelegram: mutateVerifyTelegram, status: verifyTelegramStatus } = useVerifyTelegram();
   const { waitForLogin: mutateWaitForLogin } = useWaitForLogin();
   const { waitForSignup: mutateWaitForSignup } = useWaitForSignup();
@@ -127,7 +130,8 @@ function AuthProvider({
     window.addEventListener("message", function handleMessage(event) {
       var _a;
       const portalBase = getPortalBaseURL(para.ctx);
-      if (!event.origin.startsWith(portalBase)) {
+      const portalLocalBase = getPortalBaseURL(para.ctx, true);
+      if (!event.origin.startsWith(portalBase) && !event.origin.startsWith(portalLocalBase)) {
         return;
       }
       if (((_a = event.data) == null ? void 0 : _a.type) === "CLOSE_WINDOW") {
@@ -135,13 +139,13 @@ function AuthProvider({
           setAuthStepRoute();
           setIFrameUrl();
           setIsIFrameReady(false);
-          setStep(ModalStep.AWAITING_IFRAME);
+          setStep(ModalStep.AWAITING_ACCOUNT);
         }
         window.removeEventListener("message", handleMessage);
       }
     });
   };
-  const signup = () => {
+  const pollSignup = () => {
     if (typeof window !== "undefined") {
       refs.poll.current = {
         action: "signup",
@@ -152,10 +156,11 @@ function AuthProvider({
                 ModalStep.BIOMETRIC_CREATION,
                 ModalStep.AWAITING_BIOMETRIC_CREATION,
                 ModalStep.PASSWORD_CREATION,
-                ModalStep.AWAITING_IFRAME,
+                ModalStep.AWAITING_ACCOUNT,
                 ModalStep.VERIFICATIONS,
                 ModalStep.AWAITING_OAUTH,
-                ModalStep.EXTERNAL_WALLET_VERIFICATION
+                ModalStep.EXTERNAL_WALLET_VERIFICATION,
+                ModalStep.OTP
               ]),
               onPoll: () => {
                 goBackIfPopupClosedOnSteps([ModalStep.AWAITING_BIOMETRIC_CREATION]);
@@ -173,7 +178,7 @@ function AuthProvider({
                 }
               },
               onError: () => {
-                if (refs.currentStep.current && [ModalStep.AWAITING_BIOMETRIC_CREATION, ModalStep.PASSWORD_CREATION, ModalStep.AWAITING_IFRAME].includes(
+                if (refs.currentStep.current && [ModalStep.AWAITING_BIOMETRIC_CREATION, ModalStep.PASSWORD_CREATION, ModalStep.AWAITING_ACCOUNT].includes(
                   refs.currentStep.current
                 )) {
                   goBack();
@@ -229,6 +234,23 @@ function AuthProvider({
     },
     [isIFrameReady]
   );
+  const presentVerifyUi = useCallback(
+    (method, authState) => {
+      switch (method) {
+        case AuthMethod.BASIC_LOGIN:
+          setupListener();
+          if (isIFrameReady) {
+            setStep(ModalStep.OTP);
+          } else {
+            setIFrameUrl(authState.loginUrl);
+            setIsIFrameReady(false);
+            setAuthStepRoute(ModalStep.OTP);
+          }
+          break;
+      }
+    },
+    [isIFrameReady]
+  );
   const login = (authState) => {
     if (authState.isWalletSelectionNeeded || authState.passkeyUrl) {
       setStep(ModalStep.BIOMETRIC_LOGIN);
@@ -238,47 +260,56 @@ function AuthProvider({
       setIsIFrameReady(false);
       setStep(ModalStep.EMBEDDED_PASSWORD_LOGIN);
     }
-    refs.poll.current = {
-      action: "login",
-      timeout: window == null ? void 0 : window.setTimeout(() => __async(this, null, function* () {
-        mutateWaitForLogin(
-          {
-            isCanceled: () => cancelIfExitedSteps([
-              ModalStep.BIOMETRIC_LOGIN,
-              ModalStep.EMBEDDED_PASSWORD_LOGIN,
-              ModalStep.AWAITING_BIOMETRIC_LOGIN,
-              ModalStep.AWAITING_PASSWORD_LOGIN,
-              ModalStep.AWAITING_IFRAME
-            ]),
-            onPoll: () => {
-              goBackIfPopupClosedOnSteps([
+    pollLogin();
+  };
+  const pollLogin = () => {
+    if (typeof window !== "undefined") {
+      refs.poll.current = {
+        action: "login",
+        timeout: window == null ? void 0 : window.setTimeout(() => __async(this, null, function* () {
+          mutateWaitForLogin(
+            {
+              isCanceled: () => cancelIfExitedSteps([
+                ModalStep.BIOMETRIC_LOGIN,
+                ModalStep.EMBEDDED_PASSWORD_LOGIN,
                 ModalStep.AWAITING_BIOMETRIC_LOGIN,
                 ModalStep.AWAITING_PASSWORD_LOGIN,
-                ModalStep.EMBEDDED_PASSWORD_LOGIN
-              ]);
-            }
-          },
-          {
-            onSuccess: ({ needsWallet }) => {
-              if (needsWallet && !para.isNoWalletConfig) {
-                createWallets();
-              } else {
-                onLoginComplete({
-                  on2faSetupOrError: () => setStep(ModalStep.LOGIN_DONE),
-                  on2faNotSetup: () => setStep(ModalStep.SETUP_2FA)
-                });
+                ModalStep.AWAITING_ACCOUNT,
+                ModalStep.OTP,
+                ModalStep.FARCASTER_OAUTH,
+                ModalStep.TELEGRAM_OAUTH
+              ]),
+              onPoll: () => {
+                goBackIfPopupClosedOnSteps([
+                  ModalStep.AWAITING_BIOMETRIC_LOGIN,
+                  ModalStep.AWAITING_PASSWORD_LOGIN,
+                  ModalStep.EMBEDDED_PASSWORD_LOGIN,
+                  ModalStep.OTP
+                ]);
               }
             },
-            onSettled: () => {
-              var _a;
-              window == null ? void 0 : window.clearTimeout((_a = refs.poll.current) == null ? void 0 : _a.timeout);
-              refs.poll.current = null;
-              refs.popupWindow.current = null;
+            {
+              onSuccess: ({ needsWallet }) => {
+                if (needsWallet && !para.isNoWalletConfig) {
+                  createWallets();
+                } else {
+                  onLoginComplete({
+                    on2faSetupOrError: () => setStep(ModalStep.LOGIN_DONE),
+                    on2faNotSetup: () => setStep(ModalStep.SETUP_2FA)
+                  });
+                }
+              },
+              onSettled: () => {
+                var _a;
+                window == null ? void 0 : window.clearTimeout((_a = refs.poll.current) == null ? void 0 : _a.timeout);
+                refs.poll.current = null;
+                refs.popupWindow.current = null;
+              }
             }
-          }
-        );
-      }), DEFAULTS.LOGGIN_POLLING_DELAY_MS)
-    };
+          );
+        }), DEFAULTS.LOGGIN_POLLING_DELAY_MS)
+      };
+    }
   };
   const presentLoginUi = useCallback(
     (method, authState) => {
@@ -313,7 +344,20 @@ function AuthProvider({
         if (isExternalWallet(authState.auth) && authState.signatureVerificationMessage) {
           setStep(ModalStep.EXTERNAL_WALLET_VERIFICATION);
         } else {
-          setStep(ModalStep.VERIFICATIONS);
+          if (authState.nextStage === "login") {
+            setFlow("login");
+            pollLogin();
+          } else {
+            setFlow("signup");
+            pollSignup();
+          }
+          if (authState.loginUrl) {
+            setIFrameUrl(authState.loginUrl);
+            setIsIFrameReady(false);
+            presentVerifyUi(AuthMethod.BASIC_LOGIN, authState);
+          } else {
+            setStep(ModalStep.VERIFICATIONS);
+          }
         }
         break;
       case "login":
@@ -330,7 +374,7 @@ function AuthProvider({
             setIFrameUrl(authState.passwordUrl || authState.pinUrl);
             setIsIFrameReady(false);
           }
-          signup();
+          pollSignup();
           if (isPasswordOrPINOnly) {
             presentSignupUi(isPassword ? AuthMethod.PASSWORD : AuthMethod.PIN, authState);
           } else {
@@ -338,6 +382,18 @@ function AuthProvider({
           }
         }
         break;
+      case "done":
+        if (authState.isNewUser) {
+          pollSignup();
+          setFlow("signup");
+        } else {
+          pollLogin();
+          setFlow("login");
+        }
+        if (!authState.isWalletSelectionNeeded) {
+          setStep(ModalStep.AWAITING_ACCOUNT);
+        }
+        break;
     }
   });
   const signUpOrLogIn = (auth) => __async(this, null, function* () {
@@ -381,8 +437,12 @@ function AuthProvider({
       }
     );
   });
-  const verifyFarcaster = () => __async(this, null, function* () {
-    setStep(ModalStep.FARCASTER_OAUTH);
+  const verifyFarcaster = (serverAuthState) => __async(this, null, function* () {
+    if (!serverAuthState) {
+      setStep(ModalStep.FARCASTER_OAUTH);
+    } else {
+      setupListener();
+    }
     mutateVerifyFarcaster(
       {
         isCanceled: () => refs.currentStep.current !== ModalStep.FARCASTER_OAUTH,
@@ -390,7 +450,8 @@ function AuthProvider({
           setFarcasterConnectUri(connectUri);
           routeMobileExternalWallet(connectUri);
         },
-        useShortUrls: true
+        useShortUrls: true,
+        serverAuthState
       },
       {
         onSuccess: onNewAuthState,
@@ -402,10 +463,13 @@ function AuthProvider({
       }
     );
   });
-  const verifyTelegram = (telegramAuthResponse) => __async(this, null, function* () {
+  const verifyTelegram = (serverAuthState) => __async(this, null, function* () {
+    if (serverAuthState) {
+      setupListener();
+    }
     mutateVerifyTelegram(
       {
-        telegramAuthResponse,
+        serverAuthState,
         useShortUrls: true
       },
       {
@@ -497,6 +561,7 @@ function AuthProvider({
     () => ({
       presentSignupUi,
       presentLoginUi,
+      presentVerifyUi,
       signUpOrLogIn,
       isSignUpOrLogInPending,
       verifyNewAccount,
@@ -511,11 +576,13 @@ function AuthProvider({
       createGuestWallets,
       isCreateGuestWalletsPending,
       logout,
-      biometricHints: biometricHints || void 0
+      biometricHints: biometricHints || void 0,
+      verifyFarcasterStatus
     }),
     [
       presentSignupUi,
       presentLoginUi,
+      presentVerifyUi,
       signUpOrLogIn,
       isSignUpOrLogInPending,
       verifyNewAccount,
@@ -531,7 +598,8 @@ function AuthProvider({
       createGuestWallets,
       isCreateGuestWalletsPending,
       logout,
-      biometricHints
+      biometricHints,
+      verifyFarcasterStatus
     ]
   );
   useEffect(() => {

package/dist/provider/stores/slices/modal.js

@@ -15,7 +15,10 @@ const createModalSlice = (set) => ({
   oAuthLogoVariant: "default",
   isOpen: false,
   setIsOpen: (isOpen) => set({ isOpen }),
-  openedToStep: createRef()
+  refs: {
+    openedToStep: createRef(),
+    balancesInvalidationTime: createRef()
+  }
 });
 export {
   createModalSlice

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

@@ -36,7 +36,10 @@ export interface ModalSlice {
     oAuthLogoVariant: OAuthLogoVariantType;
     isOpen: boolean;
     setIsOpen: (_: boolean) => void;
-    openedToStep: MutableRefObject<ModalStep | null>;
+    refs: {
+        openedToStep: MutableRefObject<ModalStep | null>;
+        balancesInvalidationTime: MutableRefObject<number | null>;
+    };
 }
 export interface WalletSlice {
     rpcUrl?: string;

package/package.json

@@ -1,13 +1,13 @@
 {
   "name": "@getpara/react-sdk-lite",
-  "version": "2.0.0-alpha.52",
+  "version": "2.0.0-alpha.54",
   "bin": {
     "setup-para": "dist/cli/cli.mjs"
   },
   "dependencies": {
-    "@getpara/react-common": "2.0.0-alpha.52",
-    "@getpara/react-components": "2.0.0-alpha.52",
-    "@getpara/web-sdk": "2.0.0-alpha.52",
+    "@getpara/react-common": "2.0.0-alpha.54",
+    "@getpara/react-components": "2.0.0-alpha.54",
+    "@getpara/web-sdk": "2.0.0-alpha.54",
     "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.52",
-    "@getpara/evm-wallet-connectors": "2.0.0-alpha.52",
-    "@getpara/solana-wallet-connectors": "2.0.0-alpha.52",
+    "@getpara/cosmos-wallet-connectors": "2.0.0-alpha.54",
+    "@getpara/evm-wallet-connectors": "2.0.0-alpha.54",
+    "@getpara/solana-wallet-connectors": "2.0.0-alpha.54",
     "@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": "a63dba8c230e9ff2d73b275d3e40091b93aecf1c",
+  "gitHead": "680049700f7b36b7ef407cab0fbfadad8c069d74",
   "main": "dist/index.js",
   "peerDependencies": {
     "@tanstack/react-query": ">=5.0.0",

package/dist/modal/components/AwaitingIFrameStep/AwaitingIFrameStep.d.ts

@@ -1 +0,0 @@
-export declare const AwaitingIFrameStep: () => import("react/jsx-runtime").JSX.Element;

package/dist/modal/components/AwaitingIFrameStep/AwaitingIFrameStep.js

@@ -1,12 +0,0 @@
-"use client";
-import "../../../chunk-MMUBH76A.js";
-import { jsx } from "react/jsx-runtime";
-import { useModalStore } from "../../stores/index.js";
-import { Waiting } from "../Waiting/Waiting.js";
-const AwaitingIFrameStep = () => {
-  const isLogin = useModalStore((state) => state.isLogin());
-  return /* @__PURE__ */ jsx(Waiting, { heading: isLogin ? "Logging you in..." : "Creating your account..." });
-};
-export {
-  AwaitingIFrameStep
-};