Compare commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
ef70513dbe | ||
|
|
38c127f1af | ||
|
|
11bff39a7a | ||
|
|
a5e1d71de8 | ||
|
|
ac71f8ee43 |
@@ -49,10 +49,10 @@ describe('capsule - without MultiSign', { tags: '@slow' }, () => {
|
||||
cy.wrap(markets[0]).as('market');
|
||||
});
|
||||
cy.visit('/#/portfolio');
|
||||
cy.connectVegaWallet();
|
||||
});
|
||||
|
||||
it('can deposit', function () {
|
||||
cy.setOnBoardingViewed();
|
||||
cy.visit('/#/portfolio');
|
||||
cy.get('[data-testid="pathname-/portfolio"]').should('exist');
|
||||
|
||||
@@ -70,8 +70,6 @@ describe('capsule - without MultiSign', { tags: '@slow' }, () => {
|
||||
cy.getByTestId('deposit-button').click();
|
||||
connectEthereumWallet('Unknown');
|
||||
selectAsset(btcName);
|
||||
cy.get('[data-testid="rich-select-option"]').eq(btcName).click();
|
||||
|
||||
cy.getByTestId('approve-default').should(
|
||||
'contain.text',
|
||||
`Before you can make a deposit of your chosen asset, ${btcSymbol}, you need to approve its use in your Ethereum wallet`
|
||||
@@ -122,7 +120,7 @@ describe('capsule - without MultiSign', { tags: '@slow' }, () => {
|
||||
cy.get('[data-testid="pathname-/portfolio"]').should('exist');
|
||||
|
||||
cy.getByTestId(collateralTab).click();
|
||||
cy.getByTestId('open-transfer').eq(1).click();
|
||||
cy.getByTestId('open-transfer').click();
|
||||
cy.getByTestId('transfer-form').should('be.visible');
|
||||
cy.getByTestId('transfer-form').find('[name="toAddress"]').select(1);
|
||||
cy.get('select option')
|
||||
@@ -149,8 +147,7 @@ describe('capsule - without MultiSign', { tags: '@slow' }, () => {
|
||||
// 0003-WTXN-011
|
||||
cy.getByTestId('Withdrawals').click();
|
||||
cy.getByTestId('withdraw-dialog-button').click();
|
||||
selectAsset(btcName);
|
||||
cy.get('[data-testid="rich-select-option"]').eq(btcName).click();
|
||||
selectAsset(0);
|
||||
cy.get(amountField).focus();
|
||||
cy.get(amountField).clear().type('1');
|
||||
cy.getByTestId('submit-withdrawal').click();
|
||||
@@ -188,15 +185,19 @@ describe('capsule', { tags: '@slow', testIsolation: true }, () => {
|
||||
|
||||
it('shows node health', function () {
|
||||
// 0006-NETW-010
|
||||
const regex = /^Operational\d+$/;
|
||||
const market = this.market;
|
||||
cy.visit(`/#/markets/${market.id}`);
|
||||
cy.getByTestId('node-health-trigger').realHover();
|
||||
cy.getByTestId('node-health')
|
||||
.children()
|
||||
.first()
|
||||
.invoke('text')
|
||||
.should('match', regex);
|
||||
.should('contain.text', 'Operational')
|
||||
.then(($el) => {
|
||||
const blockHeight = parseInt($el.text());
|
||||
// block height will increase over the course of the test run so best
|
||||
// we can do here is check that its showing something sensible
|
||||
expect(blockHeight).to.be.greaterThan(0);
|
||||
});
|
||||
cy.getByTestId('node-health')
|
||||
.children()
|
||||
.eq(1)
|
||||
@@ -238,6 +239,7 @@ describe('capsule', { tags: '@slow', testIsolation: true }, () => {
|
||||
.should('contain.text', order.size);
|
||||
|
||||
cy.getByTestId(openOrdersTab).click();
|
||||
cy.getByTestId('edit', txTimeout).should('contain.text', 'Edit');
|
||||
cy.getByTestId('tab-open-orders').within(() => {
|
||||
cy.get('.ag-center-cols-container')
|
||||
.children()
|
||||
@@ -278,7 +280,8 @@ describe('capsule', { tags: '@slow', testIsolation: true }, () => {
|
||||
cy.visit(`/#/markets/${market.id}`);
|
||||
cy.getByTestId(toastCloseBtn, txTimeout).click();
|
||||
cy.getByTestId(openOrdersTab).click();
|
||||
cy.getByTestId('edit').first().click();
|
||||
cy.getByTestId('edit', txTimeout).should('be.visible');
|
||||
cy.getByTestId('edit').first().should('be.visible').click();
|
||||
cy.getByTestId('dialog-title').should('contain.text', 'Edit order');
|
||||
cy.get('#limitPrice').focus().clear().type(newPrice);
|
||||
cy.getByTestId('edit-order').find('[type="submit"]').click();
|
||||
@@ -347,7 +350,6 @@ describe('capsule', { tags: '@slow', testIsolation: true }, () => {
|
||||
cy.getByTestId('withdraw-dialog-button').click();
|
||||
connectEthereumWallet('Unknown');
|
||||
selectAsset(btcName);
|
||||
cy.get('[data-testid="rich-select-option"]').eq(btcName).click();
|
||||
cy.get(amountField).clear().type('1');
|
||||
cy.getByTestId('submit-withdrawal').click();
|
||||
cy.getByTestId(toastContent, txTimeout).should(
|
||||
@@ -435,7 +437,6 @@ describe('capsule', { tags: '@slow', testIsolation: true }, () => {
|
||||
cy.getByTestId('deposit-button').click();
|
||||
connectEthereumWallet('Unknown');
|
||||
selectAsset(btcName);
|
||||
cy.get('[data-testid="rich-select-option"]').eq(btcName).click();
|
||||
cy.contains('Deposits of tBTC not approved').should('not.exist');
|
||||
cy.contains('Use maximum').should('be.visible');
|
||||
cy.get(amountField).clear().type('20000000');
|
||||
|
||||
@@ -33,7 +33,7 @@ import BigNumber from 'bignumber.js';
|
||||
import classNames from 'classnames';
|
||||
import { AccountsActionsDropdown } from './accounts-actions-dropdown';
|
||||
|
||||
const colorClass = (percentageUsed: number, neutral = false) => {
|
||||
const colorClass = (percentageUsed: number) => {
|
||||
return classNames('text-right', {
|
||||
'text-vega-orange': percentageUsed >= 75 && percentageUsed < 90,
|
||||
'text-vega-red': percentageUsed >= 90,
|
||||
@@ -210,7 +210,7 @@ export const AccountTable = ({
|
||||
},
|
||||
cellClass: ({ data }) => {
|
||||
const percentageUsed = percentageValue(data?.used, data?.total);
|
||||
return colorClass(percentageUsed, true);
|
||||
return colorClass(percentageUsed);
|
||||
},
|
||||
valueFormatter: ({
|
||||
value,
|
||||
@@ -270,7 +270,8 @@ export const AccountTable = ({
|
||||
onClickDeposit && onClickDeposit(assetId);
|
||||
}}
|
||||
>
|
||||
<VegaIcon name={VegaIconNames.DEPOSIT} /> {t('Deposit')}
|
||||
<VegaIcon name={VegaIconNames.DEPOSIT} size={14} />{' '}
|
||||
{t('Deposit')}
|
||||
</TradingButton>
|
||||
</CenteredGridCellWrapper>
|
||||
);
|
||||
|
||||
@@ -259,11 +259,9 @@ export const DealTicketMarginDetails = ({
|
||||
? liquidationEstimateWorstCaseIncludingBuyOrders
|
||||
: liquidationEstimateWorstCaseIncludingSellOrders;
|
||||
|
||||
// The estimate order query API gives us the liquidation price in formatted by asset decimals.
|
||||
// We need to calculate it with asset decimals, but display it with market decimals precision until the API changes.
|
||||
liquidationPriceEstimate = formatValue(
|
||||
liquidationEstimateWorstCase.toString(),
|
||||
assetDecimals,
|
||||
market.decimalPlaces,
|
||||
undefined,
|
||||
market.decimalPlaces
|
||||
);
|
||||
@@ -276,7 +274,7 @@ export const DealTicketMarginDetails = ({
|
||||
? liquidationEstimateBestCase
|
||||
: liquidationEstimateWorstCase
|
||||
).toString(),
|
||||
assetDecimals,
|
||||
market.decimalPlaces,
|
||||
undefined,
|
||||
market.decimalPlaces
|
||||
);
|
||||
@@ -308,7 +306,7 @@ export const DealTicketMarginDetails = ({
|
||||
key={'value-dropdown'}
|
||||
className="flex items-center justify-between w-full gap-2"
|
||||
>
|
||||
<div className="flex items-center gap-1 text-left">
|
||||
<div className="flex items-center text-left gap-1">
|
||||
<Tooltip description={MARGIN_DIFF_TOOLTIP_TEXT(assetSymbol)}>
|
||||
<span className="text-muted">{t('Margin required')}</span>
|
||||
</Tooltip>
|
||||
|
||||
@@ -49,6 +49,11 @@ query EstimatePosition(
|
||||
openVolume: $openVolume
|
||||
orders: $orders
|
||||
collateralAvailable: $collateralAvailable
|
||||
# Everywhere in the codebase we expect price values of the underlying to have the right
|
||||
# number of digits for formatting with market.decimalPlaces. By default the estimatePosition
|
||||
# query will return a full value requiring formatting using asset.decimals. For consistency
|
||||
# we can set this variable to true so that we can format with market.decimalPlaces
|
||||
scaleLiquidationPriceToMarketDecimals: true
|
||||
) {
|
||||
margin {
|
||||
worstCase {
|
||||
|
||||
@@ -130,6 +130,7 @@ export const EstimatePositionDocument = gql`
|
||||
openVolume: $openVolume
|
||||
orders: $orders
|
||||
collateralAvailable: $collateralAvailable
|
||||
scaleLiquidationPriceToMarketDecimals: true
|
||||
) {
|
||||
margin {
|
||||
worstCase {
|
||||
|
||||
@@ -0,0 +1,85 @@
|
||||
import { MockedProvider } from '@apollo/client/testing';
|
||||
import type { MockedResponse } from '@apollo/client/testing';
|
||||
import { render, screen, within } from '@testing-library/react';
|
||||
import userEvent from '@testing-library/user-event';
|
||||
import { EstimatePositionDocument } from './__generated__/Positions';
|
||||
import type { EstimatePositionQuery } from './__generated__/Positions';
|
||||
import { LiquidationPrice } from './liquidation-price';
|
||||
import { addDecimalsFormatNumber } from '@vegaprotocol/utils';
|
||||
|
||||
describe('LiquidationPrice', () => {
|
||||
const props = {
|
||||
marketId: 'market-id',
|
||||
openVolume: '100',
|
||||
collateralAvailable: '1000',
|
||||
decimalPlaces: 2,
|
||||
};
|
||||
const worstCaseOpenVolume = '200';
|
||||
const bestCaseOpenVolume = '100';
|
||||
const mock: MockedResponse<EstimatePositionQuery> = {
|
||||
request: {
|
||||
query: EstimatePositionDocument,
|
||||
variables: {
|
||||
marketId: props.marketId,
|
||||
openVolume: props.openVolume,
|
||||
collateralAvailable: props.collateralAvailable,
|
||||
},
|
||||
},
|
||||
result: {
|
||||
data: {
|
||||
estimatePosition: {
|
||||
margin: {
|
||||
worstCase: {
|
||||
maintenanceLevel: '100',
|
||||
searchLevel: '100',
|
||||
initialLevel: '100',
|
||||
collateralReleaseLevel: '100',
|
||||
},
|
||||
bestCase: {
|
||||
maintenanceLevel: '100',
|
||||
searchLevel: '100',
|
||||
initialLevel: '100',
|
||||
collateralReleaseLevel: '100',
|
||||
},
|
||||
},
|
||||
liquidation: {
|
||||
worstCase: {
|
||||
open_volume_only: worstCaseOpenVolume,
|
||||
including_buy_orders: '100',
|
||||
including_sell_orders: '100',
|
||||
},
|
||||
bestCase: {
|
||||
open_volume_only: bestCaseOpenVolume,
|
||||
including_buy_orders: '100',
|
||||
including_sell_orders: '100',
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
it('correctly formats best and worst case values for the tooltip', async () => {
|
||||
render(
|
||||
<MockedProvider mocks={[mock]}>
|
||||
<LiquidationPrice {...props} />
|
||||
</MockedProvider>
|
||||
);
|
||||
|
||||
expect(screen.getByText('-')).toBeInTheDocument();
|
||||
const el = await screen.findByTestId('liquidation-price');
|
||||
expect(el).toHaveTextContent(
|
||||
addDecimalsFormatNumber(worstCaseOpenVolume, props.decimalPlaces)
|
||||
);
|
||||
await userEvent.hover(el);
|
||||
const tooltip = within(await screen.findByRole('tooltip'));
|
||||
expect(
|
||||
tooltip.getByText('Worst case').nextElementSibling
|
||||
).toHaveTextContent(
|
||||
addDecimalsFormatNumber(worstCaseOpenVolume, props.decimalPlaces)
|
||||
);
|
||||
expect(tooltip.getByText('Best case').nextElementSibling).toHaveTextContent(
|
||||
addDecimalsFormatNumber(bestCaseOpenVolume, props.decimalPlaces)
|
||||
);
|
||||
});
|
||||
});
|
||||
@@ -8,20 +8,12 @@ export const LiquidationPrice = ({
|
||||
openVolume,
|
||||
collateralAvailable,
|
||||
decimalPlaces,
|
||||
formatDecimals,
|
||||
}: {
|
||||
marketId: string;
|
||||
openVolume: string;
|
||||
collateralAvailable: string;
|
||||
decimalPlaces: number;
|
||||
formatDecimals: number;
|
||||
}) => {
|
||||
// NOTE!
|
||||
//
|
||||
// The estimate order query API gives us the liquidation price unformatted but expecting to be converted
|
||||
// using asset decimal placse.
|
||||
//
|
||||
// We need to convert it with asset decimals, but display it formatted with market decimals precision until the API changes.
|
||||
const { data: currentData, previousData } = useEstimatePositionQuery({
|
||||
variables: {
|
||||
marketId,
|
||||
@@ -38,21 +30,11 @@ export const LiquidationPrice = ({
|
||||
return <span>-</span>;
|
||||
}
|
||||
|
||||
let bestCase = '-';
|
||||
let worstCase = '-';
|
||||
let bestCase = data.estimatePosition.liquidation.bestCase.open_volume_only;
|
||||
let worstCase = data.estimatePosition.liquidation.worstCase.open_volume_only;
|
||||
|
||||
bestCase =
|
||||
data.estimatePosition?.liquidation?.bestCase.open_volume_only.replace(
|
||||
/\..*/,
|
||||
''
|
||||
);
|
||||
worstCase =
|
||||
data.estimatePosition?.liquidation?.worstCase.open_volume_only.replace(
|
||||
/\..*/,
|
||||
''
|
||||
);
|
||||
worstCase = addDecimalsFormatNumber(worstCase, decimalPlaces, formatDecimals);
|
||||
bestCase = addDecimalsFormatNumber(bestCase, decimalPlaces, formatDecimals);
|
||||
worstCase = addDecimalsFormatNumber(worstCase, decimalPlaces, decimalPlaces);
|
||||
bestCase = addDecimalsFormatNumber(bestCase, decimalPlaces, decimalPlaces);
|
||||
|
||||
return (
|
||||
<Tooltip
|
||||
|
||||
@@ -339,16 +339,12 @@ export const PositionsTable = ({
|
||||
if (!data) {
|
||||
return '-';
|
||||
}
|
||||
// The estimate order query API gives us the liquidation price unformatted but expecting
|
||||
// conversion using asset decimals. We need to convert it with asset decimals, but format
|
||||
// it with market decimals precision until the API changes.
|
||||
return (
|
||||
<LiquidationPrice
|
||||
marketId={data.marketId}
|
||||
openVolume={data.openVolume}
|
||||
collateralAvailable={data.totalBalance}
|
||||
decimalPlaces={data.assetDecimals}
|
||||
formatDecimals={data.marketDecimalPlaces}
|
||||
decimalPlaces={data.marketDecimalPlaces}
|
||||
/>
|
||||
);
|
||||
},
|
||||
|
||||
Reference in New Issue
Block a user