@swype-org/react-sdk 0.1.70 → 0.1.73
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs +55 -12
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +55 -12
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -1641,6 +1641,23 @@ function resolveRestoredMobileFlow(transferStatus, isSetup) {
|
|
|
1641
1641
|
}
|
|
1642
1642
|
return { kind: "resume-open-wallet", step: "open-wallet", clearPersistedFlow: false };
|
|
1643
1643
|
}
|
|
1644
|
+
|
|
1645
|
+
// src/dataLoading.ts
|
|
1646
|
+
function resolveDataLoadAction({
|
|
1647
|
+
authenticated,
|
|
1648
|
+
step,
|
|
1649
|
+
accountsCount,
|
|
1650
|
+
hasActiveCredential,
|
|
1651
|
+
loading
|
|
1652
|
+
}) {
|
|
1653
|
+
if (!authenticated || step === "login" || step === "otp-verify" || accountsCount > 0 || !hasActiveCredential) {
|
|
1654
|
+
return "reset";
|
|
1655
|
+
}
|
|
1656
|
+
if (loading) {
|
|
1657
|
+
return "wait";
|
|
1658
|
+
}
|
|
1659
|
+
return "load";
|
|
1660
|
+
}
|
|
1644
1661
|
var FOOTER_CSS = `
|
|
1645
1662
|
.swype-screen-footer {
|
|
1646
1663
|
padding-bottom: max(24px, env(safe-area-inset-bottom, 24px));
|
|
@@ -2006,11 +2023,17 @@ var METAMASK_SVG = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 318.6 3
|
|
|
2006
2023
|
<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"/>
|
|
2007
2024
|
<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"/>
|
|
2008
2025
|
</svg>`;
|
|
2026
|
+
var TRUST_WALLET_SVG = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 480 480" fill="none">
|
|
2027
|
+
<rect width="480" height="480" rx="96" fill="#0500FF"/>
|
|
2028
|
+
<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"/>
|
|
2029
|
+
</svg>`;
|
|
2009
2030
|
var BASE_LOGO = svgToDataUri(BASE_SVG);
|
|
2010
2031
|
var METAMASK_LOGO = svgToDataUri(METAMASK_SVG);
|
|
2032
|
+
var TRUST_WALLET_LOGO = svgToDataUri(TRUST_WALLET_SVG);
|
|
2011
2033
|
var KNOWN_LOGOS = {
|
|
2012
2034
|
metamask: METAMASK_LOGO,
|
|
2013
|
-
base: BASE_LOGO
|
|
2035
|
+
base: BASE_LOGO,
|
|
2036
|
+
"trust wallet": TRUST_WALLET_LOGO
|
|
2014
2037
|
};
|
|
2015
2038
|
function SourceCard({ name, address, verified, onChangeSource }) {
|
|
2016
2039
|
const { tokens } = useSwypeConfig();
|
|
@@ -4483,6 +4506,7 @@ function SwypePaymentInner({
|
|
|
4483
4506
|
const [oneTapLimit, setOneTapLimit] = useState(100);
|
|
4484
4507
|
const [mobileFlow, setMobileFlow] = useState(false);
|
|
4485
4508
|
const [deeplinkUri, setDeeplinkUri] = useState(null);
|
|
4509
|
+
const loadingDataRef = useRef(false);
|
|
4486
4510
|
const pollingTransferIdRef = useRef(null);
|
|
4487
4511
|
const mobileSigningTransferIdRef = useRef(null);
|
|
4488
4512
|
const mobileSetupFlowRef = useRef(false);
|
|
@@ -4513,6 +4537,10 @@ function SwypePaymentInner({
|
|
|
4513
4537
|
setConnectingNewAccount(false);
|
|
4514
4538
|
}
|
|
4515
4539
|
}, [getAccessToken, activeCredentialId, apiBaseUrl, depositAmount]);
|
|
4540
|
+
const resetDataLoadingState = useCallback(() => {
|
|
4541
|
+
loadingDataRef.current = false;
|
|
4542
|
+
setLoadingData(false);
|
|
4543
|
+
}, []);
|
|
4516
4544
|
const enterPersistedMobileFlow = useCallback((persisted, errorMessage) => {
|
|
4517
4545
|
setMobileFlow(true);
|
|
4518
4546
|
setDeeplinkUri(persisted.deeplinkUri);
|
|
@@ -4530,6 +4558,7 @@ function SwypePaymentInner({
|
|
|
4530
4558
|
clearMobileFlowState();
|
|
4531
4559
|
try {
|
|
4532
4560
|
await reloadAccounts();
|
|
4561
|
+
resetDataLoadingState();
|
|
4533
4562
|
setTransfer(null);
|
|
4534
4563
|
setError(null);
|
|
4535
4564
|
setDeeplinkUri(null);
|
|
@@ -4550,7 +4579,7 @@ function SwypePaymentInner({
|
|
|
4550
4579
|
setDeeplinkUri(null);
|
|
4551
4580
|
setMobileFlow(false);
|
|
4552
4581
|
setStep("confirm-sign");
|
|
4553
|
-
}, [polling.stopPolling, reloadAccounts]);
|
|
4582
|
+
}, [polling.stopPolling, reloadAccounts, resetDataLoadingState]);
|
|
4554
4583
|
const handleRetryMobileStatus = useCallback(() => {
|
|
4555
4584
|
setError(null);
|
|
4556
4585
|
const currentTransfer = polling.transfer ?? transfer;
|
|
@@ -4584,8 +4613,9 @@ function SwypePaymentInner({
|
|
|
4584
4613
|
const activeOtpStatus = verificationTarget?.kind === "email" ? emailLoginState.status : verificationTarget?.kind === "phone" ? smsLoginState.status : "initial";
|
|
4585
4614
|
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;
|
|
4586
4615
|
useEffect(() => {
|
|
4616
|
+
if (authenticated) return;
|
|
4587
4617
|
if (activeOtpErrorMessage) setError(activeOtpErrorMessage);
|
|
4588
|
-
}, [activeOtpErrorMessage]);
|
|
4618
|
+
}, [activeOtpErrorMessage, authenticated]);
|
|
4589
4619
|
const handleSendLoginCode = useCallback(async () => {
|
|
4590
4620
|
const normalizedIdentifier = normalizeAuthIdentifier(authInput);
|
|
4591
4621
|
if (!normalizedIdentifier) {
|
|
@@ -4778,12 +4808,26 @@ function SwypePaymentInner({
|
|
|
4778
4808
|
handleAuthorizedMobileReturn,
|
|
4779
4809
|
onComplete
|
|
4780
4810
|
]);
|
|
4781
|
-
const loadingDataRef = useRef(false);
|
|
4782
4811
|
useEffect(() => {
|
|
4783
|
-
|
|
4784
|
-
|
|
4785
|
-
|
|
4786
|
-
|
|
4812
|
+
const loadAction = resolveDataLoadAction({
|
|
4813
|
+
authenticated,
|
|
4814
|
+
step,
|
|
4815
|
+
accountsCount: accounts.length,
|
|
4816
|
+
hasActiveCredential: !!activeCredentialId,
|
|
4817
|
+
loading: loadingDataRef.current
|
|
4818
|
+
});
|
|
4819
|
+
if (loadAction === "reset") {
|
|
4820
|
+
resetDataLoadingState();
|
|
4821
|
+
return;
|
|
4822
|
+
}
|
|
4823
|
+
if (loadAction === "wait") {
|
|
4824
|
+
return;
|
|
4825
|
+
}
|
|
4826
|
+
const credentialId = activeCredentialId;
|
|
4827
|
+
if (!credentialId) {
|
|
4828
|
+
resetDataLoadingState();
|
|
4829
|
+
return;
|
|
4830
|
+
}
|
|
4787
4831
|
let cancelled = false;
|
|
4788
4832
|
loadingDataRef.current = true;
|
|
4789
4833
|
const load = async () => {
|
|
@@ -4794,7 +4838,7 @@ function SwypePaymentInner({
|
|
|
4794
4838
|
if (!token) throw new Error("Not authenticated");
|
|
4795
4839
|
const [prov, accts, chn] = await Promise.all([
|
|
4796
4840
|
fetchProviders(apiBaseUrl, token),
|
|
4797
|
-
fetchAccounts(apiBaseUrl, token,
|
|
4841
|
+
fetchAccounts(apiBaseUrl, token, credentialId),
|
|
4798
4842
|
fetchChains(apiBaseUrl, token)
|
|
4799
4843
|
]);
|
|
4800
4844
|
if (cancelled) return;
|
|
@@ -4832,8 +4876,7 @@ function SwypePaymentInner({
|
|
|
4832
4876
|
}
|
|
4833
4877
|
} finally {
|
|
4834
4878
|
if (!cancelled) {
|
|
4835
|
-
|
|
4836
|
-
loadingDataRef.current = false;
|
|
4879
|
+
resetDataLoadingState();
|
|
4837
4880
|
}
|
|
4838
4881
|
}
|
|
4839
4882
|
};
|
|
@@ -4842,7 +4885,7 @@ function SwypePaymentInner({
|
|
|
4842
4885
|
cancelled = true;
|
|
4843
4886
|
loadingDataRef.current = false;
|
|
4844
4887
|
};
|
|
4845
|
-
}, [authenticated, step, accounts.length, apiBaseUrl, getAccessToken, activeCredentialId, depositAmount, connectingNewAccount]);
|
|
4888
|
+
}, [authenticated, step, accounts.length, apiBaseUrl, getAccessToken, activeCredentialId, depositAmount, connectingNewAccount, resetDataLoadingState]);
|
|
4846
4889
|
useEffect(() => {
|
|
4847
4890
|
if (!polling.transfer) return;
|
|
4848
4891
|
if (polling.transfer.status === "COMPLETED") {
|