LaconicNetwork/vega-frontend-monorepo
4
0
Fork 0
Code Issues Pull Requests 1 Packages Projects Releases Wiki Activity

fix(trading): fix symbol on order estimates (#2827)

Browse Source
This commit is contained in:
m.ray 2023-02-02 08:30:47 -05:00 committed by GitHub
parent 1f9af79215
commit b9908003ba
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
7 changed files with 24 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
apps/trading-e2e/src/integration/trading-deal-ticket.cy.ts
View File

@ -452,7 +452,7 @@ describe('limit order validations', { tags: '@smoke' }, () => {
//7002-SORD-018 //7002-SORD-018
cy.getByTestId(orderPriceField) cy.getByTestId(orderPriceField)
.siblings('label') .siblings('label')
.should('have.text', 'Price (tBTC)'); .should('have.text', 'Price (BTC)');
}); });
it('must see warning when placing an order with expiry date in past', () => { it('must see warning when placing an order with expiry date in past', () => {

6
libs/deal-ticket/src/components/deal-ticket/deal-ticket-fee-details.tsx
View File

@ -16,7 +16,7 @@ export interface DealTicketFeeDetails {
label: string; label: string;
value?: string | number | null; value?: string | number | null;
labelDescription?: string | ReactNode; labelDescription?: string | ReactNode;
quoteName?: string; symbol?: string;
} }
export const DealTicketFeeDetails = ({ export const DealTicketFeeDetails = ({
@ -27,7 +27,7 @@ export const DealTicketFeeDetails = ({
const details = getFeeDetailsValues(feeDetails); const details = getFeeDetailsValues(feeDetails);
return ( return (
<div> <div>
{details.map(({ label, value, labelDescription, quoteName }) => ( {details.map(({ label, value, labelDescription, symbol }) => (
<div <div
key={label} key={label}
className="text-xs mt-2 flex justify-between items-center gap-4 flex-wrap" className="text-xs mt-2 flex justify-between items-center gap-4 flex-wrap"
@ -39,7 +39,7 @@ export const DealTicketFeeDetails = ({
</div> </div>
<div className="text-neutral-500 dark:text-neutral-300">{`${ <div className="text-neutral-500 dark:text-neutral-300">{`${
value ?? '-' value ?? '-'
} ${quoteName || ''}`}</div> } ${symbol || ''}`}</div>
</div> </div>
))} ))}
</div> </div>

3
libs/deal-ticket/src/components/deal-ticket/deal-ticket-limit-amount.tsx
View File

@ -15,8 +15,7 @@ export const DealTicketLimitAmount = ({
}: DealTicketLimitAmountProps) => { }: DealTicketLimitAmountProps) => {
const priceStep = toDecimal(market?.decimalPlaces); const priceStep = toDecimal(market?.decimalPlaces);
const sizeStep = toDecimal(market?.positionDecimalPlaces); const sizeStep = toDecimal(market?.positionDecimalPlaces);
const quoteName = const quoteName = market.tradableInstrument.instrument.product.quoteName;
market.tradableInstrument.instrument.product.settlementAsset.symbol;
const renderError = () => { const renderError = () => {
if (sizeError) { if (sizeError) {

3
libs/deal-ticket/src/components/deal-ticket/deal-ticket-market-amount.tsx
View File

@ -19,8 +19,7 @@ export const DealTicketMarketAmount = ({
market, market,
sizeError, sizeError,
}: DealTicketMarketAmountProps) => { }: DealTicketMarketAmountProps) => {
const quoteName = const quoteName = market.tradableInstrument.instrument.product.quoteName;
market.tradableInstrument.instrument.product.settlementAsset.symbol;
const sizeStep = toDecimal(market?.positionDecimalPlaces); const sizeStep = toDecimal(market?.positionDecimalPlaces);
const price = getMarketPrice(market); const price = getMarketPrice(market);

2
libs/deal-ticket/src/components/deal-ticket/deal-ticket.spec.tsx
View File

@ -84,7 +84,7 @@ describe('DealTicket', () => {
expect(screen.getByTestId('last-price')).toHaveTextContent( expect(screen.getByTestId('last-price')).toHaveTextContent(
// eslint-disable-next-line // eslint-disable-next-line
`~${addDecimal(market!.data.markPrice, market.decimalPlaces)} ${ `~${addDecimal(market!.data.markPrice, market.decimalPlaces)} ${
market.tradableInstrument.instrument.product.settlementAsset.symbol market.tradableInstrument.instrument.product.quoteName
}` }`
); );
}); });

21
libs/deal-ticket/src/hooks/use-fee-deal-ticket-details.tsx
View File

@ -69,12 +69,13 @@ export const useFeeDealTicketDetails = (
return null; return null;
}, [derivedPrice, order.size, market.decimalPlaces]); }, [derivedPrice, order.size, market.decimalPlaces]);
const quoteName = market.tradableInstrument.instrument.product.quoteName; const symbol =
market.tradableInstrument.instrument.product.settlementAsset.symbol;
return useMemo(() => { return useMemo(() => {
return { return {
market, market,
quoteName, symbol,
notionalSize, notionalSize,
estMargin, estMargin,
estCloseOut, estCloseOut,
@ -83,7 +84,7 @@ export const useFeeDealTicketDetails = (
}; };
}, [ }, [
market, market,
quoteName, symbol,
notionalSize, notionalSize,
estMargin, estMargin,
estCloseOut, estCloseOut,
@ -94,7 +95,7 @@ export const useFeeDealTicketDetails = (
export interface FeeDetails { export interface FeeDetails {
market: MarketDealTicket; market: MarketDealTicket;
quoteName: string; symbol: string;
notionalSize: string | null; notionalSize: string | null;
estMargin: OrderMargin | null; estMargin: OrderMargin | null;
estCloseOut: string | null; estCloseOut: string | null;
@ -102,7 +103,7 @@ export interface FeeDetails {
} }
export const getFeeDetailsValues = ({ export const getFeeDetailsValues = ({
quoteName, symbol,
notionalSize, notionalSize,
estMargin, estMargin,
estCloseOut, estCloseOut,
@ -128,7 +129,7 @@ export const getFeeDetailsValues = ({
{ {
label: t('Notional'), label: t('Notional'),
value: formatValueWithMarketDp(notionalSize), value: formatValueWithMarketDp(notionalSize),
quoteName, symbol,
labelDescription: NOTIONAL_SIZE_TOOLTIP_TEXT, labelDescription: NOTIONAL_SIZE_TOOLTIP_TEXT,
}, },
{ {
@ -146,24 +147,24 @@ export const getFeeDetailsValues = ({
<FeesBreakdown <FeesBreakdown
fees={estMargin?.fees} fees={estMargin?.fees}
feeFactors={market.fees.factors} feeFactors={market.fees.factors}
quoteName={quoteName} symbol={symbol}
decimals={assetDecimals} decimals={assetDecimals}
/> />
</> </>
), ),
quoteName, symbol,
}, },
{ {
label: t('Margin'), label: t('Margin'),
value: value:
estMargin?.margin && `~${formatValueWithAssetDp(estMargin?.margin)}`, estMargin?.margin && `~${formatValueWithAssetDp(estMargin?.margin)}`,
quoteName, symbol,
labelDescription: EST_MARGIN_TOOLTIP_TEXT, labelDescription: EST_MARGIN_TOOLTIP_TEXT,
}, },
{ {
label: t('Liquidation'), label: t('Liquidation'),
value: estCloseOut && `~${formatValueWithMarketDp(estCloseOut)}`, value: estCloseOut && `~${formatValueWithMarketDp(estCloseOut)}`,
quoteName, symbol: market.tradableInstrument.instrument.product.quoteName,
labelDescription: EST_CLOSEOUT_TOOLTIP_TEXT, labelDescription: EST_CLOSEOUT_TOOLTIP_TEXT,
}, },
]; ];

12
libs/market-info/src/components/fees-breakdown/fees-breakdown.tsx
View File

@ -51,7 +51,7 @@ export const FeesBreakdownPercentage = ({
export const FeesBreakdown = ({ export const FeesBreakdown = ({
fees, fees,
feeFactors, feeFactors,
quoteName, symbol,
decimals, decimals,
}: { }: {
fees?: { fees?: {
@ -60,7 +60,7 @@ export const FeesBreakdown = ({
makerFee: string; makerFee: string;
}; };
feeFactors?: Market['fees']['factors']; feeFactors?: Market['fees']['factors'];
quoteName?: string; symbol?: string;
decimals: number; decimals: number;
}) => { }) => {
if (!fees) return null; if (!fees) return null;
@ -84,7 +84,7 @@ export const FeesBreakdown = ({
</dd> </dd>
)} )}
<dd className="text-right col-span-2"> <dd className="text-right col-span-2">
{formatValue(fees.infrastructureFee)} {quoteName || ''} {formatValue(fees.infrastructureFee)} {symbol || ''}
</dd> </dd>
<dt className="col-span-2">{t('Liquidity fee')}</dt> <dt className="col-span-2">{t('Liquidity fee')}</dt>
{feeFactors && ( {feeFactors && (
@ -95,7 +95,7 @@ export const FeesBreakdown = ({
</dd> </dd>
)} )}
<dd className="text-right col-span-2"> <dd className="text-right col-span-2">
{formatValue(fees.liquidityFee)} {quoteName || ''} {formatValue(fees.liquidityFee)} {symbol || ''}
</dd> </dd>
<dt className="col-span-2">{t('Maker fee')}</dt> <dt className="col-span-2">{t('Maker fee')}</dt>
{feeFactors && ( {feeFactors && (
@ -106,7 +106,7 @@ export const FeesBreakdown = ({
</dd> </dd>
)} )}
<dd className="text-right col-span-2"> <dd className="text-right col-span-2">
{formatValue(fees.makerFee)} {quoteName || ''} {formatValue(fees.makerFee)} {symbol || ''}
</dd> </dd>
<dt className="col-span-2">{t('Total fees')}</dt> <dt className="col-span-2">{t('Total fees')}</dt>
{feeFactors && ( {feeFactors && (
@ -115,7 +115,7 @@ export const FeesBreakdown = ({
</dd> </dd>
)} )}
<dd className="text-right col-span-2"> <dd className="text-right col-span-2">
{formatValue(totalFees)} {quoteName || ''} {formatValue(totalFees)} {symbol || ''}
</dd> </dd>
</dl> </dl>
); );