diff --git a/libs/positions/src/lib/positions-manager.tsx b/libs/positions/src/lib/positions-manager.tsx index f251d1631..88eca9578 100644 --- a/libs/positions/src/lib/positions-manager.tsx +++ b/libs/positions/src/lib/positions-manager.tsx @@ -24,11 +24,7 @@ export const PositionsManager = ({ }: PositionsManagerProps) => { const gridRef = useRef(null); const [dataCount, setDataCount] = useState(0); - const { data, error, loading, reload } = usePositionsData( - partyId, - gridRef, - true - ); + const { data, error, loading, reload } = usePositionsData(partyId, gridRef); const create = useVegaTransactionStore((store) => store.create); const onClose = ({ marketId, @@ -72,7 +68,7 @@ export const PositionsManager = ({ }); useEffect(() => { setDataCount(gridRef.current?.api?.getModel().getRowCount() ?? 0); - }, [data?.length]); + }, [data]); const onFilterChanged = useCallback((event: FilterChangedEvent) => { setDataCount(gridRef.current?.api?.getModel().getRowCount() ?? 0); }, []); diff --git a/libs/positions/src/lib/use-positions-data.tsx b/libs/positions/src/lib/use-positions-data.tsx index ebf640d1d..6759639ef 100644 --- a/libs/positions/src/lib/use-positions-data.tsx +++ b/libs/positions/src/lib/use-positions-data.tsx @@ -6,13 +6,13 @@ import { positionsMetricsProvider } from './positions-data-providers'; import type { PositionsQueryVariables } from './__generated__/Positions'; import { useDataProvider, updateGridData } from '@vegaprotocol/react-helpers'; import type { GetRowsParams } from '@vegaprotocol/datagrid'; +import isEqual from 'lodash/isEqual'; export const getRowId = ({ data }: { data: Position }) => data.marketId; export const usePositionsData = ( partyId: string, - gridRef: RefObject, - clientSideModel?: boolean + gridRef: RefObject ) => { const variables = useMemo( () => ({ partyId }), @@ -21,9 +21,30 @@ export const usePositionsData = ( const dataRef = useRef(null); const update = useCallback( ({ data }: { data: Position[] | null }) => { - return clientSideModel ? false : updateGridData(dataRef, data, gridRef); + if (gridRef.current?.api?.getModel().getType() === 'infinite') { + return updateGridData(dataRef, data, gridRef); + } + + const update: Position[] = []; + const add: Position[] = []; + data?.forEach((d) => { + const rowNode = gridRef.current?.api?.getRowNode(d.marketId); + if (rowNode) { + if (!isEqual(rowNode.data, d)) { + update.push(d); + } + } else { + add.push(d); + } + }); + gridRef.current?.api?.applyTransaction({ + update, + add, + addIndex: 0, + }); + return true; }, - [gridRef, clientSideModel] + [gridRef] ); const { data, error, loading, reload } = useDataProvider({ dataProvider: positionsMetricsProvider,