@getpara/react-sdk-lite 2.10.0 → 2.12.0
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/modal/ParaModal.js +14 -1
- package/dist/modal/components/Account/Account.js +114 -22
- package/dist/modal/components/Account/AccountMonitorTx.d.ts +1 -0
- package/dist/modal/components/Account/AccountMonitorTx.js +256 -0
- package/dist/modal/components/Account/AccountSend/AccountSendAsset.js +2 -2
- package/dist/modal/components/Account/AccountSend/AccountSendForm.js +68 -10
- package/dist/modal/components/Account/AccountSend/context.d.ts +2 -0
- package/dist/modal/components/Account/AccountSend/context.js +50 -110
- package/dist/modal/components/Account/AccountWallet.js +1 -6
- package/dist/modal/components/Account/AccountWalletSelect.js +5 -12
- package/dist/modal/components/AddFunds/AddFundsContext.js +70 -25
- package/dist/modal/components/AddFunds/AddFundsReceive.js +1 -1
- package/dist/modal/components/AddFunds/AddFundsSettings.js +134 -29
- package/dist/modal/components/AuthInput/hooks/useDropdownPosition.d.ts +1 -1
- package/dist/modal/components/AuthInput/hooks/useDropdownPosition.js +25 -17
- package/dist/modal/components/AuthOptions/AuthOptions.js +1 -1
- package/dist/modal/components/Body/Body.js +4 -0
- package/dist/modal/components/Controls/ChainSelect.js +2 -3
- package/dist/modal/components/ErrorBoundary.d.ts +20 -0
- package/dist/modal/components/ErrorBoundary.js +27 -0
- package/dist/modal/components/ExternalWalletStep/ExternalWalletStep.js +1 -1
- package/dist/modal/components/OnRampComponents/OnRampProviderButton.js +3 -8
- package/dist/modal/components/WalletSelectOld/WalletSelectOld.js +6 -13
- package/dist/modal/components/common.d.ts +10 -1
- package/dist/modal/components/common.js +44 -11
- package/dist/modal/hooks/index.d.ts +1 -0
- package/dist/modal/hooks/index.js +1 -0
- package/dist/modal/hooks/useFarcasterLogin.js +1 -1
- package/dist/modal/hooks/useSendMutations.d.ts +51 -0
- package/dist/modal/hooks/useSendMutations.js +170 -0
- package/dist/modal/hooks/useTelegramLogin.js +1 -1
- package/dist/modal/hooks/useTransactionMonitoring.d.ts +1 -0
- package/dist/modal/hooks/useTransactionMonitoring.js +175 -0
- package/dist/modal/index.d.ts +1 -1
- package/dist/modal/index.js +1 -1
- package/dist/modal/stores/index.d.ts +1 -0
- package/dist/modal/stores/index.js +1 -0
- package/dist/modal/stores/modal/actions.js +0 -1
- package/dist/modal/stores/modal/useModalSessionStore.d.ts +28 -0
- package/dist/modal/stores/modal/useModalSessionStore.js +26 -0
- package/dist/modal/stores/modal/useModalStore.d.ts +2 -3
- package/dist/modal/stores/modal/useModalStore.js +2 -2
- package/dist/modal/utils/onramps.d.ts +61 -0
- package/dist/modal/utils/onramps.js +112 -0
- package/dist/modal/utils/steps.d.ts +4 -2
- package/dist/modal/utils/steps.js +6 -2
- package/dist/provider/hooks/mutations/utils.js +1 -1
- package/dist/provider/hooks/utils/useAutoSessionKeepAlive.js +1 -1
- package/dist/provider/hooks/utils/useEventListeners.js +2 -2
- package/dist/provider/hooks/utils/useModal.d.ts +2 -1
- package/dist/provider/hooks/utils/useModal.js +10 -3
- package/dist/provider/providers/ExternalWalletProvider.js +2 -2
- package/package.json +9 -8
- package/dist/modal/utils/validateOnRampConfig.d.ts +0 -5
- package/dist/modal/utils/validateOnRampConfig.js +0 -32
|
@@ -0,0 +1,51 @@
|
|
|
1
|
+
import { BroadcastTransactionResult, EstimateTransactionResult } from '@getpara/web-sdk';
|
|
2
|
+
import { EstimateTransactionOpts, NetworkDefinition, RpcMetadata, TransactionType } from '@getpara/shared';
|
|
3
|
+
type BroadcastOpts = Omit<NetworkDefinition, 'type'> & {
|
|
4
|
+
userId: string;
|
|
5
|
+
walletId: string;
|
|
6
|
+
walletAddress: string;
|
|
7
|
+
walletType: TransactionType;
|
|
8
|
+
txSerialized: string;
|
|
9
|
+
message?: string;
|
|
10
|
+
txUrlFormat?: string;
|
|
11
|
+
rpc?: RpcMetadata;
|
|
12
|
+
simulateFailure?: boolean;
|
|
13
|
+
};
|
|
14
|
+
export declare function useSendMutations({ estimateOnSuccess, estimateOnError, broadcastOnSuccess, broadcastOnError, }: {
|
|
15
|
+
estimateOnSuccess: (data: EstimateTransactionResult) => void;
|
|
16
|
+
estimateOnError: (error: Error) => void;
|
|
17
|
+
broadcastOnSuccess?: (data: BroadcastTransactionResult) => void;
|
|
18
|
+
broadcastOnError: (error: Error) => void;
|
|
19
|
+
}): {
|
|
20
|
+
estimateMutate: import("@tanstack/react-query").UseMutateFunction<Partial<{
|
|
21
|
+
result: Pick<import("@getpara/shared").CreateTransactionSuccess, "txSerialized" | "message">;
|
|
22
|
+
error: import("@getpara/shared").TransactionError;
|
|
23
|
+
feeAmount: string;
|
|
24
|
+
feeValue: string;
|
|
25
|
+
transferAmount: string;
|
|
26
|
+
transferValue: string;
|
|
27
|
+
}> | null, Error, {
|
|
28
|
+
userId: string;
|
|
29
|
+
walletId: string;
|
|
30
|
+
opts: EstimateTransactionOpts;
|
|
31
|
+
}, unknown>;
|
|
32
|
+
estimateMutateAsync: import("@tanstack/react-query").UseMutateAsyncFunction<Partial<{
|
|
33
|
+
result: Pick<import("@getpara/shared").CreateTransactionSuccess, "txSerialized" | "message">;
|
|
34
|
+
error: import("@getpara/shared").TransactionError;
|
|
35
|
+
feeAmount: string;
|
|
36
|
+
feeValue: string;
|
|
37
|
+
transferAmount: string;
|
|
38
|
+
transferValue: string;
|
|
39
|
+
}> | null, Error, {
|
|
40
|
+
userId: string;
|
|
41
|
+
walletId: string;
|
|
42
|
+
opts: EstimateTransactionOpts;
|
|
43
|
+
}, unknown>;
|
|
44
|
+
broadcastMutate: import("@tanstack/react-query").UseMutateFunction<BroadcastTransactionResult | null, Error, BroadcastOpts, unknown>;
|
|
45
|
+
broadcastMutateAsync: import("@tanstack/react-query").UseMutateAsyncFunction<BroadcastTransactionResult | null, Error, BroadcastOpts, unknown>;
|
|
46
|
+
estimateIsPending: boolean;
|
|
47
|
+
estimateIsError: boolean;
|
|
48
|
+
broadcastIsPending: boolean;
|
|
49
|
+
broadcastIsError: boolean;
|
|
50
|
+
};
|
|
51
|
+
export {};
|
|
@@ -0,0 +1,170 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import {
|
|
3
|
+
__async,
|
|
4
|
+
__spreadProps,
|
|
5
|
+
__spreadValues
|
|
6
|
+
} from "../../chunk-MMUBH76A.js";
|
|
7
|
+
import { useMutation, useQueryClient } from "@tanstack/react-query";
|
|
8
|
+
import { useInternalClient } from "../../provider/hooks/utils/useInternalClient.js";
|
|
9
|
+
import { useModalStore, useModalSessionStore } from "../stores/index.js";
|
|
10
|
+
import { useSignMessage, useSignTransaction, useWalletState } from "../../provider/index.js";
|
|
11
|
+
import {
|
|
12
|
+
hexStringToBase64
|
|
13
|
+
} from "@getpara/web-sdk";
|
|
14
|
+
import { useMemo, useCallback } from "react";
|
|
15
|
+
import { ModalStep } from "../utils/steps.js";
|
|
16
|
+
import { useStore } from "../../provider/stores/useStore.js";
|
|
17
|
+
function useSendMutations({
|
|
18
|
+
estimateOnSuccess,
|
|
19
|
+
estimateOnError,
|
|
20
|
+
broadcastOnSuccess,
|
|
21
|
+
broadcastOnError
|
|
22
|
+
}) {
|
|
23
|
+
const para = useInternalClient();
|
|
24
|
+
const setStep = useModalStore((state) => state.setStep);
|
|
25
|
+
const setSendTx = useModalSessionStore((state) => state.setSendTx);
|
|
26
|
+
const { signTransactionAsync } = useSignTransaction();
|
|
27
|
+
const { signMessageAsync } = useSignMessage();
|
|
28
|
+
const { selectedWallet } = useWalletState();
|
|
29
|
+
const queryClient = useQueryClient();
|
|
30
|
+
const refs = useStore((state) => state.refs);
|
|
31
|
+
const defaultBroadcastOnSuccess = useCallback(
|
|
32
|
+
(data) => {
|
|
33
|
+
if (!!(data == null ? void 0 : data.error)) {
|
|
34
|
+
return;
|
|
35
|
+
} else if (!!data) {
|
|
36
|
+
const currentSendTx = useModalSessionStore.getState().sendTx;
|
|
37
|
+
if (currentSendTx) {
|
|
38
|
+
setSendTx(__spreadProps(__spreadValues({}, currentSendTx), { result: data }));
|
|
39
|
+
}
|
|
40
|
+
setStep(ModalStep.ACCOUNT_MAIN);
|
|
41
|
+
refs.balancesInvalidationTime.current = Date.now();
|
|
42
|
+
queryClient.invalidateQueries({
|
|
43
|
+
queryKey: ["useProfileBalance"],
|
|
44
|
+
refetchType: "active"
|
|
45
|
+
});
|
|
46
|
+
}
|
|
47
|
+
},
|
|
48
|
+
[setSendTx, setStep, queryClient, refs]
|
|
49
|
+
);
|
|
50
|
+
const handleBroadcastSuccess = useCallback(
|
|
51
|
+
(data) => {
|
|
52
|
+
defaultBroadcastOnSuccess(data);
|
|
53
|
+
broadcastOnSuccess == null ? void 0 : broadcastOnSuccess(data);
|
|
54
|
+
},
|
|
55
|
+
[defaultBroadcastOnSuccess, broadcastOnSuccess]
|
|
56
|
+
);
|
|
57
|
+
const {
|
|
58
|
+
mutate: estimateMutate,
|
|
59
|
+
mutateAsync: estimateMutateAsync,
|
|
60
|
+
isPending: estimateIsPending,
|
|
61
|
+
isError: estimateIsError
|
|
62
|
+
} = useMutation({
|
|
63
|
+
mutationKey: ["estimate-tx"],
|
|
64
|
+
mutationFn: (_0) => __async(this, [_0], function* ({ userId, walletId, opts }) {
|
|
65
|
+
if (!para.userId || !selectedWallet.id) {
|
|
66
|
+
return null;
|
|
67
|
+
}
|
|
68
|
+
const result = yield para.ctx.client.estimateSendTransaction({
|
|
69
|
+
userId,
|
|
70
|
+
walletId,
|
|
71
|
+
opts
|
|
72
|
+
});
|
|
73
|
+
return result;
|
|
74
|
+
}),
|
|
75
|
+
onSuccess: (data, variables) => {
|
|
76
|
+
setSendTx(__spreadValues({}, variables));
|
|
77
|
+
estimateOnSuccess(data);
|
|
78
|
+
},
|
|
79
|
+
onError: estimateOnError
|
|
80
|
+
});
|
|
81
|
+
const {
|
|
82
|
+
mutate: broadcastMutate,
|
|
83
|
+
mutateAsync: broadcastMutateAsync,
|
|
84
|
+
isPending: broadcastIsPending,
|
|
85
|
+
isError: broadcastIsError
|
|
86
|
+
} = useMutation({
|
|
87
|
+
mutationKey: ["broadcast-tx"],
|
|
88
|
+
mutationFn: (_0) => __async(this, [_0], function* ({
|
|
89
|
+
userId,
|
|
90
|
+
walletId,
|
|
91
|
+
walletAddress,
|
|
92
|
+
walletType,
|
|
93
|
+
txSerialized,
|
|
94
|
+
message,
|
|
95
|
+
evmChainId,
|
|
96
|
+
isDevnet,
|
|
97
|
+
txUrlFormat,
|
|
98
|
+
rpc,
|
|
99
|
+
simulateFailure
|
|
100
|
+
}) {
|
|
101
|
+
var _a, _b;
|
|
102
|
+
if (!para.userId || !selectedWallet.id) {
|
|
103
|
+
return null;
|
|
104
|
+
}
|
|
105
|
+
let signature;
|
|
106
|
+
switch (walletType) {
|
|
107
|
+
case "SOLANA":
|
|
108
|
+
signature = (_a = yield signMessageAsync({
|
|
109
|
+
walletId,
|
|
110
|
+
messageBase64: message
|
|
111
|
+
})) == null ? void 0 : _a.signature;
|
|
112
|
+
break;
|
|
113
|
+
case "EVM":
|
|
114
|
+
default:
|
|
115
|
+
signature = (_b = yield signTransactionAsync({
|
|
116
|
+
walletId,
|
|
117
|
+
rlpEncodedTxBase64: hexStringToBase64(txSerialized),
|
|
118
|
+
chainId: evmChainId
|
|
119
|
+
})) == null ? void 0 : _b.signature;
|
|
120
|
+
if (!!signature) {
|
|
121
|
+
signature = `0x${signature}`;
|
|
122
|
+
}
|
|
123
|
+
break;
|
|
124
|
+
}
|
|
125
|
+
const result = yield para.ctx.client.broadcastSendTransaction({
|
|
126
|
+
userId,
|
|
127
|
+
walletId,
|
|
128
|
+
opts: {
|
|
129
|
+
type: walletType,
|
|
130
|
+
evmChainId,
|
|
131
|
+
isDevnet,
|
|
132
|
+
tx: txSerialized,
|
|
133
|
+
signature,
|
|
134
|
+
sourceAddress: walletAddress,
|
|
135
|
+
txUrlFormat,
|
|
136
|
+
rpc,
|
|
137
|
+
simulateFailure
|
|
138
|
+
}
|
|
139
|
+
});
|
|
140
|
+
return result;
|
|
141
|
+
}),
|
|
142
|
+
onSuccess: handleBroadcastSuccess,
|
|
143
|
+
onError: broadcastOnError
|
|
144
|
+
});
|
|
145
|
+
return useMemo(
|
|
146
|
+
() => ({
|
|
147
|
+
estimateMutate,
|
|
148
|
+
estimateMutateAsync,
|
|
149
|
+
broadcastMutate,
|
|
150
|
+
broadcastMutateAsync,
|
|
151
|
+
estimateIsPending,
|
|
152
|
+
estimateIsError,
|
|
153
|
+
broadcastIsPending,
|
|
154
|
+
broadcastIsError
|
|
155
|
+
}),
|
|
156
|
+
[
|
|
157
|
+
estimateMutate,
|
|
158
|
+
estimateMutateAsync,
|
|
159
|
+
broadcastMutate,
|
|
160
|
+
broadcastMutateAsync,
|
|
161
|
+
estimateIsPending,
|
|
162
|
+
estimateIsError,
|
|
163
|
+
broadcastIsPending,
|
|
164
|
+
broadcastIsError
|
|
165
|
+
]
|
|
166
|
+
);
|
|
167
|
+
}
|
|
168
|
+
export {
|
|
169
|
+
useSendMutations
|
|
170
|
+
};
|
|
@@ -50,7 +50,7 @@ const useTelegramLogin = ({
|
|
|
50
50
|
if (!!event.data.payload) {
|
|
51
51
|
const authObject = event.data.payload;
|
|
52
52
|
try {
|
|
53
|
-
|
|
53
|
+
onSubmit == null ? void 0 : onSubmit(authObject);
|
|
54
54
|
} catch (e) {
|
|
55
55
|
(_b = (_a = refs.telegramIFrame.current) == null ? void 0 : _a.contentWindow) == null ? void 0 : _b.postMessage({ type: "TELEGRAM_RETRY" }, "*");
|
|
56
56
|
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare function useTransactionMonitoring(): void;
|
|
@@ -0,0 +1,175 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import {
|
|
3
|
+
__objRest,
|
|
4
|
+
__spreadProps,
|
|
5
|
+
__spreadValues
|
|
6
|
+
} from "../../chunk-MMUBH76A.js";
|
|
7
|
+
import { useEffect, useMemo, useRef, useState } from "react";
|
|
8
|
+
import { useInternalClient } from "../../provider/hooks/utils/useInternalClient.js";
|
|
9
|
+
import { useModalStore, useModalSessionStore } from "../stores/index.js";
|
|
10
|
+
import { getBaseUrl } from "@getpara/web-sdk";
|
|
11
|
+
import { useAccount } from "../../provider/index.js";
|
|
12
|
+
import { ModalStep } from "../utils/steps.js";
|
|
13
|
+
import { SESSION_COOKIE_HEADER_NAME } from "@getpara/user-management-client";
|
|
14
|
+
const TRANSACTION_CLEANUP_DELAY_MS = 3e4;
|
|
15
|
+
function useTransactionMonitoring() {
|
|
16
|
+
var _a, _b, _c, _d, _e, _f;
|
|
17
|
+
const sendTx = useModalSessionStore((state) => state.sendTx);
|
|
18
|
+
const setSendTx = useModalSessionStore((state) => state.setSendTx);
|
|
19
|
+
const currentStep = useModalStore((state) => state.step);
|
|
20
|
+
const para = useInternalClient();
|
|
21
|
+
const socketRef = useRef(null);
|
|
22
|
+
const subscribedDataRef = useRef(null);
|
|
23
|
+
const socketIoModuleRef = useRef(null);
|
|
24
|
+
const [isLoadingSocketIo, setIsLoadingSocketIo] = useState(false);
|
|
25
|
+
const {
|
|
26
|
+
embedded: { userId },
|
|
27
|
+
isConnected
|
|
28
|
+
} = useAccount();
|
|
29
|
+
const socketUrl = useMemo(() => {
|
|
30
|
+
var _a2;
|
|
31
|
+
if (!((_a2 = para.ctx) == null ? void 0 : _a2.env)) return null;
|
|
32
|
+
return getBaseUrl(para.ctx.env, "ws");
|
|
33
|
+
}, [(_a = para.ctx) == null ? void 0 : _a.env]);
|
|
34
|
+
useEffect(() => {
|
|
35
|
+
var _a2, _b2, _c2, _d2;
|
|
36
|
+
if (typeof window === "undefined") {
|
|
37
|
+
return;
|
|
38
|
+
}
|
|
39
|
+
const shouldMonitor = isConnected && userId && userId === (sendTx == null ? void 0 : sendTx.userId) && ((_a2 = sendTx == null ? void 0 : sendTx.result) == null ? void 0 : _a2.status) && ((_b2 = sendTx == null ? void 0 : sendTx.result) == null ? void 0 : _b2.txHash) && ((_c2 = sendTx == null ? void 0 : sendTx.result) == null ? void 0 : _c2.network) && socketUrl;
|
|
40
|
+
if (!shouldMonitor) {
|
|
41
|
+
if (socketRef.current) {
|
|
42
|
+
if (subscribedDataRef.current) {
|
|
43
|
+
socketRef.current.emit("tx:unsubscribe", subscribedDataRef.current);
|
|
44
|
+
subscribedDataRef.current = null;
|
|
45
|
+
}
|
|
46
|
+
socketRef.current.disconnect();
|
|
47
|
+
socketRef.current = null;
|
|
48
|
+
}
|
|
49
|
+
if (sendTx && (!isConnected || !userId || userId !== sendTx.userId)) {
|
|
50
|
+
setSendTx(null);
|
|
51
|
+
}
|
|
52
|
+
return;
|
|
53
|
+
}
|
|
54
|
+
const subscribeData = __spreadValues({
|
|
55
|
+
txHash: sendTx.result.txHash
|
|
56
|
+
}, sendTx.result.network);
|
|
57
|
+
if (!socketRef.current && !isLoadingSocketIo) {
|
|
58
|
+
setIsLoadingSocketIo(true);
|
|
59
|
+
import("socket.io-client").then((socketIoModule) => {
|
|
60
|
+
var _a3, _b3;
|
|
61
|
+
socketIoModuleRef.current = socketIoModule;
|
|
62
|
+
const { io } = socketIoModule;
|
|
63
|
+
const sessionCookie = (_a3 = para == null ? void 0 : para.retrieveSessionCookie) == null ? void 0 : _a3.call(para);
|
|
64
|
+
if (!sessionCookie) {
|
|
65
|
+
setIsLoadingSocketIo(false);
|
|
66
|
+
return;
|
|
67
|
+
}
|
|
68
|
+
socketRef.current = io(socketUrl, {
|
|
69
|
+
transports: ["polling", "websocket"],
|
|
70
|
+
reconnection: true,
|
|
71
|
+
reconnectionAttempts: 5,
|
|
72
|
+
reconnectionDelay: 1e3,
|
|
73
|
+
upgrade: true,
|
|
74
|
+
extraHeaders: {
|
|
75
|
+
[SESSION_COOKIE_HEADER_NAME]: sessionCookie
|
|
76
|
+
}
|
|
77
|
+
});
|
|
78
|
+
socketRef.current.on("connect_error", () => {
|
|
79
|
+
var _a4;
|
|
80
|
+
const sendTx2 = useModalSessionStore.getState().sendTx;
|
|
81
|
+
if ((_a4 = sendTx2 == null ? void 0 : sendTx2.result) == null ? void 0 : _a4.explorerUrl) {
|
|
82
|
+
const _b4 = sendTx2.result, { status: _status } = _b4, rest = __objRest(_b4, ["status"]);
|
|
83
|
+
setSendTx(__spreadProps(__spreadValues({}, sendTx2), {
|
|
84
|
+
result: __spreadValues({}, rest)
|
|
85
|
+
}));
|
|
86
|
+
}
|
|
87
|
+
return;
|
|
88
|
+
});
|
|
89
|
+
socketRef.current.on("tx:error", (error) => {
|
|
90
|
+
console.error("Transaction monitoring error:", error);
|
|
91
|
+
});
|
|
92
|
+
if (((_b3 = subscribedDataRef.current) == null ? void 0 : _b3.txHash) !== subscribeData.txHash) {
|
|
93
|
+
socketRef.current.emit("tx:subscribe", subscribeData);
|
|
94
|
+
subscribedDataRef.current = subscribeData;
|
|
95
|
+
}
|
|
96
|
+
socketRef.current.on("tx:status", (status) => {
|
|
97
|
+
if (!status || typeof status !== "object") {
|
|
98
|
+
return;
|
|
99
|
+
}
|
|
100
|
+
if (!status.status || !["PENDING", "CONFIRMED", "FAILED"].includes(status.status)) {
|
|
101
|
+
return;
|
|
102
|
+
}
|
|
103
|
+
if (status.confirmations !== void 0 && (typeof status.confirmations !== "number" || status.confirmations < 0)) {
|
|
104
|
+
return;
|
|
105
|
+
}
|
|
106
|
+
if (status.blockNumber !== void 0 && (typeof status.blockNumber !== "number" || status.blockNumber < 0)) {
|
|
107
|
+
return;
|
|
108
|
+
}
|
|
109
|
+
const currentSendTx = useModalSessionStore.getState().sendTx;
|
|
110
|
+
if (currentSendTx && currentSendTx.userId === para.userId) {
|
|
111
|
+
const updatedSendTx = __spreadProps(__spreadValues({}, currentSendTx), {
|
|
112
|
+
result: __spreadProps(__spreadValues({}, currentSendTx.result), {
|
|
113
|
+
status: __spreadValues({}, status)
|
|
114
|
+
})
|
|
115
|
+
});
|
|
116
|
+
setSendTx(updatedSendTx);
|
|
117
|
+
}
|
|
118
|
+
});
|
|
119
|
+
setIsLoadingSocketIo(false);
|
|
120
|
+
}).catch((err) => {
|
|
121
|
+
console.error("[useTransactionMonitoring] Failed to load socket.io-client:", err);
|
|
122
|
+
setIsLoadingSocketIo(false);
|
|
123
|
+
});
|
|
124
|
+
}
|
|
125
|
+
if (((_d2 = subscribedDataRef.current) == null ? void 0 : _d2.txHash) !== subscribeData.txHash && socketRef.current) {
|
|
126
|
+
socketRef.current.emit("tx:subscribe", subscribeData);
|
|
127
|
+
subscribedDataRef.current = subscribeData;
|
|
128
|
+
}
|
|
129
|
+
return () => {
|
|
130
|
+
var _a3, _b3;
|
|
131
|
+
if (socketRef.current && ((_a3 = subscribedDataRef.current) == null ? void 0 : _a3.txHash) === subscribeData.txHash) {
|
|
132
|
+
socketRef.current.emit("tx:unsubscribe", subscribedDataRef.current);
|
|
133
|
+
subscribedDataRef.current = null;
|
|
134
|
+
if (!((_b3 = sendTx == null ? void 0 : sendTx.result) == null ? void 0 : _b3.status) || !isConnected) {
|
|
135
|
+
socketRef.current.disconnect();
|
|
136
|
+
socketRef.current = null;
|
|
137
|
+
}
|
|
138
|
+
}
|
|
139
|
+
};
|
|
140
|
+
}, [(_b = sendTx == null ? void 0 : sendTx.result) == null ? void 0 : _b.txHash, (_c = sendTx == null ? void 0 : sendTx.result) == null ? void 0 : _c.network, socketUrl, setSendTx, isConnected, userId, isLoadingSocketIo, para]);
|
|
141
|
+
useEffect(() => {
|
|
142
|
+
return () => {
|
|
143
|
+
if (socketRef.current) {
|
|
144
|
+
socketRef.current.disconnect();
|
|
145
|
+
socketRef.current = null;
|
|
146
|
+
}
|
|
147
|
+
};
|
|
148
|
+
}, []);
|
|
149
|
+
useEffect(() => {
|
|
150
|
+
var _a2, _b2, _c2;
|
|
151
|
+
if (typeof window === "undefined") return;
|
|
152
|
+
const status = (_b2 = (_a2 = sendTx == null ? void 0 : sendTx.result) == null ? void 0 : _a2.status) == null ? void 0 : _b2.status;
|
|
153
|
+
const isCompleted = status === "CONFIRMED" || status === "FAILED";
|
|
154
|
+
const isOnAccountOrMonitor = currentStep === ModalStep.ACCOUNT_MAIN || currentStep === ModalStep.ACCOUNT_MONITOR_TX;
|
|
155
|
+
if (isCompleted && sendTx && !isOnAccountOrMonitor) {
|
|
156
|
+
setSendTx(null);
|
|
157
|
+
return;
|
|
158
|
+
}
|
|
159
|
+
if (isCompleted && currentStep === ModalStep.ACCOUNT_MAIN && ((_c2 = sendTx == null ? void 0 : sendTx.result) == null ? void 0 : _c2.txHash)) {
|
|
160
|
+
const txHash = sendTx.result.txHash;
|
|
161
|
+
const timeoutId = setTimeout(() => {
|
|
162
|
+
var _a3, _b3;
|
|
163
|
+
const sessionState = useModalSessionStore.getState();
|
|
164
|
+
const modalState = useModalStore.getState();
|
|
165
|
+
if (((_b3 = (_a3 = sessionState.sendTx) == null ? void 0 : _a3.result) == null ? void 0 : _b3.txHash) === txHash && modalState.step === ModalStep.ACCOUNT_MAIN) {
|
|
166
|
+
setSendTx(null);
|
|
167
|
+
}
|
|
168
|
+
}, TRANSACTION_CLEANUP_DELAY_MS);
|
|
169
|
+
return () => clearTimeout(timeoutId);
|
|
170
|
+
}
|
|
171
|
+
}, [(_e = (_d = sendTx == null ? void 0 : sendTx.result) == null ? void 0 : _d.status) == null ? void 0 : _e.status, (_f = sendTx == null ? void 0 : sendTx.result) == null ? void 0 : _f.txHash, currentStep, setSendTx]);
|
|
172
|
+
}
|
|
173
|
+
export {
|
|
174
|
+
useTransactionMonitoring
|
|
175
|
+
};
|
package/dist/modal/index.d.ts
CHANGED
|
@@ -5,4 +5,4 @@ export { AuthLayout } from './types/modalProps.js';
|
|
|
5
5
|
export * from './utils/openPopup.js';
|
|
6
6
|
export { ON_RAMP_PROVIDERS, ON_RAMP_ASSETS, NETWORKS, getAssetIcon, getAssetCode, getNetworkIcon, getNetworkName, } from '@getpara/react-common';
|
|
7
7
|
export { SaveRecoverySecret } from './components/RecoverySecretStep/RecoverySecretStep.js';
|
|
8
|
-
export * from './utils/
|
|
8
|
+
export * from './utils/onramps.js';
|
package/dist/modal/index.js
CHANGED
|
@@ -14,7 +14,7 @@ import {
|
|
|
14
14
|
getNetworkName
|
|
15
15
|
} from "@getpara/react-common";
|
|
16
16
|
import { SaveRecoverySecret } from "./components/RecoverySecretStep/RecoverySecretStep.js";
|
|
17
|
-
export * from "./utils/
|
|
17
|
+
export * from "./utils/onramps.js";
|
|
18
18
|
export {
|
|
19
19
|
AuthLayout,
|
|
20
20
|
ModalStep,
|
|
@@ -139,7 +139,6 @@ const getActions = (set, get) => ({
|
|
|
139
139
|
setIsPasskeySupported: (isPasskeySupported) => set({ isPasskeySupported }),
|
|
140
140
|
setAccountLinkOptions: (accountLinkOptions) => set({ accountLinkOptions }),
|
|
141
141
|
setProfileWallet: (profileWallet) => set({ profileWallet }),
|
|
142
|
-
setSendTx: (sendTx) => set({ sendTx }),
|
|
143
142
|
setIsTestModeAlertDismissed: (isTestModeAlertDismissed) => set({ isTestModeAlertDismissed })
|
|
144
143
|
});
|
|
145
144
|
export {
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import { BroadcastTransactionResult } from '@getpara/web-sdk';
|
|
2
|
+
import { CreateTransactionOpts } from '@getpara/shared';
|
|
3
|
+
export type SendTx = {
|
|
4
|
+
userId: string;
|
|
5
|
+
walletId: string;
|
|
6
|
+
opts: CreateTransactionOpts;
|
|
7
|
+
transferAmount?: string;
|
|
8
|
+
result?: BroadcastTransactionResult;
|
|
9
|
+
};
|
|
10
|
+
interface ModalSessionState {
|
|
11
|
+
sendTx: SendTx | null;
|
|
12
|
+
}
|
|
13
|
+
interface ModalSessionActions {
|
|
14
|
+
setSendTx: (_: SendTx | null) => void;
|
|
15
|
+
}
|
|
16
|
+
export type ModalSessionStore = ModalSessionState & ModalSessionActions;
|
|
17
|
+
export declare const useModalSessionStore: import("zustand").UseBoundStore<Omit<import("zustand").StoreApi<ModalSessionStore>, "persist"> & {
|
|
18
|
+
persist: {
|
|
19
|
+
setOptions: (options: Partial<import("zustand/middleware").PersistOptions<ModalSessionStore, unknown>>) => void;
|
|
20
|
+
clearStorage: () => void;
|
|
21
|
+
rehydrate: () => Promise<void> | void;
|
|
22
|
+
hasHydrated: () => boolean;
|
|
23
|
+
onHydrate: (fn: (state: ModalSessionStore) => void) => () => void;
|
|
24
|
+
onFinishHydration: (fn: (state: ModalSessionStore) => void) => () => void;
|
|
25
|
+
getOptions: () => Partial<import("zustand/middleware").PersistOptions<ModalSessionStore, unknown>>;
|
|
26
|
+
};
|
|
27
|
+
}>;
|
|
28
|
+
export {};
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import {
|
|
3
|
+
__spreadProps,
|
|
4
|
+
__spreadValues
|
|
5
|
+
} from "../../../chunk-MMUBH76A.js";
|
|
6
|
+
import { create } from "zustand";
|
|
7
|
+
import { persist, createJSONStorage } from "zustand/middleware";
|
|
8
|
+
import { PARA_STORAGE_PREFIX } from "@getpara/core-sdk";
|
|
9
|
+
const DEFAULT_SESSION_STATE = {
|
|
10
|
+
sendTx: null
|
|
11
|
+
};
|
|
12
|
+
const useModalSessionStore = create()(
|
|
13
|
+
persist(
|
|
14
|
+
(set) => __spreadProps(__spreadValues({}, DEFAULT_SESSION_STATE), {
|
|
15
|
+
setSendTx: (sendTx) => set({ sendTx })
|
|
16
|
+
}),
|
|
17
|
+
{
|
|
18
|
+
version: 1,
|
|
19
|
+
name: `${PARA_STORAGE_PREFIX}modalSessionState`,
|
|
20
|
+
storage: createJSONStorage(() => sessionStorage)
|
|
21
|
+
}
|
|
22
|
+
)
|
|
23
|
+
);
|
|
24
|
+
export {
|
|
25
|
+
useModalSessionStore
|
|
26
|
+
};
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { AvailableWallet } from '@getpara/core-sdk';
|
|
2
2
|
import { ModalStep } from '../../utils/steps.js';
|
|
3
|
-
import { AuthStateLogin, AuthStateSignup, AuthState, AuthStateVerify, OnRampConfig as OnRampConfigBase, OnRampPurchase, TWalletType, Setup2faResponse, SupportedAccountLinks
|
|
3
|
+
import { AuthStateLogin, AuthStateSignup, AuthState, AuthStateVerify, OnRampConfig as OnRampConfigBase, OnRampPurchase, TWalletType, Setup2faResponse, SupportedAccountLinks } from '@getpara/web-sdk';
|
|
4
4
|
import { Tab as AddFundsTabType } from '../../components/AddFunds/AddFundsContext.js';
|
|
5
5
|
import { TAuthLayout } from '../../types/modalProps.js';
|
|
6
6
|
import { MutableRefObject } from 'react';
|
|
@@ -57,11 +57,11 @@ interface ModalState {
|
|
|
57
57
|
wasSignedIn: MutableRefObject<boolean | null>;
|
|
58
58
|
initialFarcasterConnected: MutableRefObject<boolean | null>;
|
|
59
59
|
iFrame: MutableRefObject<HTMLIFrameElement | null>;
|
|
60
|
+
modalContainer: MutableRefObject<HTMLElement | null>;
|
|
60
61
|
};
|
|
61
62
|
isPasskeySupported: boolean;
|
|
62
63
|
accountLinkOptions: SupportedAccountLinks;
|
|
63
64
|
profileWallet?: AvailableWallet;
|
|
64
|
-
sendTx: BroadcastTransactionResult | null;
|
|
65
65
|
isTestModeAlertDismissed: boolean;
|
|
66
66
|
}
|
|
67
67
|
export interface ModalActions {
|
|
@@ -102,7 +102,6 @@ export interface ModalActions {
|
|
|
102
102
|
setIsPasskeySupported: (_: boolean) => void;
|
|
103
103
|
setAccountLinkOptions: (_: SupportedAccountLinks) => void;
|
|
104
104
|
setProfileWallet: (_?: AvailableWallet) => void;
|
|
105
|
-
setSendTx: (_: BroadcastTransactionResult | null) => void;
|
|
106
105
|
setIsTestModeAlertDismissed: (_: boolean) => void;
|
|
107
106
|
}
|
|
108
107
|
export type ModalStore = ModalState & ModalActions;
|
|
@@ -45,12 +45,12 @@ const DEFAULT_MODAL_STATE = {
|
|
|
45
45
|
telegramIFrame: createRef(),
|
|
46
46
|
wasSignedIn: createRef(),
|
|
47
47
|
initialFarcasterConnected: createRef(),
|
|
48
|
-
iFrame: createRef()
|
|
48
|
+
iFrame: createRef(),
|
|
49
|
+
modalContainer: createRef()
|
|
49
50
|
},
|
|
50
51
|
isPasskeySupported: true,
|
|
51
52
|
accountLinkOptions: [...LINKED_ACCOUNT_TYPES],
|
|
52
53
|
profileWallet: void 0,
|
|
53
|
-
sendTx: null,
|
|
54
54
|
isTestModeAlertDismissed: false
|
|
55
55
|
};
|
|
56
56
|
const useModalStore = create()(
|
|
@@ -0,0 +1,61 @@
|
|
|
1
|
+
import { OnRampConfig, OnRampProvider, OnRampPurchaseType, TNetwork, TOnRampAsset, TWalletType } from '@getpara/web-sdk';
|
|
2
|
+
export declare class OnRampConfigError extends Error {
|
|
3
|
+
constructor(message: string);
|
|
4
|
+
}
|
|
5
|
+
/**
|
|
6
|
+
* Provider-specific transaction amount limits (in USD).
|
|
7
|
+
* These limits are enforced client-side to prevent users from selecting
|
|
8
|
+
* providers that don't support their desired transaction amount.
|
|
9
|
+
*
|
|
10
|
+
* Last verified: February 2025
|
|
11
|
+
* Sources:
|
|
12
|
+
* - MoonPay: https://support.moonpay.com/customers/docs/moonpay-transaction-limits
|
|
13
|
+
* - Stripe: https://docs.stripe.com/crypto/using-the-dashboard#onramp-minimums-and-maximums
|
|
14
|
+
* - Ramp: https://support.ramp.network/en/articles/471-transaction-limits
|
|
15
|
+
*/
|
|
16
|
+
export declare const PROVIDER_LIMITS: Record<OnRampProvider, Record<OnRampPurchaseType, {
|
|
17
|
+
min: number | null;
|
|
18
|
+
max: number | null;
|
|
19
|
+
}>>;
|
|
20
|
+
export declare function validateOnRampConfig(obj?: OnRampConfig): obj is OnRampConfig;
|
|
21
|
+
/**
|
|
22
|
+
* Gets a default asset and network combination that are guaranteed to work together.
|
|
23
|
+
*
|
|
24
|
+
* When preferredAsset is provided:
|
|
25
|
+
* - Locks in that asset and finds the best compatible network
|
|
26
|
+
* - Returns { asset: preferredAsset, network: <compatible network> }
|
|
27
|
+
*
|
|
28
|
+
* When preferredAsset is not provided:
|
|
29
|
+
* - Finds the best asset+network combination
|
|
30
|
+
* - Priority order:
|
|
31
|
+
* 1. Partner's defaults (if both are valid together)
|
|
32
|
+
* 2. Wallet-type-specific combo (COSMOS→ATOM on COSMOS, SOLANA→SOL on SOLANA, etc.)
|
|
33
|
+
* 3. First valid asset+network combination from available lists
|
|
34
|
+
*
|
|
35
|
+
* @param params - Configuration object
|
|
36
|
+
* @param params.walletType - The wallet type (EVM, SOLANA, COSMOS)
|
|
37
|
+
* @param params.onRampConfig - OnRamp configuration
|
|
38
|
+
* @param params.networks - Available networks (from getOnRampNetworks)
|
|
39
|
+
* @param params.assets - Available assets (from assets calculation)
|
|
40
|
+
* @param params.preferredAsset - Optional asset to lock in (will only find compatible network)
|
|
41
|
+
* @returns Object with asset and network, both null if no valid combination exists
|
|
42
|
+
*/
|
|
43
|
+
export declare function getDefaultAssetAndNetwork({ walletType, onRampConfig, networks, assets, preferredAsset, }: {
|
|
44
|
+
walletType: TWalletType | undefined;
|
|
45
|
+
onRampConfig: OnRampConfig | undefined;
|
|
46
|
+
networks: TNetwork[];
|
|
47
|
+
assets: TOnRampAsset[];
|
|
48
|
+
preferredAsset?: TOnRampAsset | null;
|
|
49
|
+
}): {
|
|
50
|
+
asset: TOnRampAsset | null;
|
|
51
|
+
network: TNetwork | null;
|
|
52
|
+
};
|
|
53
|
+
/**
|
|
54
|
+
* Checks if an amount falls within the provider's limits for a given operation type.
|
|
55
|
+
* @param amount - The amount to check (can be undefined for invalid inputs)
|
|
56
|
+
* @param provider - The provider to check limits for
|
|
57
|
+
* @param type - The transaction type (BUY or SELL)
|
|
58
|
+
* @param limits - Optional provider limits object (defaults to PROVIDER_LIMITS)
|
|
59
|
+
* @returns true if the amount is within limits, false otherwise
|
|
60
|
+
*/
|
|
61
|
+
export declare function isAmountWithinProviderLimits(amount: number | undefined, provider: OnRampProvider, type: OnRampPurchaseType, limits?: typeof PROVIDER_LIMITS): boolean;
|