mirror of
https://github.com/comit-network/xmr-btc-swap.git
synced 2025-12-20 19:06:43 -05:00
wip: WithdrawDialog migrated to Tauri IPC
This commit is contained in:
binarybaron
parent
47821cbe79
commit
3d16ff6d5c
118 changed files with 1779 additions and 1868 deletions
|
|
@ -1,7 +1,7 @@
|
|||
import { Button } from '@material-ui/core';
|
||||
import Alert from '@material-ui/lab/Alert';
|
||||
import { useNavigate } from 'react-router-dom';
|
||||
import { useAppSelector } from 'store/hooks';
|
||||
import { Button } from "@material-ui/core";
|
||||
import Alert from "@material-ui/lab/Alert";
|
||||
import { useNavigate } from "react-router-dom";
|
||||
import { useAppSelector } from "store/hooks";
|
||||
|
||||
export default function FundsLeftInWalletAlert() {
|
||||
const fundsLeft = useAppSelector((state) => state.rpc.state.balance);
|
||||
|
|
@ -16,7 +16,7 @@ export default function FundsLeftInWalletAlert() {
|
|||
<Button
|
||||
color="inherit"
|
||||
size="small"
|
||||
onClick={() => navigate('/wallet')}
|
||||
onClick={() => navigate("/wallet")}
|
||||
>
|
||||
View
|
||||
</Button>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
import { Alert } from '@material-ui/lab';
|
||||
import { Box, LinearProgress } from '@material-ui/core';
|
||||
import { useAppSelector } from 'store/hooks';
|
||||
import { Alert } from "@material-ui/lab";
|
||||
import { Box, LinearProgress } from "@material-ui/core";
|
||||
import { useAppSelector } from "store/hooks";
|
||||
|
||||
export default function MoneroWalletRpcUpdatingAlert() {
|
||||
const updateState = useAppSelector(
|
||||
|
|
@ -17,7 +17,7 @@ export default function MoneroWalletRpcUpdatingAlert() {
|
|||
|
||||
return (
|
||||
<Alert severity="info">
|
||||
<Box style={{ display: 'flex', flexDirection: 'column', gap: '0.5rem' }}>
|
||||
<Box style={{ display: "flex", flexDirection: "column", gap: "0.5rem" }}>
|
||||
<span>The Monero wallet is updating. This may take a few moments</span>
|
||||
<LinearProgress
|
||||
variant="determinate"
|
||||
|
|
|
|||
|
|
@ -1,8 +1,8 @@
|
|||
import { Alert } from '@material-ui/lab';
|
||||
import { Box, makeStyles } from '@material-ui/core';
|
||||
import { useAppSelector } from 'store/hooks';
|
||||
import WalletRefreshButton from '../pages/wallet/WalletRefreshButton';
|
||||
import { SatsAmount } from '../other/Units';
|
||||
import { Alert } from "@material-ui/lab";
|
||||
import { Box, makeStyles } from "@material-ui/core";
|
||||
import { useAppSelector } from "store/hooks";
|
||||
import WalletRefreshButton from "../pages/wallet/WalletRefreshButton";
|
||||
import { SatsAmount } from "../other/Units";
|
||||
|
||||
const useStyles = makeStyles((theme) => ({
|
||||
outer: {
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
import { Alert } from '@material-ui/lab';
|
||||
import { CircularProgress } from '@material-ui/core';
|
||||
import { useAppSelector } from 'store/hooks';
|
||||
import { RpcProcessStateType } from 'models/rpcModel';
|
||||
import { Alert } from "@material-ui/lab";
|
||||
import { CircularProgress } from "@material-ui/core";
|
||||
import { useAppSelector } from "store/hooks";
|
||||
import { RpcProcessStateType } from "models/rpcModel";
|
||||
|
||||
export default function RpcStatusAlert() {
|
||||
const rpcProcess = useAppSelector((s) => s.rpc.process);
|
||||
|
|
|
|||
|
|
@ -2,102 +2,96 @@ import { makeStyles } from "@material-ui/core";
|
|||
import { Alert, AlertTitle } from "@material-ui/lab";
|
||||
import { useActiveSwapInfo } from "store/hooks";
|
||||
import {
|
||||
isSwapTimelockInfoCancelled,
|
||||
isSwapTimelockInfoNone,
|
||||
isSwapTimelockInfoCancelled,
|
||||
isSwapTimelockInfoNone,
|
||||
} from "models/rpcModel";
|
||||
import HumanizedBitcoinBlockDuration from "../other/HumanizedBitcoinBlockDuration";
|
||||
|
||||
const useStyles = makeStyles((theme) => ({
|
||||
outer: {
|
||||
marginBottom: theme.spacing(1),
|
||||
},
|
||||
list: {
|
||||
margin: theme.spacing(0.25),
|
||||
},
|
||||
outer: {
|
||||
marginBottom: theme.spacing(1),
|
||||
},
|
||||
list: {
|
||||
margin: theme.spacing(0.25),
|
||||
},
|
||||
}));
|
||||
|
||||
export default function SwapMightBeCancelledAlert({
|
||||
bobBtcLockTxConfirmations,
|
||||
bobBtcLockTxConfirmations,
|
||||
}: {
|
||||
bobBtcLockTxConfirmations: number;
|
||||
bobBtcLockTxConfirmations: number;
|
||||
}) {
|
||||
const classes = useStyles();
|
||||
const swap = useActiveSwapInfo();
|
||||
const classes = useStyles();
|
||||
const swap = useActiveSwapInfo();
|
||||
|
||||
if (
|
||||
bobBtcLockTxConfirmations < 5 ||
|
||||
swap === null ||
|
||||
swap.timelock === null
|
||||
) {
|
||||
return <></>;
|
||||
}
|
||||
if (
|
||||
bobBtcLockTxConfirmations < 5 ||
|
||||
swap === null ||
|
||||
swap.timelock === null
|
||||
) {
|
||||
return <></>;
|
||||
}
|
||||
|
||||
const { timelock } = swap;
|
||||
const punishTimelockOffset = swap.punish_timelock;
|
||||
const { timelock } = swap;
|
||||
const punishTimelockOffset = swap.punish_timelock;
|
||||
|
||||
return (
|
||||
<Alert severity="warning" className={classes.outer} variant="filled">
|
||||
<AlertTitle>Be careful!</AlertTitle>
|
||||
The swap provider has taken a long time to lock their Monero. This
|
||||
might mean that:
|
||||
<ul className={classes.list}>
|
||||
<li>
|
||||
There is a technical issue that prevents them from locking
|
||||
their funds
|
||||
</li>
|
||||
<li>They are a malicious actor (unlikely)</li>
|
||||
</ul>
|
||||
<br />
|
||||
There is still hope for the swap to be successful but you have to be
|
||||
extra careful. Regardless of why it has taken them so long, it is
|
||||
important that you refund the swap within the required time period
|
||||
if the swap is not completed. If you fail to to do so, you will be
|
||||
punished and lose your money.
|
||||
<ul className={classes.list}>
|
||||
{isSwapTimelockInfoNone(timelock) && (
|
||||
<>
|
||||
<li>
|
||||
<strong>
|
||||
You will be able to refund in about{" "}
|
||||
<HumanizedBitcoinBlockDuration
|
||||
blocks={timelock.None.blocks_left}
|
||||
/>
|
||||
</strong>
|
||||
</li>
|
||||
return (
|
||||
<Alert severity="warning" className={classes.outer} variant="filled">
|
||||
<AlertTitle>Be careful!</AlertTitle>
|
||||
The swap provider has taken a long time to lock their Monero. This might
|
||||
mean that:
|
||||
<ul className={classes.list}>
|
||||
<li>
|
||||
There is a technical issue that prevents them from locking their funds
|
||||
</li>
|
||||
<li>They are a malicious actor (unlikely)</li>
|
||||
</ul>
|
||||
<br />
|
||||
There is still hope for the swap to be successful but you have to be extra
|
||||
careful. Regardless of why it has taken them so long, it is important that
|
||||
you refund the swap within the required time period if the swap is not
|
||||
completed. If you fail to to do so, you will be punished and lose your
|
||||
money.
|
||||
<ul className={classes.list}>
|
||||
{isSwapTimelockInfoNone(timelock) && (
|
||||
<>
|
||||
<li>
|
||||
<strong>
|
||||
You will be able to refund in about{" "}
|
||||
<HumanizedBitcoinBlockDuration
|
||||
blocks={timelock.None.blocks_left}
|
||||
/>
|
||||
</strong>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<strong>
|
||||
If you have not refunded or completed the swap
|
||||
in about{" "}
|
||||
<HumanizedBitcoinBlockDuration
|
||||
blocks={
|
||||
timelock.None.blocks_left +
|
||||
punishTimelockOffset
|
||||
}
|
||||
/>
|
||||
, you will lose your funds.
|
||||
</strong>
|
||||
</li>
|
||||
</>
|
||||
)}
|
||||
{isSwapTimelockInfoCancelled(timelock) && (
|
||||
<li>
|
||||
<strong>
|
||||
If you have not refunded or completed the swap in
|
||||
about{" "}
|
||||
<HumanizedBitcoinBlockDuration
|
||||
blocks={timelock.Cancel.blocks_left}
|
||||
/>
|
||||
, you will lose your funds.
|
||||
</strong>
|
||||
</li>
|
||||
)}
|
||||
<li>
|
||||
As long as you see this screen, the swap will be refunded
|
||||
automatically when the time comes. If this fails, you have
|
||||
to manually refund by navigating to the History page.
|
||||
</li>
|
||||
</ul>
|
||||
</Alert>
|
||||
);
|
||||
<li>
|
||||
<strong>
|
||||
If you have not refunded or completed the swap in about{" "}
|
||||
<HumanizedBitcoinBlockDuration
|
||||
blocks={timelock.None.blocks_left + punishTimelockOffset}
|
||||
/>
|
||||
, you will lose your funds.
|
||||
</strong>
|
||||
</li>
|
||||
</>
|
||||
)}
|
||||
{isSwapTimelockInfoCancelled(timelock) && (
|
||||
<li>
|
||||
<strong>
|
||||
If you have not refunded or completed the swap in about{" "}
|
||||
<HumanizedBitcoinBlockDuration
|
||||
blocks={timelock.Cancel.blocks_left}
|
||||
/>
|
||||
, you will lose your funds.
|
||||
</strong>
|
||||
</li>
|
||||
)}
|
||||
<li>
|
||||
As long as you see this screen, the swap will be refunded
|
||||
automatically when the time comes. If this fails, you have to manually
|
||||
refund by navigating to the History page.
|
||||
</li>
|
||||
</ul>
|
||||
</Alert>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -3,33 +3,33 @@ import { Box, makeStyles } from "@material-ui/core";
|
|||
import { ReactNode } from "react";
|
||||
import { exhaustiveGuard } from "utils/typescriptUtils";
|
||||
import {
|
||||
SwapCancelRefundButton,
|
||||
SwapResumeButton,
|
||||
SwapCancelRefundButton,
|
||||
SwapResumeButton,
|
||||
} from "../pages/history/table/HistoryRowActions";
|
||||
import HumanizedBitcoinBlockDuration from "../other/HumanizedBitcoinBlockDuration";
|
||||
import {
|
||||
GetSwapInfoResponse,
|
||||
GetSwapInfoResponseRunningSwap,
|
||||
isGetSwapInfoResponseRunningSwap,
|
||||
isSwapTimelockInfoCancelled,
|
||||
isSwapTimelockInfoNone,
|
||||
isSwapTimelockInfoPunished,
|
||||
SwapStateName,
|
||||
SwapTimelockInfoCancelled,
|
||||
SwapTimelockInfoNone,
|
||||
GetSwapInfoResponse,
|
||||
GetSwapInfoResponseRunningSwap,
|
||||
isGetSwapInfoResponseRunningSwap,
|
||||
isSwapTimelockInfoCancelled,
|
||||
isSwapTimelockInfoNone,
|
||||
isSwapTimelockInfoPunished,
|
||||
SwapStateName,
|
||||
SwapTimelockInfoCancelled,
|
||||
SwapTimelockInfoNone,
|
||||
} from "../../../models/rpcModel";
|
||||
import { SwapMoneroRecoveryButton } from "../pages/history/table/SwapMoneroRecoveryButton";
|
||||
|
||||
const useStyles = makeStyles({
|
||||
box: {
|
||||
display: "flex",
|
||||
flexDirection: "column",
|
||||
gap: "0.5rem",
|
||||
},
|
||||
list: {
|
||||
padding: "0px",
|
||||
margin: "0px",
|
||||
},
|
||||
box: {
|
||||
display: "flex",
|
||||
flexDirection: "column",
|
||||
gap: "0.5rem",
|
||||
},
|
||||
list: {
|
||||
padding: "0px",
|
||||
margin: "0px",
|
||||
},
|
||||
});
|
||||
|
||||
/**
|
||||
|
|
@ -38,15 +38,15 @@ const useStyles = makeStyles({
|
|||
* @returns JSX.Element
|
||||
*/
|
||||
const MessageList = ({ messages }: { messages: ReactNode[] }) => {
|
||||
const classes = useStyles();
|
||||
return (
|
||||
<ul className={classes.list}>
|
||||
{messages.map((msg, i) => (
|
||||
// eslint-disable-next-line react/no-array-index-key
|
||||
<li key={i}>{msg}</li>
|
||||
))}
|
||||
</ul>
|
||||
);
|
||||
const classes = useStyles();
|
||||
return (
|
||||
<ul className={classes.list}>
|
||||
{messages.map((msg, i) => (
|
||||
// eslint-disable-next-line react/no-array-index-key
|
||||
<li key={i}>{msg}</li>
|
||||
))}
|
||||
</ul>
|
||||
);
|
||||
};
|
||||
|
||||
/**
|
||||
|
|
@ -55,24 +55,20 @@ const MessageList = ({ messages }: { messages: ReactNode[] }) => {
|
|||
* @returns JSX.Element
|
||||
*/
|
||||
const BitcoinRedeemedStateAlert = ({ swap }: { swap: GetSwapInfoResponse }) => {
|
||||
const classes = useStyles();
|
||||
return (
|
||||
<Box className={classes.box}>
|
||||
<MessageList
|
||||
messages={[
|
||||
"The Bitcoin has been redeemed by the other party",
|
||||
"There is no risk of losing funds. You can take your time",
|
||||
"The Monero will be automatically redeemed to the address you provided as soon as you resume the swap",
|
||||
"If this step fails, you can manually redeem the funds",
|
||||
]}
|
||||
/>
|
||||
<SwapMoneroRecoveryButton
|
||||
swap={swap}
|
||||
size="small"
|
||||
variant="contained"
|
||||
/>
|
||||
</Box>
|
||||
);
|
||||
const classes = useStyles();
|
||||
return (
|
||||
<Box className={classes.box}>
|
||||
<MessageList
|
||||
messages={[
|
||||
"The Bitcoin has been redeemed by the other party",
|
||||
"There is no risk of losing funds. You can take your time",
|
||||
"The Monero will be automatically redeemed to the address you provided as soon as you resume the swap",
|
||||
"If this step fails, you can manually redeem the funds",
|
||||
]}
|
||||
/>
|
||||
<SwapMoneroRecoveryButton swap={swap} size="small" variant="contained" />
|
||||
</Box>
|
||||
);
|
||||
};
|
||||
|
||||
/**
|
||||
|
|
@ -82,31 +78,28 @@ const BitcoinRedeemedStateAlert = ({ swap }: { swap: GetSwapInfoResponse }) => {
|
|||
* @returns JSX.Element
|
||||
*/
|
||||
const BitcoinLockedNoTimelockExpiredStateAlert = ({
|
||||
timelock,
|
||||
punishTimelockOffset,
|
||||
timelock,
|
||||
punishTimelockOffset,
|
||||
}: {
|
||||
timelock: SwapTimelockInfoNone;
|
||||
punishTimelockOffset: number;
|
||||
timelock: SwapTimelockInfoNone;
|
||||
punishTimelockOffset: number;
|
||||
}) => (
|
||||
<MessageList
|
||||
messages={[
|
||||
<>
|
||||
Your Bitcoin is locked. If the swap is not completed in
|
||||
approximately{" "}
|
||||
<HumanizedBitcoinBlockDuration
|
||||
blocks={timelock.None.blocks_left}
|
||||
/>
|
||||
, you need to refund
|
||||
</>,
|
||||
<>
|
||||
You will lose your funds if you do not refund or complete the
|
||||
swap within{" "}
|
||||
<HumanizedBitcoinBlockDuration
|
||||
blocks={timelock.None.blocks_left + punishTimelockOffset}
|
||||
/>
|
||||
</>,
|
||||
]}
|
||||
/>
|
||||
<MessageList
|
||||
messages={[
|
||||
<>
|
||||
Your Bitcoin is locked. If the swap is not completed in approximately{" "}
|
||||
<HumanizedBitcoinBlockDuration blocks={timelock.None.blocks_left} />,
|
||||
you need to refund
|
||||
</>,
|
||||
<>
|
||||
You will lose your funds if you do not refund or complete the swap
|
||||
within{" "}
|
||||
<HumanizedBitcoinBlockDuration
|
||||
blocks={timelock.None.blocks_left + punishTimelockOffset}
|
||||
/>
|
||||
</>,
|
||||
]}
|
||||
/>
|
||||
);
|
||||
|
||||
/**
|
||||
|
|
@ -117,34 +110,30 @@ const BitcoinLockedNoTimelockExpiredStateAlert = ({
|
|||
* @returns JSX.Element
|
||||
*/
|
||||
const BitcoinPossiblyCancelledAlert = ({
|
||||
swap,
|
||||
timelock,
|
||||
swap,
|
||||
timelock,
|
||||
}: {
|
||||
swap: GetSwapInfoResponse;
|
||||
timelock: SwapTimelockInfoCancelled;
|
||||
swap: GetSwapInfoResponse;
|
||||
timelock: SwapTimelockInfoCancelled;
|
||||
}) => {
|
||||
const classes = useStyles();
|
||||
return (
|
||||
<Box className={classes.box}>
|
||||
<MessageList
|
||||
messages={[
|
||||
"The swap was cancelled because it did not complete in time",
|
||||
"You must resume the swap immediately to refund your Bitcoin. If that fails, you can manually refund it",
|
||||
<>
|
||||
You will lose your funds if you do not refund within{" "}
|
||||
<HumanizedBitcoinBlockDuration
|
||||
blocks={timelock.Cancel.blocks_left}
|
||||
/>
|
||||
</>,
|
||||
]}
|
||||
const classes = useStyles();
|
||||
return (
|
||||
<Box className={classes.box}>
|
||||
<MessageList
|
||||
messages={[
|
||||
"The swap was cancelled because it did not complete in time",
|
||||
"You must resume the swap immediately to refund your Bitcoin. If that fails, you can manually refund it",
|
||||
<>
|
||||
You will lose your funds if you do not refund within{" "}
|
||||
<HumanizedBitcoinBlockDuration
|
||||
blocks={timelock.Cancel.blocks_left}
|
||||
/>
|
||||
<SwapCancelRefundButton
|
||||
swap={swap}
|
||||
size="small"
|
||||
variant="contained"
|
||||
/>
|
||||
</Box>
|
||||
);
|
||||
</>,
|
||||
]}
|
||||
/>
|
||||
<SwapCancelRefundButton swap={swap} size="small" variant="contained" />
|
||||
</Box>
|
||||
);
|
||||
};
|
||||
|
||||
/**
|
||||
|
|
@ -152,7 +141,7 @@ const BitcoinPossiblyCancelledAlert = ({
|
|||
* @returns JSX.Element
|
||||
*/
|
||||
const ImmediateActionAlert = () => (
|
||||
<>Resume the swap immediately to avoid losing your funds</>
|
||||
<>Resume the swap immediately to avoid losing your funds</>
|
||||
);
|
||||
|
||||
/**
|
||||
|
|
@ -161,55 +150,55 @@ const ImmediateActionAlert = () => (
|
|||
* @returns JSX.Element | null
|
||||
*/
|
||||
function SwapAlertStatusText({
|
||||
swap,
|
||||
swap,
|
||||
}: {
|
||||
swap: GetSwapInfoResponseRunningSwap;
|
||||
swap: GetSwapInfoResponseRunningSwap;
|
||||
}) {
|
||||
switch (swap.state_name) {
|
||||
// This is the state where the swap is safe because the other party has redeemed the Bitcoin
|
||||
// It cannot be punished anymore
|
||||
case SwapStateName.BtcRedeemed:
|
||||
return <BitcoinRedeemedStateAlert swap={swap} />;
|
||||
switch (swap.state_name) {
|
||||
// This is the state where the swap is safe because the other party has redeemed the Bitcoin
|
||||
// It cannot be punished anymore
|
||||
case SwapStateName.BtcRedeemed:
|
||||
return <BitcoinRedeemedStateAlert swap={swap} />;
|
||||
|
||||
// These are states that are at risk of punishment because the Bitcoin have been locked
|
||||
// but has not been redeemed yet by the other party
|
||||
case SwapStateName.BtcLocked:
|
||||
case SwapStateName.XmrLockProofReceived:
|
||||
case SwapStateName.XmrLocked:
|
||||
case SwapStateName.EncSigSent:
|
||||
case SwapStateName.CancelTimelockExpired:
|
||||
case SwapStateName.BtcCancelled:
|
||||
if (swap.timelock !== null) {
|
||||
if (isSwapTimelockInfoNone(swap.timelock)) {
|
||||
return (
|
||||
<BitcoinLockedNoTimelockExpiredStateAlert
|
||||
punishTimelockOffset={swap.punish_timelock}
|
||||
timelock={swap.timelock}
|
||||
/>
|
||||
);
|
||||
}
|
||||
// These are states that are at risk of punishment because the Bitcoin have been locked
|
||||
// but has not been redeemed yet by the other party
|
||||
case SwapStateName.BtcLocked:
|
||||
case SwapStateName.XmrLockProofReceived:
|
||||
case SwapStateName.XmrLocked:
|
||||
case SwapStateName.EncSigSent:
|
||||
case SwapStateName.CancelTimelockExpired:
|
||||
case SwapStateName.BtcCancelled:
|
||||
if (swap.timelock !== null) {
|
||||
if (isSwapTimelockInfoNone(swap.timelock)) {
|
||||
return (
|
||||
<BitcoinLockedNoTimelockExpiredStateAlert
|
||||
punishTimelockOffset={swap.punish_timelock}
|
||||
timelock={swap.timelock}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
if (isSwapTimelockInfoCancelled(swap.timelock)) {
|
||||
return (
|
||||
<BitcoinPossiblyCancelledAlert
|
||||
timelock={swap.timelock}
|
||||
swap={swap}
|
||||
/>
|
||||
);
|
||||
}
|
||||
if (isSwapTimelockInfoCancelled(swap.timelock)) {
|
||||
return (
|
||||
<BitcoinPossiblyCancelledAlert
|
||||
timelock={swap.timelock}
|
||||
swap={swap}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
if (isSwapTimelockInfoPunished(swap.timelock)) {
|
||||
return <ImmediateActionAlert />;
|
||||
}
|
||||
if (isSwapTimelockInfoPunished(swap.timelock)) {
|
||||
return <ImmediateActionAlert />;
|
||||
}
|
||||
|
||||
// We have covered all possible timelock states above
|
||||
// If we reach this point, it means we have missed a case
|
||||
return exhaustiveGuard(swap.timelock);
|
||||
}
|
||||
return <ImmediateActionAlert />;
|
||||
default:
|
||||
return exhaustiveGuard(swap.state_name);
|
||||
}
|
||||
// We have covered all possible timelock states above
|
||||
// If we reach this point, it means we have missed a case
|
||||
return exhaustiveGuard(swap.timelock);
|
||||
}
|
||||
return <ImmediateActionAlert />;
|
||||
default:
|
||||
return exhaustiveGuard(swap.state_name);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -218,27 +207,27 @@ function SwapAlertStatusText({
|
|||
* @returns JSX.Element | null
|
||||
*/
|
||||
export default function SwapStatusAlert({
|
||||
swap,
|
||||
swap,
|
||||
}: {
|
||||
swap: GetSwapInfoResponse;
|
||||
swap: GetSwapInfoResponse;
|
||||
}): JSX.Element | null {
|
||||
// If the swap is not running, there is no need to display the alert
|
||||
// This is either because the swap is finished or has not started yet (e.g. in the setup phase, no Bitcoin locked)
|
||||
if (!isGetSwapInfoResponseRunningSwap(swap)) {
|
||||
return null;
|
||||
}
|
||||
// If the swap is not running, there is no need to display the alert
|
||||
// This is either because the swap is finished or has not started yet (e.g. in the setup phase, no Bitcoin locked)
|
||||
if (!isGetSwapInfoResponseRunningSwap(swap)) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return (
|
||||
<Alert
|
||||
key={swap.swap_id}
|
||||
severity="warning"
|
||||
action={<SwapResumeButton swap={swap} />}
|
||||
variant="filled"
|
||||
>
|
||||
<AlertTitle>
|
||||
Swap {swap.swap_id.substring(0, 5)}... is unfinished
|
||||
</AlertTitle>
|
||||
<SwapAlertStatusText swap={swap} />
|
||||
</Alert>
|
||||
);
|
||||
return (
|
||||
<Alert
|
||||
key={swap.swap_id}
|
||||
severity="warning"
|
||||
action={<SwapResumeButton swap={swap} />}
|
||||
variant="filled"
|
||||
>
|
||||
<AlertTitle>
|
||||
Swap {swap.swap_id.substring(0, 5)}... is unfinished
|
||||
</AlertTitle>
|
||||
<SwapAlertStatusText swap={swap} />
|
||||
</Alert>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -3,26 +3,26 @@ import { useSwapInfosSortedByDate } from "store/hooks";
|
|||
import SwapStatusAlert from "./SwapStatusAlert";
|
||||
|
||||
const useStyles = makeStyles((theme) => ({
|
||||
outer: {
|
||||
display: "flex",
|
||||
flexDirection: "column",
|
||||
gap: theme.spacing(1),
|
||||
},
|
||||
outer: {
|
||||
display: "flex",
|
||||
flexDirection: "column",
|
||||
gap: theme.spacing(1),
|
||||
},
|
||||
}));
|
||||
|
||||
export default function SwapTxLockAlertsBox() {
|
||||
const classes = useStyles();
|
||||
const classes = useStyles();
|
||||
|
||||
// We specifically choose ALL swaps here
|
||||
// If a swap is in a state where an Alert is not needed (becaue no Bitcoin have been locked or because the swap has been completed)
|
||||
// the SwapStatusAlert component will not render an Alert
|
||||
const swaps = useSwapInfosSortedByDate();
|
||||
// We specifically choose ALL swaps here
|
||||
// If a swap is in a state where an Alert is not needed (becaue no Bitcoin have been locked or because the swap has been completed)
|
||||
// the SwapStatusAlert component will not render an Alert
|
||||
const swaps = useSwapInfosSortedByDate();
|
||||
|
||||
return (
|
||||
<Box className={classes.outer}>
|
||||
{swaps.map((swap) => (
|
||||
<SwapStatusAlert key={swap.swap_id} swap={swap} />
|
||||
))}
|
||||
</Box>
|
||||
);
|
||||
return (
|
||||
<Box className={classes.outer}>
|
||||
{swaps.map((swap) => (
|
||||
<SwapStatusAlert key={swap.swap_id} swap={swap} />
|
||||
))}
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
import { Button } from '@material-ui/core';
|
||||
import Alert from '@material-ui/lab/Alert';
|
||||
import { useNavigate } from 'react-router-dom';
|
||||
import { useResumeableSwapsCount } from 'store/hooks';
|
||||
import { Button } from "@material-ui/core";
|
||||
import Alert from "@material-ui/lab/Alert";
|
||||
import { useNavigate } from "react-router-dom";
|
||||
import { useResumeableSwapsCount } from "store/hooks";
|
||||
|
||||
export default function UnfinishedSwapsAlert() {
|
||||
const resumableSwapsCount = useResumeableSwapsCount();
|
||||
|
|
@ -16,16 +16,16 @@ export default function UnfinishedSwapsAlert() {
|
|||
<Button
|
||||
color="inherit"
|
||||
size="small"
|
||||
onClick={() => navigate('/history')}
|
||||
onClick={() => navigate("/history")}
|
||||
>
|
||||
VIEW
|
||||
</Button>
|
||||
}
|
||||
>
|
||||
You have{' '}
|
||||
You have{" "}
|
||||
{resumableSwapsCount > 1
|
||||
? `${resumableSwapsCount} unfinished swaps`
|
||||
: 'one unfinished swap'}
|
||||
: "one unfinished swap"}
|
||||
</Alert>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue