chore: make loading mask consistent again

apps/trading/client-pages/portfolio/withdrawals-container.tsx

@@ -24,7 +24,8 @@ export const WithdrawalsContainer = () => {
         <WithdrawalsTable
           data-testid="withdrawals-history"
           rowData={data}
-          noRowsOverlayComponent={() => null}
+          suppressLoadingOverlay
+          suppressNoRowsOverlay
         />
         <div className="pointer-events-none absolute inset-0">
           <AsyncRenderer

libs/accounts/src/lib/accounts-manager.tsx

@@ -60,7 +60,8 @@ export const AccountManager = ({
         onClickDeposit={onClickDeposit}
         onClickWithdraw={onClickWithdraw}
         isReadOnly={isReadOnly}
-        noRowsOverlayComponent={() => null}
+        suppressLoadingOverlay
+        suppressNoRowsOverlay
         pinnedAsset={pinnedAsset}
         getRowHeight={getRowHeight}
         {...bottomPlaceholderProps}

libs/positions/src/lib/positions-manager.tsx

@@ -1,4 +1,4 @@
-import { useCallback, useRef } from 'react';
+import { useCallback, useEffect, useRef, useState } from 'react';
 import { AsyncRenderer } from '@vegaprotocol/ui-toolkit';
 import type { Position } from '../';
 import { usePositionsData, PositionsTable } from '../';
@@ -7,6 +7,7 @@ import * as Schema from '@vegaprotocol/types';
 import { useVegaTransactionStore } from '@vegaprotocol/wallet';
 import { t } from '@vegaprotocol/i18n';
 import { useBottomPlaceholder } from '@vegaprotocol/react-helpers';
+import { FilterChangedEvent } from 'ag-grid-community';
 
 interface PositionsManagerProps {
   partyId: string;
@@ -22,6 +23,7 @@ export const PositionsManager = ({
   noBottomPlaceholder,
 }: PositionsManagerProps) => {
   const gridRef = useRef<AgGridReact | null>(null);
+  const [dataCount, setDataCount] = useState(0);
   const { data, error, loading, reload } = usePositionsData(
     partyId,
     gridRef,
@@ -67,7 +69,12 @@ export const PositionsManager = ({
     gridRef,
     setId,
   });
-
+  useEffect(() => {
+    setDataCount(gridRef.current?.api?.getModel().getRowCount() ?? 0);
+  }, [data]);
+  const onFilterChanged = useCallback((event: FilterChangedEvent) => {
+    setDataCount(gridRef.current?.api?.getModel().getRowCount() ?? 0);
+  }, []);
   return (
     <div className="h-full relative">
       <PositionsTable
@@ -75,8 +82,10 @@ export const PositionsManager = ({
         ref={gridRef}
         onMarketClick={onMarketClick}
         onClose={onClose}
-        noRowsOverlayComponent={() => null}
+        suppressLoadingOverlay
+        suppressNoRowsOverlay
         isReadOnly={isReadOnly}
+        onFilterChanged={onFilterChanged}
         {...(noBottomPlaceholder ? null : bottomPlaceholderProps)}
       />
       <div className="pointer-events-none absolute inset-0">
@@ -85,7 +94,7 @@ export const PositionsManager = ({
           error={error}
           data={data}
           noDataMessage={t('No positions')}
-          noDataCondition={(data) => !(data && data.length)}
+          noDataCondition={(data) => !dataCount}
           reload={reload}
         />
       </div>