diff --git a/libs/positions/src/lib/positions-table.spec.tsx b/libs/positions/src/lib/positions-table.spec.tsx index 8efdf8f24..81f2ff7b4 100644 --- a/libs/positions/src/lib/positions-table.spec.tsx +++ b/libs/positions/src/lib/positions-table.spec.tsx @@ -68,7 +68,9 @@ test('Render correct columns', async () => { const headers = screen.getAllByRole('columnheader'); expect(headers).toHaveLength(5); - expect(headers.map((h) => h.textContent?.trim())).toEqual([ + expect( + headers.map((h) => h.querySelector('[ref="eText"]')?.textContent?.trim()) + ).toEqual([ 'Market', 'Amount', 'Average Entry Price', diff --git a/libs/positions/src/lib/positions-table.tsx b/libs/positions/src/lib/positions-table.tsx index 304826de9..3e99ed905 100644 --- a/libs/positions/src/lib/positions-table.tsx +++ b/libs/positions/src/lib/positions-table.tsx @@ -10,7 +10,6 @@ import { import { AgGridDynamic as AgGrid } from '@vegaprotocol/ui-toolkit'; import { AgGridColumn } from 'ag-grid-react'; import type { AgGridReact } from 'ag-grid-react'; -import compact from 'lodash/compact'; import type { Positions_party_positions } from './__generated__/Positions'; import { MarketTradingMode } from '@vegaprotocol/types'; @@ -21,52 +20,70 @@ interface PositionsTableProps { export const getRowNodeId = (data: { market: { id: string } }) => data.market.id; -const sortByName = ( - a: Positions_party_positions, - b: Positions_party_positions -) => { - if ( - a.market.tradableInstrument.instrument.name < - b.market.tradableInstrument.instrument.name - ) { - return -1; +const alphanumericComparator = (a: string, b: string, isInverted: boolean) => { + if (a < b) { + return isInverted ? 1 : -1; } - if ( - a.market.tradableInstrument.instrument.name > - b.market.tradableInstrument.instrument.name - ) { - return 1; + if (a > b) { + return isInverted ? -1 : 1; } return 0; }; +const comparator = ( + valueA: string, + valueB: string, + nodeA: { data: Positions_party_positions }, + nodeB: { data: Positions_party_positions }, + isInverted: boolean +) => + alphanumericComparator( + nodeA.data.market.tradableInstrument.instrument.name, + nodeB.data.market.tradableInstrument.instrument.name, + isInverted + ) || + alphanumericComparator( + nodeA.data.market.id, + nodeB.data.market.id, + isInverted + ); + interface PositionsTableValueFormatterParams extends ValueFormatterParams { data: Positions_party_positions; } export const PositionsTable = forwardRef( ({ data }, ref) => { - const sortedData = useMemo(() => { - return compact(data).sort(sortByName); - }, [data]); return ( { + event.columnApi.applyColumnState({ + state: [ + { + colId: 'market.tradableInstrument.instrument.code', + sort: 'asc', + }, + ], + }); + }} components={{ PriceCell }} >