@multiversx/sdk-dapp-liquidity 1.1.0-alpha.6 → 1.1.0-alpha.8
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/api/getTransactions.d.ts +8 -2
- package/api/getTransactions.js +22 -3
- package/api/getTransactions.mjs +22 -3
- package/api/tests/getTransactions.spec.js +3 -5
- package/api/tests/getTransactions.spec.mjs +3 -5
- package/package.json +1 -1
- package/reactjs/components/BridgeHistory/BridgeHistory.js +57 -33
- package/reactjs/components/BridgeHistory/BridgeHistory.mjs +57 -33
- package/reactjs/queries/useGetHistory.query.d.ts +7 -1
- package/reactjs/queries/useGetHistory.query.js +23 -3
- package/reactjs/queries/useGetHistory.query.mjs +23 -3
- package/style.css +3 -9
package/api/getTransactions.d.ts
CHANGED
|
@@ -1,7 +1,13 @@
|
|
|
1
|
+
import { ProviderType } from 'types/providerType';
|
|
1
2
|
import { TransactionDTO } from 'dto/Transaction.dto';
|
|
2
3
|
import { AxiosResponse } from 'axios';
|
|
3
4
|
|
|
4
|
-
export declare function getTransactions({ url,
|
|
5
|
+
export declare function getTransactions({ url, address, sender, provider, status, tokenIn, tokenOut }: {
|
|
5
6
|
url: string;
|
|
6
|
-
|
|
7
|
+
address: string;
|
|
8
|
+
sender?: string;
|
|
9
|
+
provider?: ProviderType;
|
|
10
|
+
status?: string;
|
|
11
|
+
tokenIn?: string;
|
|
12
|
+
tokenOut?: string;
|
|
7
13
|
}): Promise<AxiosResponse<TransactionDTO[]>>;
|
package/api/getTransactions.js
CHANGED
|
@@ -4,10 +4,29 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
|
4
4
|
const axios = require("axios");
|
|
5
5
|
async function getTransactions({
|
|
6
6
|
url,
|
|
7
|
-
|
|
7
|
+
address,
|
|
8
|
+
sender,
|
|
9
|
+
provider,
|
|
10
|
+
status,
|
|
11
|
+
tokenIn,
|
|
12
|
+
tokenOut
|
|
8
13
|
}) {
|
|
9
|
-
const
|
|
10
|
-
|
|
14
|
+
const queryParams = new URLSearchParams({
|
|
15
|
+
receiver: address || "",
|
|
16
|
+
sender: sender || "",
|
|
17
|
+
provider: provider || "",
|
|
18
|
+
status: status || "",
|
|
19
|
+
tokenIn: tokenIn || "",
|
|
20
|
+
tokenOut: tokenOut || ""
|
|
21
|
+
});
|
|
22
|
+
for (const [key, value] of queryParams.entries()) {
|
|
23
|
+
if (!value) {
|
|
24
|
+
queryParams.delete(key);
|
|
25
|
+
}
|
|
26
|
+
}
|
|
27
|
+
const queryString = queryParams.toString();
|
|
28
|
+
const endpointWithParams = `/transactions/?${queryString}`;
|
|
29
|
+
return await axios.get(endpointWithParams, {
|
|
11
30
|
baseURL: url
|
|
12
31
|
});
|
|
13
32
|
}
|
package/api/getTransactions.mjs
CHANGED
|
@@ -1,10 +1,29 @@
|
|
|
1
1
|
import axios from "axios";
|
|
2
2
|
async function getTransactions({
|
|
3
3
|
url,
|
|
4
|
-
|
|
4
|
+
address,
|
|
5
|
+
sender,
|
|
6
|
+
provider,
|
|
7
|
+
status,
|
|
8
|
+
tokenIn,
|
|
9
|
+
tokenOut
|
|
5
10
|
}) {
|
|
6
|
-
const
|
|
7
|
-
|
|
11
|
+
const queryParams = new URLSearchParams({
|
|
12
|
+
receiver: address || "",
|
|
13
|
+
sender: sender || "",
|
|
14
|
+
provider: provider || "",
|
|
15
|
+
status: status || "",
|
|
16
|
+
tokenIn: tokenIn || "",
|
|
17
|
+
tokenOut: tokenOut || ""
|
|
18
|
+
});
|
|
19
|
+
for (const [key, value] of queryParams.entries()) {
|
|
20
|
+
if (!value) {
|
|
21
|
+
queryParams.delete(key);
|
|
22
|
+
}
|
|
23
|
+
}
|
|
24
|
+
const queryString = queryParams.toString();
|
|
25
|
+
const endpointWithParams = `/transactions/?${queryString}`;
|
|
26
|
+
return await axios.get(endpointWithParams, {
|
|
8
27
|
baseURL: url
|
|
9
28
|
});
|
|
10
29
|
}
|
|
@@ -8,7 +8,6 @@ const mockedAxios = axios;
|
|
|
8
8
|
describe("getTransactions", () => {
|
|
9
9
|
const url = "https://api.example.com";
|
|
10
10
|
it("fetches transactions without userWalletAddress", async () => {
|
|
11
|
-
const userWalletAddress = "";
|
|
12
11
|
const response = [
|
|
13
12
|
{
|
|
14
13
|
fromChainId: "97",
|
|
@@ -27,7 +26,7 @@ describe("getTransactions", () => {
|
|
|
27
26
|
}
|
|
28
27
|
];
|
|
29
28
|
mockedAxios.get.mockResolvedValue({ data: response });
|
|
30
|
-
const result = await api_getTransactions.getTransactions({ url
|
|
29
|
+
const result = await api_getTransactions.getTransactions({ url });
|
|
31
30
|
expect(mockedAxios.get).toHaveBeenCalledWith("/transactions", {
|
|
32
31
|
baseURL: url
|
|
33
32
|
});
|
|
@@ -53,7 +52,7 @@ describe("getTransactions", () => {
|
|
|
53
52
|
}
|
|
54
53
|
];
|
|
55
54
|
mockedAxios.get.mockResolvedValue({ data: response });
|
|
56
|
-
const result = await api_getTransactions.getTransactions({ url
|
|
55
|
+
const result = await api_getTransactions.getTransactions({ url });
|
|
57
56
|
expect(mockedAxios.get).toHaveBeenCalledWith(
|
|
58
57
|
`/transactions/${userWalletAddress}`,
|
|
59
58
|
{ baseURL: url }
|
|
@@ -81,8 +80,7 @@ describe("getTransactions", () => {
|
|
|
81
80
|
];
|
|
82
81
|
mockedAxios.get.mockResolvedValue({ data: response });
|
|
83
82
|
const result = await api_getTransactions.getTransactions({
|
|
84
|
-
url
|
|
85
|
-
userWalletAddress
|
|
83
|
+
url
|
|
86
84
|
});
|
|
87
85
|
expect(mockedAxios.get).toHaveBeenCalledWith(
|
|
88
86
|
`/transactions/${userWalletAddress}`,
|
|
@@ -6,7 +6,6 @@ const mockedAxios = axios;
|
|
|
6
6
|
describe("getTransactions", () => {
|
|
7
7
|
const url = "https://api.example.com";
|
|
8
8
|
it("fetches transactions without userWalletAddress", async () => {
|
|
9
|
-
const userWalletAddress = "";
|
|
10
9
|
const response = [
|
|
11
10
|
{
|
|
12
11
|
fromChainId: "97",
|
|
@@ -25,7 +24,7 @@ describe("getTransactions", () => {
|
|
|
25
24
|
}
|
|
26
25
|
];
|
|
27
26
|
mockedAxios.get.mockResolvedValue({ data: response });
|
|
28
|
-
const result = await getTransactions({ url
|
|
27
|
+
const result = await getTransactions({ url });
|
|
29
28
|
expect(mockedAxios.get).toHaveBeenCalledWith("/transactions", {
|
|
30
29
|
baseURL: url
|
|
31
30
|
});
|
|
@@ -51,7 +50,7 @@ describe("getTransactions", () => {
|
|
|
51
50
|
}
|
|
52
51
|
];
|
|
53
52
|
mockedAxios.get.mockResolvedValue({ data: response });
|
|
54
|
-
const result = await getTransactions({ url
|
|
53
|
+
const result = await getTransactions({ url });
|
|
55
54
|
expect(mockedAxios.get).toHaveBeenCalledWith(
|
|
56
55
|
`/transactions/${userWalletAddress}`,
|
|
57
56
|
{ baseURL: url }
|
|
@@ -79,8 +78,7 @@ describe("getTransactions", () => {
|
|
|
79
78
|
];
|
|
80
79
|
mockedAxios.get.mockResolvedValue({ data: response });
|
|
81
80
|
const result = await getTransactions({
|
|
82
|
-
url
|
|
83
|
-
userWalletAddress
|
|
81
|
+
url
|
|
84
82
|
});
|
|
85
83
|
expect(mockedAxios.get).toHaveBeenCalledWith(
|
|
86
84
|
`/transactions/${userWalletAddress}`,
|
package/package.json
CHANGED
|
@@ -2,6 +2,8 @@
|
|
|
2
2
|
"use strict";
|
|
3
3
|
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
4
4
|
const jsxRuntime = require("react/jsx-runtime");
|
|
5
|
+
const faArrowDownShortWide = require("@fortawesome/free-solid-svg-icons/faArrowDownShortWide");
|
|
6
|
+
const faArrowUpShortWide = require("@fortawesome/free-solid-svg-icons/faArrowUpShortWide");
|
|
5
7
|
const faCircleCheck = require("@fortawesome/free-solid-svg-icons/faCircleCheck");
|
|
6
8
|
const faCircleXmark = require("@fortawesome/free-solid-svg-icons/faCircleXmark");
|
|
7
9
|
const faClock = require("@fortawesome/free-solid-svg-icons/faClock");
|
|
@@ -11,34 +13,25 @@ const require$$0 = require("react");
|
|
|
11
13
|
const constants_index = require("../../../constants/index.js");
|
|
12
14
|
const types_providerType = require("../../../types/providerType.js");
|
|
13
15
|
const reactjs_context_useWeb3App = require("../../context/useWeb3App.js");
|
|
14
|
-
require("yup");
|
|
15
|
-
require("@multiversx/sdk-dapp-utils/out/helpers/parseAmount");
|
|
16
|
-
require("../../../bignumber-B8vjg9qn.js");
|
|
17
|
-
const reactjs_hooks_useAccount = require("../../hooks/useAccount.js");
|
|
18
|
-
require("formik");
|
|
19
|
-
require("wagmi");
|
|
20
|
-
require("axios");
|
|
21
16
|
const reactjs_hooks_useFetchBridgeData = require("../../hooks/useFetchBridgeData.js");
|
|
22
|
-
require("../../../bitcoin-DHwiZolS.js");
|
|
23
|
-
require("cross-fetch");
|
|
24
|
-
require("viem");
|
|
25
|
-
require("viem/chains");
|
|
26
|
-
require("@tanstack/react-query");
|
|
27
|
-
require("../../constants/index.js");
|
|
28
17
|
const reactjs_queries_useGetHistory_query = require("../../queries/useGetHistory.query.js");
|
|
29
18
|
const reactjs_utils_formatAmount = require("../../utils/formatAmount.js");
|
|
30
19
|
const reactjs_utils_mxClsx = require("../../utils/mxClsx.js");
|
|
31
20
|
const reactjs_components_base_MxButton_MxButton = require("../base/MxButton/MxButton.js");
|
|
32
21
|
const reactjs_components_base_MxCard_MxCard = require("../base/MxCard/MxCard.js");
|
|
33
22
|
const reactjs_components_base_MxLink_MxLink = require("../base/MxLink/MxLink.js");
|
|
23
|
+
require("../base/MxSearch/MxSearch.js");
|
|
24
|
+
require("@headlessui/react");
|
|
25
|
+
const reactjs_components_base_MxTooltip_MxTooltip = require("../base/MxTooltip/MxTooltip.js");
|
|
34
26
|
const ArrowUpRight = "data:image/svg+xml,%3csvg%20width='20'%20height='20'%20viewBox='0%200%2020%2020'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M15%206V13C15%2013.5625%2014.5312%2014%2014%2014C13.4375%2014%2013%2013.5625%2013%2013V8.4375L6.6875%2014.7188C6.3125%2015.125%205.65625%2015.125%205.28125%2014.7188C4.875%2014.3438%204.875%2013.6875%205.28125%2013.3125L11.5625%207H7C6.4375%207%206%206.5625%206%206C6%205.46875%206.4375%205%207%205H14C14.5312%205%2015%205.46875%2015%206Z'%20fill='%23CDD0DB'/%3e%3c/svg%3e";
|
|
35
27
|
const BridgeHistory = ({
|
|
36
28
|
mvxAddress,
|
|
37
29
|
onClose
|
|
38
30
|
}) => {
|
|
39
31
|
const { options } = reactjs_context_useWeb3App.useWeb3App();
|
|
40
|
-
const {
|
|
41
|
-
|
|
32
|
+
const { data, isLoading, isError } = reactjs_queries_useGetHistory_query.useGetHistoryQuery({
|
|
33
|
+
address: mvxAddress
|
|
34
|
+
});
|
|
42
35
|
const resolveTransactionIcon = require$$0.useCallback((transaction) => {
|
|
43
36
|
switch (transaction.status) {
|
|
44
37
|
case "success":
|
|
@@ -188,8 +181,21 @@ const BridgeHistory = ({
|
|
|
188
181
|
children: [
|
|
189
182
|
transaction.statusIcon,
|
|
190
183
|
constants_index.MVX_CHAIN_IDS.includes(Number(transaction.toChainId)) ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
191
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
192
|
-
|
|
184
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
185
|
+
reactjs_components_base_MxTooltip_MxTooltip.MxTooltip,
|
|
186
|
+
{
|
|
187
|
+
placement: "top",
|
|
188
|
+
buttonText: /* @__PURE__ */ jsxRuntime.jsx(
|
|
189
|
+
reactFontawesome.FontAwesomeIcon,
|
|
190
|
+
{
|
|
191
|
+
icon: faArrowDownShortWide.faArrowDownShortWide,
|
|
192
|
+
className: "liq-mx-1 liq-flex liq-items-center"
|
|
193
|
+
}
|
|
194
|
+
),
|
|
195
|
+
children: "Deposit"
|
|
196
|
+
}
|
|
197
|
+
),
|
|
198
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "liq-text-wrap", children: reactjs_utils_formatAmount.formatAmount({
|
|
193
199
|
decimals: (_a = tokensMap[transaction.tokenDestination]) == null ? void 0 : _a.decimals,
|
|
194
200
|
amount: transaction.amountOut,
|
|
195
201
|
addCommas: false,
|
|
@@ -205,7 +211,7 @@ const BridgeHistory = ({
|
|
|
205
211
|
}
|
|
206
212
|
),
|
|
207
213
|
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "liq-whitespace-nowrap", children: "from" }),
|
|
208
|
-
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "liq-
|
|
214
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "liq-text-wrap", children: reactjs_utils_formatAmount.formatAmount({
|
|
209
215
|
decimals: (_d = tokensMap[transaction.tokenSource]) == null ? void 0 : _d.decimals,
|
|
210
216
|
amount: transaction.amountIn,
|
|
211
217
|
addCommas: false,
|
|
@@ -231,8 +237,22 @@ const BridgeHistory = ({
|
|
|
231
237
|
)
|
|
232
238
|
] })
|
|
233
239
|
] }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
234
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
235
|
-
|
|
240
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
241
|
+
reactjs_components_base_MxTooltip_MxTooltip.MxTooltip,
|
|
242
|
+
{
|
|
243
|
+
placement: "top",
|
|
244
|
+
buttonText: /* @__PURE__ */ jsxRuntime.jsx(
|
|
245
|
+
reactFontawesome.FontAwesomeIcon,
|
|
246
|
+
{
|
|
247
|
+
icon: faArrowUpShortWide.faArrowUpShortWide,
|
|
248
|
+
spin: true,
|
|
249
|
+
className: "liq-mx-1 liq-flex liq-items-center"
|
|
250
|
+
}
|
|
251
|
+
),
|
|
252
|
+
children: "Transfer"
|
|
253
|
+
}
|
|
254
|
+
),
|
|
255
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "liq-text-wrap", children: reactjs_utils_formatAmount.formatAmount({
|
|
236
256
|
decimals: (_h = tokensMap[transaction.tokenSource]) == null ? void 0 : _h.decimals,
|
|
237
257
|
amount: transaction.amountIn,
|
|
238
258
|
addCommas: false,
|
|
@@ -248,7 +268,7 @@ const BridgeHistory = ({
|
|
|
248
268
|
}
|
|
249
269
|
),
|
|
250
270
|
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "liq-whitespace-nowrap", children: "to" }),
|
|
251
|
-
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "liq-
|
|
271
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "liq-text-wrap", children: reactjs_utils_formatAmount.formatAmount({
|
|
252
272
|
decimals: (_k = tokensMap[transaction.tokenDestination]) == null ? void 0 : _k.decimals,
|
|
253
273
|
amount: transaction.amountOut,
|
|
254
274
|
addCommas: false,
|
|
@@ -277,24 +297,28 @@ const BridgeHistory = ({
|
|
|
277
297
|
]
|
|
278
298
|
}
|
|
279
299
|
),
|
|
280
|
-
transaction.provider === types_providerType.ProviderType.MultiversxBridge && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "liq-ml-auto liq-mr-0 liq-flex liq-items-center liq-gap-1", children: /* @__PURE__ */ jsxRuntime.
|
|
300
|
+
transaction.provider === types_providerType.ProviderType.MultiversxBridge && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "liq-ml-auto liq-mr-0 liq-flex liq-items-center liq-gap-1", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
281
301
|
reactjs_components_base_MxLink_MxLink.MxLink,
|
|
282
302
|
{
|
|
283
303
|
to: `${options.bridgeURL}/status/${transaction.txHash}`,
|
|
284
304
|
target: "_blank",
|
|
285
305
|
showExternalIcon: false,
|
|
286
306
|
className: "liq-flex",
|
|
287
|
-
children:
|
|
288
|
-
|
|
289
|
-
|
|
290
|
-
"
|
|
291
|
-
|
|
292
|
-
|
|
293
|
-
|
|
294
|
-
|
|
295
|
-
|
|
296
|
-
|
|
297
|
-
|
|
307
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
308
|
+
reactjs_components_base_MxTooltip_MxTooltip.MxTooltip,
|
|
309
|
+
{
|
|
310
|
+
placement: "top",
|
|
311
|
+
buttonText: /* @__PURE__ */ jsxRuntime.jsx(
|
|
312
|
+
"img",
|
|
313
|
+
{
|
|
314
|
+
src: ArrowUpRight,
|
|
315
|
+
alt: "",
|
|
316
|
+
className: "liq-flex liq-items-center liq-justify-center liq-rounded-full liq-text-neutral-200"
|
|
317
|
+
}
|
|
318
|
+
),
|
|
319
|
+
children: "View"
|
|
320
|
+
}
|
|
321
|
+
)
|
|
298
322
|
}
|
|
299
323
|
) })
|
|
300
324
|
] })
|
|
@@ -1,4 +1,6 @@
|
|
|
1
1
|
import { jsx, jsxs, Fragment } from "react/jsx-runtime";
|
|
2
|
+
import { faArrowDownShortWide } from "@fortawesome/free-solid-svg-icons/faArrowDownShortWide";
|
|
3
|
+
import { faArrowUpShortWide } from "@fortawesome/free-solid-svg-icons/faArrowUpShortWide";
|
|
2
4
|
import { faCircleCheck } from "@fortawesome/free-solid-svg-icons/faCircleCheck";
|
|
3
5
|
import { faCircleXmark } from "@fortawesome/free-solid-svg-icons/faCircleXmark";
|
|
4
6
|
import { faClock } from "@fortawesome/free-solid-svg-icons/faClock";
|
|
@@ -8,34 +10,25 @@ import { useCallback, useMemo } from "react";
|
|
|
8
10
|
import { MVX_CHAIN_IDS } from "../../../constants/index.mjs";
|
|
9
11
|
import { ProviderType } from "../../../types/providerType.mjs";
|
|
10
12
|
import { useWeb3App } from "../../context/useWeb3App.mjs";
|
|
11
|
-
import "yup";
|
|
12
|
-
import "@multiversx/sdk-dapp-utils/out/helpers/parseAmount";
|
|
13
|
-
import "../../../bignumber-CKZkoo0g.mjs";
|
|
14
|
-
import { useAccount } from "../../hooks/useAccount.mjs";
|
|
15
|
-
import "formik";
|
|
16
|
-
import "wagmi";
|
|
17
|
-
import "axios";
|
|
18
13
|
import { useFetchBridgeData } from "../../hooks/useFetchBridgeData.mjs";
|
|
19
|
-
import "../../../bitcoin-1SWAuj8n.mjs";
|
|
20
|
-
import "cross-fetch";
|
|
21
|
-
import "viem";
|
|
22
|
-
import "viem/chains";
|
|
23
|
-
import "@tanstack/react-query";
|
|
24
|
-
import "../../constants/index.mjs";
|
|
25
14
|
import { useGetHistoryQuery } from "../../queries/useGetHistory.query.mjs";
|
|
26
15
|
import { formatAmount } from "../../utils/formatAmount.mjs";
|
|
27
16
|
import { mxClsx } from "../../utils/mxClsx.mjs";
|
|
28
17
|
import { MxButton } from "../base/MxButton/MxButton.mjs";
|
|
29
18
|
import { MxCard } from "../base/MxCard/MxCard.mjs";
|
|
30
19
|
import { MxLink } from "../base/MxLink/MxLink.mjs";
|
|
20
|
+
import "../base/MxSearch/MxSearch.mjs";
|
|
21
|
+
import "@headlessui/react";
|
|
22
|
+
import { MxTooltip } from "../base/MxTooltip/MxTooltip.mjs";
|
|
31
23
|
const ArrowUpRight = "data:image/svg+xml,%3csvg%20width='20'%20height='20'%20viewBox='0%200%2020%2020'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M15%206V13C15%2013.5625%2014.5312%2014%2014%2014C13.4375%2014%2013%2013.5625%2013%2013V8.4375L6.6875%2014.7188C6.3125%2015.125%205.65625%2015.125%205.28125%2014.7188C4.875%2014.3438%204.875%2013.6875%205.28125%2013.3125L11.5625%207H7C6.4375%207%206%206.5625%206%206C6%205.46875%206.4375%205%207%205H14C14.5312%205%2015%205.46875%2015%206Z'%20fill='%23CDD0DB'/%3e%3c/svg%3e";
|
|
32
24
|
const BridgeHistory = ({
|
|
33
25
|
mvxAddress,
|
|
34
26
|
onClose
|
|
35
27
|
}) => {
|
|
36
28
|
const { options } = useWeb3App();
|
|
37
|
-
const {
|
|
38
|
-
|
|
29
|
+
const { data, isLoading, isError } = useGetHistoryQuery({
|
|
30
|
+
address: mvxAddress
|
|
31
|
+
});
|
|
39
32
|
const resolveTransactionIcon = useCallback((transaction) => {
|
|
40
33
|
switch (transaction.status) {
|
|
41
34
|
case "success":
|
|
@@ -185,8 +178,21 @@ const BridgeHistory = ({
|
|
|
185
178
|
children: [
|
|
186
179
|
transaction.statusIcon,
|
|
187
180
|
MVX_CHAIN_IDS.includes(Number(transaction.toChainId)) ? /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
188
|
-
/* @__PURE__ */ jsx(
|
|
189
|
-
|
|
181
|
+
/* @__PURE__ */ jsx(
|
|
182
|
+
MxTooltip,
|
|
183
|
+
{
|
|
184
|
+
placement: "top",
|
|
185
|
+
buttonText: /* @__PURE__ */ jsx(
|
|
186
|
+
FontAwesomeIcon,
|
|
187
|
+
{
|
|
188
|
+
icon: faArrowDownShortWide,
|
|
189
|
+
className: "liq-mx-1 liq-flex liq-items-center"
|
|
190
|
+
}
|
|
191
|
+
),
|
|
192
|
+
children: "Deposit"
|
|
193
|
+
}
|
|
194
|
+
),
|
|
195
|
+
/* @__PURE__ */ jsx("span", { className: "liq-text-wrap", children: formatAmount({
|
|
190
196
|
decimals: (_a = tokensMap[transaction.tokenDestination]) == null ? void 0 : _a.decimals,
|
|
191
197
|
amount: transaction.amountOut,
|
|
192
198
|
addCommas: false,
|
|
@@ -202,7 +208,7 @@ const BridgeHistory = ({
|
|
|
202
208
|
}
|
|
203
209
|
),
|
|
204
210
|
/* @__PURE__ */ jsx("span", { className: "liq-whitespace-nowrap", children: "from" }),
|
|
205
|
-
/* @__PURE__ */ jsx("span", { className: "liq-
|
|
211
|
+
/* @__PURE__ */ jsx("span", { className: "liq-text-wrap", children: formatAmount({
|
|
206
212
|
decimals: (_d = tokensMap[transaction.tokenSource]) == null ? void 0 : _d.decimals,
|
|
207
213
|
amount: transaction.amountIn,
|
|
208
214
|
addCommas: false,
|
|
@@ -228,8 +234,22 @@ const BridgeHistory = ({
|
|
|
228
234
|
)
|
|
229
235
|
] })
|
|
230
236
|
] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
231
|
-
/* @__PURE__ */ jsx(
|
|
232
|
-
|
|
237
|
+
/* @__PURE__ */ jsx(
|
|
238
|
+
MxTooltip,
|
|
239
|
+
{
|
|
240
|
+
placement: "top",
|
|
241
|
+
buttonText: /* @__PURE__ */ jsx(
|
|
242
|
+
FontAwesomeIcon,
|
|
243
|
+
{
|
|
244
|
+
icon: faArrowUpShortWide,
|
|
245
|
+
spin: true,
|
|
246
|
+
className: "liq-mx-1 liq-flex liq-items-center"
|
|
247
|
+
}
|
|
248
|
+
),
|
|
249
|
+
children: "Transfer"
|
|
250
|
+
}
|
|
251
|
+
),
|
|
252
|
+
/* @__PURE__ */ jsx("span", { className: "liq-text-wrap", children: formatAmount({
|
|
233
253
|
decimals: (_h = tokensMap[transaction.tokenSource]) == null ? void 0 : _h.decimals,
|
|
234
254
|
amount: transaction.amountIn,
|
|
235
255
|
addCommas: false,
|
|
@@ -245,7 +265,7 @@ const BridgeHistory = ({
|
|
|
245
265
|
}
|
|
246
266
|
),
|
|
247
267
|
/* @__PURE__ */ jsx("span", { className: "liq-whitespace-nowrap", children: "to" }),
|
|
248
|
-
/* @__PURE__ */ jsx("span", { className: "liq-
|
|
268
|
+
/* @__PURE__ */ jsx("span", { className: "liq-text-wrap", children: formatAmount({
|
|
249
269
|
decimals: (_k = tokensMap[transaction.tokenDestination]) == null ? void 0 : _k.decimals,
|
|
250
270
|
amount: transaction.amountOut,
|
|
251
271
|
addCommas: false,
|
|
@@ -274,24 +294,28 @@ const BridgeHistory = ({
|
|
|
274
294
|
]
|
|
275
295
|
}
|
|
276
296
|
),
|
|
277
|
-
transaction.provider === ProviderType.MultiversxBridge && /* @__PURE__ */ jsx("div", { className: "liq-ml-auto liq-mr-0 liq-flex liq-items-center liq-gap-1", children: /* @__PURE__ */
|
|
297
|
+
transaction.provider === ProviderType.MultiversxBridge && /* @__PURE__ */ jsx("div", { className: "liq-ml-auto liq-mr-0 liq-flex liq-items-center liq-gap-1", children: /* @__PURE__ */ jsx(
|
|
278
298
|
MxLink,
|
|
279
299
|
{
|
|
280
300
|
to: `${options.bridgeURL}/status/${transaction.txHash}`,
|
|
281
301
|
target: "_blank",
|
|
282
302
|
showExternalIcon: false,
|
|
283
303
|
className: "liq-flex",
|
|
284
|
-
children:
|
|
285
|
-
|
|
286
|
-
|
|
287
|
-
"
|
|
288
|
-
|
|
289
|
-
|
|
290
|
-
|
|
291
|
-
|
|
292
|
-
|
|
293
|
-
|
|
294
|
-
|
|
304
|
+
children: /* @__PURE__ */ jsx(
|
|
305
|
+
MxTooltip,
|
|
306
|
+
{
|
|
307
|
+
placement: "top",
|
|
308
|
+
buttonText: /* @__PURE__ */ jsx(
|
|
309
|
+
"img",
|
|
310
|
+
{
|
|
311
|
+
src: ArrowUpRight,
|
|
312
|
+
alt: "",
|
|
313
|
+
className: "liq-flex liq-items-center liq-justify-center liq-rounded-full liq-text-neutral-200"
|
|
314
|
+
}
|
|
315
|
+
),
|
|
316
|
+
children: "View"
|
|
317
|
+
}
|
|
318
|
+
)
|
|
295
319
|
}
|
|
296
320
|
) })
|
|
297
321
|
] })
|
|
@@ -1,6 +1,12 @@
|
|
|
1
|
+
import { ProviderType } from 'types/providerType';
|
|
1
2
|
import { AxiosError } from 'axios';
|
|
2
3
|
|
|
3
|
-
export declare const useGetHistoryQuery: ({ address }: {
|
|
4
|
+
export declare const useGetHistoryQuery: ({ address, sender, provider, status, tokenIn, tokenOut }: {
|
|
4
5
|
address?: string;
|
|
6
|
+
sender?: string;
|
|
7
|
+
provider?: ProviderType;
|
|
8
|
+
status?: string;
|
|
9
|
+
tokenIn?: string;
|
|
10
|
+
tokenOut?: string;
|
|
5
11
|
}) => import('@tanstack/react-query').UseQueryResult<import('../..').TransactionDTO[], AxiosError<unknown, any>>;
|
|
6
12
|
export declare const invalidateHistoryQuery: () => void;
|
|
@@ -5,7 +5,14 @@ const reactQuery = require("@tanstack/react-query");
|
|
|
5
5
|
const api_getTransactions = require("../../api/getTransactions.js");
|
|
6
6
|
const helpers_getApiURL = require("../../helpers/getApiURL.js");
|
|
7
7
|
const reactjs_context_queryClient = require("../context/queryClient.js");
|
|
8
|
-
const useGetHistoryQuery = ({
|
|
8
|
+
const useGetHistoryQuery = ({
|
|
9
|
+
address,
|
|
10
|
+
sender,
|
|
11
|
+
provider,
|
|
12
|
+
status,
|
|
13
|
+
tokenIn,
|
|
14
|
+
tokenOut
|
|
15
|
+
}) => {
|
|
9
16
|
const queryFn = async () => {
|
|
10
17
|
if (!address) {
|
|
11
18
|
throw new Error("User is not connected");
|
|
@@ -13,7 +20,12 @@ const useGetHistoryQuery = ({ address }) => {
|
|
|
13
20
|
try {
|
|
14
21
|
const { data } = await api_getTransactions.getTransactions({
|
|
15
22
|
url: helpers_getApiURL.getApiURL(),
|
|
16
|
-
|
|
23
|
+
address,
|
|
24
|
+
sender,
|
|
25
|
+
provider,
|
|
26
|
+
status,
|
|
27
|
+
tokenIn,
|
|
28
|
+
tokenOut
|
|
17
29
|
});
|
|
18
30
|
return data;
|
|
19
31
|
} catch (error) {
|
|
@@ -25,7 +37,15 @@ const useGetHistoryQuery = ({ address }) => {
|
|
|
25
37
|
return ((_a = error.response) == null ? void 0 : _a.status) === 404;
|
|
26
38
|
};
|
|
27
39
|
return reactQuery.useQuery({
|
|
28
|
-
queryKey: [
|
|
40
|
+
queryKey: [
|
|
41
|
+
"user-history",
|
|
42
|
+
address,
|
|
43
|
+
sender,
|
|
44
|
+
provider,
|
|
45
|
+
status,
|
|
46
|
+
tokenIn,
|
|
47
|
+
tokenOut
|
|
48
|
+
],
|
|
29
49
|
queryFn,
|
|
30
50
|
retry,
|
|
31
51
|
enabled: Boolean(address),
|
|
@@ -2,7 +2,14 @@ import { useQuery } from "@tanstack/react-query";
|
|
|
2
2
|
import { getTransactions } from "../../api/getTransactions.mjs";
|
|
3
3
|
import { getApiURL } from "../../helpers/getApiURL.mjs";
|
|
4
4
|
import { getQueryClient } from "../context/queryClient.mjs";
|
|
5
|
-
const useGetHistoryQuery = ({
|
|
5
|
+
const useGetHistoryQuery = ({
|
|
6
|
+
address,
|
|
7
|
+
sender,
|
|
8
|
+
provider,
|
|
9
|
+
status,
|
|
10
|
+
tokenIn,
|
|
11
|
+
tokenOut
|
|
12
|
+
}) => {
|
|
6
13
|
const queryFn = async () => {
|
|
7
14
|
if (!address) {
|
|
8
15
|
throw new Error("User is not connected");
|
|
@@ -10,7 +17,12 @@ const useGetHistoryQuery = ({ address }) => {
|
|
|
10
17
|
try {
|
|
11
18
|
const { data } = await getTransactions({
|
|
12
19
|
url: getApiURL(),
|
|
13
|
-
|
|
20
|
+
address,
|
|
21
|
+
sender,
|
|
22
|
+
provider,
|
|
23
|
+
status,
|
|
24
|
+
tokenIn,
|
|
25
|
+
tokenOut
|
|
14
26
|
});
|
|
15
27
|
return data;
|
|
16
28
|
} catch (error) {
|
|
@@ -22,7 +34,15 @@ const useGetHistoryQuery = ({ address }) => {
|
|
|
22
34
|
return ((_a = error.response) == null ? void 0 : _a.status) === 404;
|
|
23
35
|
};
|
|
24
36
|
return useQuery({
|
|
25
|
-
queryKey: [
|
|
37
|
+
queryKey: [
|
|
38
|
+
"user-history",
|
|
39
|
+
address,
|
|
40
|
+
sender,
|
|
41
|
+
provider,
|
|
42
|
+
status,
|
|
43
|
+
tokenIn,
|
|
44
|
+
tokenOut
|
|
45
|
+
],
|
|
26
46
|
queryFn,
|
|
27
47
|
retry,
|
|
28
48
|
enabled: Boolean(address),
|
package/style.css
CHANGED
|
@@ -870,12 +870,12 @@ video {
|
|
|
870
870
|
text-overflow: ellipsis;
|
|
871
871
|
white-space: nowrap;
|
|
872
872
|
}
|
|
873
|
-
.liq-text-ellipsis{
|
|
874
|
-
text-overflow: ellipsis;
|
|
875
|
-
}
|
|
876
873
|
.liq-whitespace-nowrap{
|
|
877
874
|
white-space: nowrap;
|
|
878
875
|
}
|
|
876
|
+
.liq-text-wrap{
|
|
877
|
+
text-wrap: wrap;
|
|
878
|
+
}
|
|
879
879
|
.\!liq-rounded-lg{
|
|
880
880
|
border-radius: 0.5rem !important;
|
|
881
881
|
}
|
|
@@ -2168,12 +2168,6 @@ video {
|
|
|
2168
2168
|
--tw-text-opacity: 1;
|
|
2169
2169
|
color: rgb(238 238 241 / var(--tw-text-opacity, 1));
|
|
2170
2170
|
}
|
|
2171
|
-
@media not all and (min-width: 640px){
|
|
2172
|
-
|
|
2173
|
-
.max-sm\:liq-hidden{
|
|
2174
|
-
display: none;
|
|
2175
|
-
}
|
|
2176
|
-
}
|
|
2177
2171
|
@media (min-width: 640px){
|
|
2178
2172
|
|
|
2179
2173
|
.sm\:liq-pb-6{
|