feat(trading): add row click for fees table (#5130)

This commit is contained in:
Matthew Russell 2023-10-26 08:38:52 -07:00 committed by GitHub
parent 52c96794f7
commit 8c2c8d987c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -5,6 +5,8 @@ import { t } from '@vegaprotocol/i18n';
import { formatPercentage, getAdjustedFee } from './utils'; import { formatPercentage, getAdjustedFee } from './utils';
import { MarketCodeCell } from '../../client-pages/markets/market-code-cell'; import { MarketCodeCell } from '../../client-pages/markets/market-code-cell';
import BigNumber from 'bignumber.js'; import BigNumber from 'bignumber.js';
import { useNavigateWithMeta } from '../../lib/hooks/use-market-click-handler';
import { Links } from '../../lib/links';
const feesTableColumnDefs = [ const feesTableColumnDefs = [
{ field: 'code', cellRenderer: 'MarketCodeCell' }, { field: 'code', cellRenderer: 'MarketCodeCell' },
@ -51,6 +53,8 @@ export const MarketFees = ({
referralDiscount: number; referralDiscount: number;
volumeDiscount: number; volumeDiscount: number;
}) => { }) => {
const navigateWithMeta = useNavigateWithMeta();
const rows = compact(markets || []).map((m) => { const rows = compact(markets || []).map((m) => {
const infraFee = new BigNumber(m.fees.factors.infrastructureFee); const infraFee = new BigNumber(m.fees.factors.infrastructureFee);
const makerFee = new BigNumber(m.fees.factors.makerFee); const makerFee = new BigNumber(m.fees.factors.makerFee);
@ -63,6 +67,7 @@ export const MarketFees = ({
); );
return { return {
id: m.id,
code: m.tradableInstrument.instrument.code, code: m.tradableInstrument.instrument.code,
productType: m.tradableInstrument.instrument.product.__typename, productType: m.tradableInstrument.instrument.product.__typename,
infraFee: formatPercentage(infraFee.toNumber()), infraFee: formatPercentage(infraFee.toNumber()),
@ -80,10 +85,19 @@ export const MarketFees = ({
<AgGrid <AgGrid
columnDefs={feesTableColumnDefs} columnDefs={feesTableColumnDefs}
rowData={rows} rowData={rows}
getRowId={({ data }) => data.id}
defaultColDef={feesTableDefaultColDef} defaultColDef={feesTableDefaultColDef}
domLayout="autoHeight" domLayout="autoHeight"
components={components} components={components}
rowHeight={45} rowHeight={45}
rowClass="cursor-pointer"
onRowClicked={({ data, event }) => {
navigateWithMeta(
Links.MARKET(data.id),
// @ts-ignore metaKey and ctrlKey exist
event.metaKey || event.ctrlKey
);
}}
/> />
</div> </div>
); );