diff --git a/apps/trading-e2e/src/integration/trading-portfolio.cy.ts b/apps/trading-e2e/src/integration/trading-portfolio.cy.ts index 9530e15a3..a9de304cf 100644 --- a/apps/trading-e2e/src/integration/trading-portfolio.cy.ts +++ b/apps/trading-e2e/src/integration/trading-portfolio.cy.ts @@ -32,7 +32,9 @@ describe('Portfolio page', { tags: '@smoke' }, () => { cy.wrap($header).should('have.text', headers[i]); }); }); - cy.get('.ag-center-cols-container .ag-row').should( + cy.get( + '[data-testid="tab-ledger-entries"] .ag-center-cols-container .ag-row' + ).should( 'have.length', generateLedgerEntries().ledgerEntries.edges.length ); diff --git a/libs/accounts/src/lib/accounts-manager.spec.tsx b/libs/accounts/src/lib/accounts-manager.spec.tsx index 8c0609bd7..241d72710 100644 --- a/libs/accounts/src/lib/accounts-manager.spec.tsx +++ b/libs/accounts/src/lib/accounts-manager.spec.tsx @@ -1,12 +1,23 @@ -import { act, render } from '@testing-library/react'; -import { AccountManager } from './accounts-manager'; +import { act, render, screen, waitFor } from '@testing-library/react'; import * as helpers from '@vegaprotocol/react-helpers'; +import type { AccountFields } from './accounts-data-provider'; +import { AccountManager } from './accounts-manager'; +let mockedUpdate: ({ + delta, + data, +}: { + delta?: never; + data: AccountFields[] | null; +}) => boolean; jest.mock('@vegaprotocol/react-helpers', () => ({ ...jest.requireActual('@vegaprotocol/react-helpers'), - useDataProvider: jest.fn(() => ({ - data: [], - })), + useDataProvider: jest.fn((args) => { + mockedUpdate = args.update; + return { + data: [], + }; + }), })); describe('AccountManager', () => { @@ -24,4 +35,22 @@ describe('AccountManager', () => { (helpers.useDataProvider as jest.Mock).mock.calls[1][0].variables.partyId ).toEqual('partyTwo'); }); + + it('update method should return proper result', async () => { + await act(() => { + render(); + }); + await waitFor(() => { + expect(screen.getByText('No accounts')).toBeInTheDocument(); + }); + expect(mockedUpdate({ data: [] })).toEqual(true); + expect( + mockedUpdate({ data: [{ party: { id: 't1' } }] as AccountFields[] }) + ).toEqual(false); + expect( + mockedUpdate({ data: [{ party: { id: 't2' } }] as AccountFields[] }) + ).toEqual(true); + expect(mockedUpdate({ data: [] })).toEqual(false); + expect(mockedUpdate({ data: [] })).toEqual(true); + }); }); diff --git a/libs/accounts/src/lib/accounts-manager.tsx b/libs/accounts/src/lib/accounts-manager.tsx index 31368fcad..67b5ef368 100644 --- a/libs/accounts/src/lib/accounts-manager.tsx +++ b/libs/accounts/src/lib/accounts-manager.tsx @@ -1,4 +1,4 @@ -import { useDataProvider } from '@vegaprotocol/react-helpers'; +import { t, useDataProvider } from '@vegaprotocol/react-helpers'; import { AsyncRenderer } from '@vegaprotocol/ui-toolkit'; import type { AgGridReact } from 'ag-grid-react'; import { useRef, useMemo, useCallback, memo } from 'react'; @@ -14,55 +14,60 @@ interface AccountManagerProps { onClickDeposit?: (assetId?: string) => void; } -export const AccountManager = memo( - ({ - onClickAsset, - onClickWithdraw, - onClickDeposit, - partyId, - }: AccountManagerProps) => { - const gridRef = useRef(null); - const dataRef = useRef(null); - const variables = useMemo(() => ({ partyId }), [partyId]); - const update = useCallback( - ({ data }: { data: AccountFields[] | null }) => { - dataRef.current = data; - gridRef.current?.api?.refreshInfiniteCache(); - return true; - }, - [gridRef] - ); +export const AccountManager = ({ + onClickAsset, + onClickWithdraw, + onClickDeposit, + partyId, +}: AccountManagerProps) => { + const gridRef = useRef(null); + const dataRef = useRef(null); + const variables = useMemo(() => ({ partyId }), [partyId]); + const update = useCallback( + ({ data }: { data: AccountFields[] | null }) => { + const isEmpty = !dataRef.current?.length; + dataRef.current = data; + gridRef.current?.api?.refreshInfiniteCache(); + return Boolean((isEmpty && !data?.length) || (!isEmpty && data?.length)); + }, + [gridRef] + ); - const { data, loading, error } = useDataProvider({ - dataProvider: aggregatedAccountsDataProvider, - update, - variables, - }); - const getRows = async ({ - successCallback, - startRow, - endRow, - }: GetRowsParams) => { + const { data, loading, error } = useDataProvider({ + dataProvider: aggregatedAccountsDataProvider, + update, + variables, + }); + const getRows = useCallback( + async ({ successCallback, startRow, endRow }: GetRowsParams) => { const rowsThisBlock = dataRef.current ? dataRef.current.slice(startRow, endRow) : []; const lastRow = dataRef.current?.length ?? -1; successCallback(rowsThisBlock, lastRow); - }; - return ( - - + +
+ - - ); - } -); +
+ + ); +}; export default memo(AccountManager);