@swype-org/react-sdk 0.1.70 → 0.1.73

package/dist/index.cjs

@@ -1644,6 +1644,23 @@ function resolveRestoredMobileFlow(transferStatus, isSetup) {
   }
   return { kind: "resume-open-wallet", step: "open-wallet", clearPersistedFlow: false };
 }
+
+// src/dataLoading.ts
+function resolveDataLoadAction({
+  authenticated,
+  step,
+  accountsCount,
+  hasActiveCredential,
+  loading
+}) {
+  if (!authenticated || step === "login" || step === "otp-verify" || accountsCount > 0 || !hasActiveCredential) {
+    return "reset";
+  }
+  if (loading) {
+    return "wait";
+  }
+  return "load";
+}
 var FOOTER_CSS = `
 .swype-screen-footer {
   padding-bottom: max(24px, env(safe-area-inset-bottom, 24px));
@@ -2009,11 +2026,17 @@ var METAMASK_SVG = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 318.6 3
 <polygon fill="#763D16" stroke="#763D16" stroke-linecap="round" stroke-linejoin="round" points="278.3,114.2 286.8,73.7 274.1,35.5 174.6,109.4 214.9,138.2 267.2,153.5 278.8,140 273.8,136.4 281.8,129.1 275.4,124.1 283.4,118"/>
 <polygon fill="#763D16" stroke="#763D16" stroke-linecap="round" stroke-linejoin="round" points="31.8,73.7 40.3,114.2 35.5,118 43.5,124.1 36.8,129.1 44.8,136.4 39.8,140 51.3,153.5 103.6,138.2 143.1,110.1 44.4,35.5"/>
 </svg>`;
+var TRUST_WALLET_SVG = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 480 480" fill="none">
+<rect width="480" height="480" rx="96" fill="#0500FF"/>
+<path d="M240 97C291.833 133.09 330.903 139.252 378 139.252C378 269.452 346.233 348.948 240 403C133.767 348.948 102 269.452 102 139.252C149.097 139.252 188.167 133.09 240 97Z" stroke="white" stroke-width="30" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>`;
 var BASE_LOGO = svgToDataUri(BASE_SVG);
 var METAMASK_LOGO = svgToDataUri(METAMASK_SVG);
+var TRUST_WALLET_LOGO = svgToDataUri(TRUST_WALLET_SVG);
 var KNOWN_LOGOS = {
   metamask: METAMASK_LOGO,
-  base: BASE_LOGO
+  base: BASE_LOGO,
+  "trust wallet": TRUST_WALLET_LOGO
 };
 function SourceCard({ name, address, verified, onChangeSource }) {
   const { tokens } = useSwypeConfig();
@@ -4486,6 +4509,7 @@ function SwypePaymentInner({
   const [oneTapLimit, setOneTapLimit] = react.useState(100);
   const [mobileFlow, setMobileFlow] = react.useState(false);
   const [deeplinkUri, setDeeplinkUri] = react.useState(null);
+  const loadingDataRef = react.useRef(false);
   const pollingTransferIdRef = react.useRef(null);
   const mobileSigningTransferIdRef = react.useRef(null);
   const mobileSetupFlowRef = react.useRef(false);
@@ -4516,6 +4540,10 @@ function SwypePaymentInner({
       setConnectingNewAccount(false);
     }
   }, [getAccessToken, activeCredentialId, apiBaseUrl, depositAmount]);
+  const resetDataLoadingState = react.useCallback(() => {
+    loadingDataRef.current = false;
+    setLoadingData(false);
+  }, []);
   const enterPersistedMobileFlow = react.useCallback((persisted, errorMessage) => {
     setMobileFlow(true);
     setDeeplinkUri(persisted.deeplinkUri);
@@ -4533,6 +4561,7 @@ function SwypePaymentInner({
       clearMobileFlowState();
       try {
         await reloadAccounts();
+        resetDataLoadingState();
         setTransfer(null);
         setError(null);
         setDeeplinkUri(null);
@@ -4553,7 +4582,7 @@ function SwypePaymentInner({
     setDeeplinkUri(null);
     setMobileFlow(false);
     setStep("confirm-sign");
-  }, [polling.stopPolling, reloadAccounts]);
+  }, [polling.stopPolling, reloadAccounts, resetDataLoadingState]);
   const handleRetryMobileStatus = react.useCallback(() => {
     setError(null);
     const currentTransfer = polling.transfer ?? transfer;
@@ -4587,8 +4616,9 @@ function SwypePaymentInner({
   const activeOtpStatus = verificationTarget?.kind === "email" ? emailLoginState.status : verificationTarget?.kind === "phone" ? smsLoginState.status : "initial";
   const activeOtpErrorMessage = verificationTarget?.kind === "email" && emailLoginState.status === "error" ? emailLoginState.error?.message ?? "Failed to continue with email." : verificationTarget?.kind === "phone" && smsLoginState.status === "error" ? smsLoginState.error?.message ?? "Failed to continue with phone number." : null;
   react.useEffect(() => {
+    if (authenticated) return;
     if (activeOtpErrorMessage) setError(activeOtpErrorMessage);
-  }, [activeOtpErrorMessage]);
+  }, [activeOtpErrorMessage, authenticated]);
   const handleSendLoginCode = react.useCallback(async () => {
     const normalizedIdentifier = normalizeAuthIdentifier(authInput);
     if (!normalizedIdentifier) {
@@ -4781,12 +4811,26 @@ function SwypePaymentInner({
     handleAuthorizedMobileReturn,
     onComplete
   ]);
-  const loadingDataRef = react.useRef(false);
   react.useEffect(() => {
-    if (!authenticated) return;
-    if (step === "login" || step === "otp-verify") return;
-    if (accounts.length > 0 || loadingDataRef.current) return;
-    if (!activeCredentialId) return;
+    const loadAction = resolveDataLoadAction({
+      authenticated,
+      step,
+      accountsCount: accounts.length,
+      hasActiveCredential: !!activeCredentialId,
+      loading: loadingDataRef.current
+    });
+    if (loadAction === "reset") {
+      resetDataLoadingState();
+      return;
+    }
+    if (loadAction === "wait") {
+      return;
+    }
+    const credentialId = activeCredentialId;
+    if (!credentialId) {
+      resetDataLoadingState();
+      return;
+    }
     let cancelled = false;
     loadingDataRef.current = true;
     const load = async () => {
@@ -4797,7 +4841,7 @@ function SwypePaymentInner({
         if (!token) throw new Error("Not authenticated");
         const [prov, accts, chn] = await Promise.all([
           fetchProviders(apiBaseUrl, token),
-          fetchAccounts(apiBaseUrl, token, activeCredentialId),
+          fetchAccounts(apiBaseUrl, token, credentialId),
           fetchChains(apiBaseUrl, token)
         ]);
         if (cancelled) return;
@@ -4835,8 +4879,7 @@ function SwypePaymentInner({
         }
       } finally {
         if (!cancelled) {
-          setLoadingData(false);
-          loadingDataRef.current = false;
+          resetDataLoadingState();
         }
       }
     };
@@ -4845,7 +4888,7 @@ function SwypePaymentInner({
       cancelled = true;
       loadingDataRef.current = false;
     };
-  }, [authenticated, step, accounts.length, apiBaseUrl, getAccessToken, activeCredentialId, depositAmount, connectingNewAccount]);
+  }, [authenticated, step, accounts.length, apiBaseUrl, getAccessToken, activeCredentialId, depositAmount, connectingNewAccount, resetDataLoadingState]);
   react.useEffect(() => {
     if (!polling.transfer) return;
     if (polling.transfer.status === "COMPLETED") {