@reservoir0x/relay-kit-ui
Version:
Relay is the Fastest and Cheapest Way to Bridge and Transact Across Chains.
67 lines • 5.19 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.TransactionsByChain = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = require("react");
const index_js_1 = require("../../../../hooks/index.js");
const index_js_2 = require("../../../primitives/index.js");
const getTxBlockExplorerUrl_js_1 = require("../../../../utils/getTxBlockExplorerUrl.js");
const truncate_js_1 = require("../../../../utils/truncate.js");
const free_solid_svg_icons_1 = require("@fortawesome/free-solid-svg-icons");
const react_fontawesome_1 = require("@fortawesome/react-fontawesome");
const TransactionsByChain = ({ allTxHashes, fromChain, toChain, refundData, isSolverStatusTimeout }) => {
const relayClient = (0, index_js_1.useRelayClient)();
const refundChain = refundData
? relayClient?.chains.find((chain) => chain.id === refundData?.currency?.chainId)
: null;
const txHashesByChain = (0, react_1.useMemo)(() => {
return allTxHashes.reduce((byChains, txHash) => {
if (!byChains[txHash.chainId]) {
byChains[txHash.chainId] = [];
}
byChains[txHash.chainId].push(txHash);
return byChains;
}, {});
}, [allTxHashes, relayClient?.chains]);
const refundTx = allTxHashes.length > 0 ? allTxHashes[allTxHashes.length - 1] : null;
const isSameChain = fromChain?.id === toChain?.id;
const refundTxUrl = refundChain && refundData && refundTx
? (0, getTxBlockExplorerUrl_js_1.getTxBlockExplorerUrl)(refundChain?.id, relayClient?.chains, refundTx.txHash)
: null;
return (isSameChain ? [fromChain] : [fromChain, toChain])
.filter((chain) => {
if (!chain?.id)
return false;
const chainTxs = txHashesByChain[chain.id] || [];
return chainTxs.some((tx) => !tx.isBatchTx);
})
.map((chain, idx) => {
const isRefundChain = refundData && refundChain?.id === chain?.id;
return ((0, jsx_runtime_1.jsxs)(index_js_2.Flex, { justify: "between", children: [(0, jsx_runtime_1.jsxs)(index_js_2.Flex, { css: { alignItems: 'center', gap: '2' }, children: [(0, jsx_runtime_1.jsxs)(index_js_2.Text, { style: "subtitle2", color: "subtle", children: ["View ", chain?.displayName, " Tx"] }), isRefundChain ? ((0, jsx_runtime_1.jsxs)(index_js_2.Pill, { color: "gray", css: {
py: '1',
px: '6px',
display: 'flex',
alignItems: 'center'
}, children: [(0, jsx_runtime_1.jsx)(react_fontawesome_1.FontAwesomeIcon, { icon: free_solid_svg_icons_1.faRotateRight, style: { width: 16, height: 16, marginRight: 4 }, color: "#889096" }), ' ', (0, jsx_runtime_1.jsx)(index_js_2.Text, { style: "subtitle2", children: "Refunded" })] })) : null] }), chain?.id && txHashesByChain[chain.id] && !isRefundChain ? ((0, jsx_runtime_1.jsx)(index_js_2.Flex, { direction: "column", children: txHashesByChain[chain.id].map(({ txHash, chainId, isBatchTx }) => {
const txUrl = (0, getTxBlockExplorerUrl_js_1.getTxBlockExplorerUrl)(chainId, relayClient?.chains, txHash);
return txUrl && !isBatchTx ? ((0, jsx_runtime_1.jsxs)(index_js_2.Anchor, { href: txUrl, target: "_blank", css: {
display: 'flex',
alignItems: 'center',
gap: '2'
}, children: [(0, truncate_js_1.truncateAddress)(txHash), (0, jsx_runtime_1.jsx)(react_fontawesome_1.FontAwesomeIcon, { icon: free_solid_svg_icons_1.faArrowUpRightFromSquare, width: 16 })] }, txHash)) : null;
}) })) : null, refundData && refundTxUrl && isRefundChain ? ((0, jsx_runtime_1.jsx)(index_js_2.Flex, { direction: "column", children: (0, jsx_runtime_1.jsxs)(index_js_2.Anchor, { href: refundTxUrl, target: "_blank", css: {
display: 'flex',
alignItems: 'center',
gap: '2'
}, children: [(0, truncate_js_1.truncateAddress)(refundTx?.txHash), (0, jsx_runtime_1.jsx)(react_fontawesome_1.FontAwesomeIcon, { icon: free_solid_svg_icons_1.faArrowUpRightFromSquare, width: 16 })] }, refundTx?.txHash) })) : null, chain?.id &&
!txHashesByChain[chain.id] &&
!isSolverStatusTimeout &&
!isRefundChain ? ((0, jsx_runtime_1.jsx)(index_js_2.Flex, { direction: "column", children: (0, jsx_runtime_1.jsx)(index_js_2.Text, { color: "red", style: "subtitle2", children: "Order has not been filled" }) })) : null, chain?.id &&
!txHashesByChain[chain.id] &&
isSolverStatusTimeout &&
!refundData &&
!isRefundChain ? ((0, jsx_runtime_1.jsx)(index_js_2.Flex, { direction: "column", children: (0, jsx_runtime_1.jsx)(index_js_2.Skeleton, { css: { height: 20 } }) })) : null] }, idx));
});
};
exports.TransactionsByChain = TransactionsByChain;
//# sourceMappingURL=TransactionsByChain.js.map