mirror of
https://github.com/comit-network/xmr-btc-swap.git
synced 2025-05-03 23:35:02 -04:00
feat(gui): Display provider spread to user (#124)
This commit is contained in:
parent
1acb597a34
commit
584cc41411
4 changed files with 60 additions and 3 deletions
|
@ -9,6 +9,7 @@ import {
|
|||
import { satsToBtc, secondsToDays } from "utils/conversionUtils";
|
||||
import { isProviderOutdated } from 'utils/multiAddrUtils';
|
||||
import WarningIcon from '@material-ui/icons/Warning';
|
||||
import { useAppSelector } from "store/hooks";
|
||||
|
||||
const useStyles = makeStyles((theme) => ({
|
||||
content: {
|
||||
|
@ -25,6 +26,24 @@ const useStyles = makeStyles((theme) => ({
|
|||
},
|
||||
}));
|
||||
|
||||
function ProviderSpreadChip({ provider }: { provider: ExtendedProviderStatus }) {
|
||||
const xmrBtcPrice = useAppSelector(s => s.rates?.xmrBtcRate);
|
||||
|
||||
if (xmrBtcPrice === null) {
|
||||
return null;
|
||||
}
|
||||
|
||||
const providerPrice = satsToBtc(provider.price);
|
||||
const spread = ((providerPrice - xmrBtcPrice) / xmrBtcPrice) * 100;
|
||||
|
||||
return (
|
||||
<Tooltip title="The spread is the difference between the provider's exchange rate and the market rate. A high spread indicates that the provider is charging more than the market rate.">
|
||||
<Chip label={`Spread: ${spread.toFixed(2)} %`} />
|
||||
</Tooltip>
|
||||
);
|
||||
|
||||
}
|
||||
|
||||
export default function ProviderInfo({
|
||||
provider,
|
||||
}: {
|
||||
|
@ -78,6 +97,7 @@ export default function ProviderInfo({
|
|||
<Chip label="Outdated" icon={<WarningIcon />} color="primary" />
|
||||
</Tooltip>
|
||||
)}
|
||||
<ProviderSpreadChip provider={provider} />
|
||||
</Box>
|
||||
</Box>
|
||||
);
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue