diff --git a/libs/accounts/src/lib/accounts-table.tsx b/libs/accounts/src/lib/accounts-table.tsx index 05110ed13..1d7099aa3 100644 --- a/libs/accounts/src/lib/accounts-table.tsx +++ b/libs/accounts/src/lib/accounts-table.tsx @@ -1,5 +1,9 @@ import { forwardRef, useMemo, useState } from 'react'; -import { addDecimalsFormatNumber, isNumeric } from '@vegaprotocol/utils'; +import { + addDecimal, + addDecimalsFormatNumber, + isNumeric, +} from '@vegaprotocol/utils'; import { t } from '@vegaprotocol/i18n'; import type { VegaICellRendererParams, @@ -74,6 +78,12 @@ export const AccountTable = forwardRef( resizable: true, tooltipComponent: TooltipCellComponent, sortable: true, + comparator: (valueA, valueB, nodeA, nodeB) => { + const a = addDecimal(valueA, nodeA.data.asset?.decimals); + const b = addDecimal(valueB, nodeB.data.asset?.decimals); + if (a === b) return 0; + return a > b ? 1 : -1; + }, }} {...props} pinnedTopRowData={pinnedAssetRow ? [pinnedAssetRow] : undefined} diff --git a/libs/accounts/src/lib/breakdown-table.tsx b/libs/accounts/src/lib/breakdown-table.tsx index e480f6094..f6cf96f51 100644 --- a/libs/accounts/src/lib/breakdown-table.tsx +++ b/libs/accounts/src/lib/breakdown-table.tsx @@ -1,5 +1,5 @@ import { forwardRef } from 'react'; -import { addDecimalsFormatNumber } from '@vegaprotocol/utils'; +import { addDecimal, addDecimalsFormatNumber } from '@vegaprotocol/utils'; import { t } from '@vegaprotocol/i18n'; import { Intent, @@ -33,14 +33,6 @@ export const progressBarValueFormatter = ({ }; }; -export const progressBarHeaderComponentParams = { - template: - '', -}; - interface BreakdownTableProps extends AgGridReactProps { data: AccountFields[] | null; } @@ -62,6 +54,7 @@ const BreakdownTable = forwardRef( defaultColDef={{ flex: 1, resizable: true, + sortable: true, }} > ( field="used" flex={2} maxWidth={500} - headerComponentParams={progressBarHeaderComponentParams} cellRendererSelector={progressBarCellRendererSelector} valueFormatter={progressBarValueFormatter} + comparator={( + valueA: string, + valueB: string, + nodeA: { data: AccountFields }, + nodeB: { data: AccountFields } + ) => { + let a = valueA, + b = valueB; + a = addDecimal(nodeA.data.balance, nodeA.data.asset?.decimals); + b = addDecimal(nodeB.data.balance, nodeB.data.asset?.decimals); + + if (a === b) return 0; + return a > b ? 1 : -1; + }} /> );