From ef4a740b919b5fe8141792e04ad9d6026ab10a22 Mon Sep 17 00:00:00 2001
From: Matthew Russell <mattrussell36@gmail.com>
Date: Mon, 25 Sep 2023 17:26:06 -0400
Subject: [PATCH] fix(trading): allotment breaking [main] (#4875)

---
 .../src/app/components/assets/assets-table.tsx  |  2 +-
 .../app/components/markets/markets-table.tsx    |  2 +-
 .../components/proposals/proposals-table.tsx    |  4 ++--
 .../consensus-validators-table.tsx              | 10 +++++-----
 .../standby-pending-validators-table.tsx        |  2 +-
 apps/trading/client-pages/markets/closed.tsx    |  2 +-
 .../client-pages/markets/market-list-table.tsx  |  2 +-
 libs/accounts/src/lib/accounts-table.tsx        |  2 +-
 libs/accounts/src/lib/breakdown-table.tsx       |  2 +-
 libs/datagrid/src/index.ts                      |  2 +-
 libs/datagrid/src/lib/ag-grid/ag-grid-lazy.tsx  | 17 -----------------
 ...-grid-lazy-themed.tsx => ag-grid-themed.tsx} |  0
 libs/datagrid/src/lib/ag-grid/ag-grid.tsx       | 12 ++++++++++++
 .../src/lib/use-datagrid-events.spec.tsx        |  9 ++++-----
 libs/deposits/src/lib/deposits-table.tsx        |  2 +-
 libs/fills/src/lib/fills-table.tsx              |  4 ++--
 libs/liquidity/src/lib/liquidity-table.tsx      |  2 +-
 .../lib/components/order-list/order-list.tsx    |  2 +-
 .../stop-orders-table/stop-orders-table.tsx     |  2 +-
 libs/positions/src/lib/positions-table.tsx      |  2 +-
 .../proposals-list/proposal-list.spec.tsx       |  3 ++-
 .../proposals-list/proposals-list.tsx           |  2 +-
 libs/trades/src/lib/trades-table.tsx            |  2 +-
 libs/withdraws/src/lib/withdrawals-table.tsx    |  2 +-
 24 files changed, 43 insertions(+), 48 deletions(-)
 delete mode 100644 libs/datagrid/src/lib/ag-grid/ag-grid-lazy.tsx
 rename libs/datagrid/src/lib/ag-grid/{ag-grid-lazy-themed.tsx => ag-grid-themed.tsx} (100%)
 create mode 100644 libs/datagrid/src/lib/ag-grid/ag-grid.tsx

diff --git a/apps/explorer/src/app/components/assets/assets-table.tsx b/apps/explorer/src/app/components/assets/assets-table.tsx
index fb245be95..af3959d7a 100644
--- a/apps/explorer/src/app/components/assets/assets-table.tsx
+++ b/apps/explorer/src/app/components/assets/assets-table.tsx
@@ -4,7 +4,7 @@ import { AssetTypeMapping, AssetStatusMapping } from '@vegaprotocol/assets';
 import { t } from '@vegaprotocol/i18n';
 import { ButtonLink } from '@vegaprotocol/ui-toolkit';
 import type { AgGridReact } from 'ag-grid-react';
-import { AgGridLazy as AgGrid } from '@vegaprotocol/datagrid';
+import { AgGrid } from '@vegaprotocol/datagrid';
 import type { VegaICellRendererParams } from '@vegaprotocol/datagrid';
 import { useRef, useLayoutEffect } from 'react';
 import { BREAKPOINT_MD } from '../../config/breakpoints';
diff --git a/apps/explorer/src/app/components/markets/markets-table.tsx b/apps/explorer/src/app/components/markets/markets-table.tsx
index 32665f6d2..cee340eb4 100644
--- a/apps/explorer/src/app/components/markets/markets-table.tsx
+++ b/apps/explorer/src/app/components/markets/markets-table.tsx
@@ -4,7 +4,7 @@ import { t } from '@vegaprotocol/i18n';
 import { ButtonLink } from '@vegaprotocol/ui-toolkit';
 import type { AgGridReact } from 'ag-grid-react';
 import type { ColDef } from 'ag-grid-community';
-import { AgGridLazy as AgGrid } from '@vegaprotocol/datagrid';
+import { AgGrid } from '@vegaprotocol/datagrid';
 import type {
   VegaICellRendererParams,
   VegaValueGetterParams,
diff --git a/apps/explorer/src/app/components/proposals/proposals-table.tsx b/apps/explorer/src/app/components/proposals/proposals-table.tsx
index 2986def3d..2bfb32992 100644
--- a/apps/explorer/src/app/components/proposals/proposals-table.tsx
+++ b/apps/explorer/src/app/components/proposals/proposals-table.tsx
@@ -2,7 +2,7 @@ import type { ProposalListFieldsFragment } from '@vegaprotocol/proposals';
 import { VoteProgress } from '@vegaprotocol/proposals';
 import type { AgGridReact } from 'ag-grid-react';
 import { ExternalLink } from '@vegaprotocol/ui-toolkit';
-import { AgGridLazy as AgGrid } from '@vegaprotocol/datagrid';
+import { AgGrid } from '@vegaprotocol/datagrid';
 import type {
   VegaICellRendererParams,
   VegaValueFormatterParams,
@@ -105,7 +105,7 @@ export const ProposalsTable = ({ data }: ProposalsTableProps) => {
               ? new BigNumber(0)
               : yesTokens.multipliedBy(100).dividedBy(totalTokensVoted);
             return (
-              <div className="uppercase flex h-full items-center justify-center pt-2">
+              <div className="flex items-center justify-center h-full pt-2 uppercase">
                 <VoteProgress
                   threshold={requiredMajorityPercentage}
                   progress={yesPercentage}
diff --git a/apps/governance/src/routes/staking/home/validator-tables/consensus-validators-table.tsx b/apps/governance/src/routes/staking/home/validator-tables/consensus-validators-table.tsx
index b9b42cad3..2a07ddc76 100644
--- a/apps/governance/src/routes/staking/home/validator-tables/consensus-validators-table.tsx
+++ b/apps/governance/src/routes/staking/home/validator-tables/consensus-validators-table.tsx
@@ -3,7 +3,7 @@ import { forwardRef, useMemo, useRef, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { useNavigate } from 'react-router-dom';
 import { Button, Icon } from '@vegaprotocol/ui-toolkit';
-import { AgGridLazy as AgGrid } from '@vegaprotocol/datagrid';
+import { AgGrid } from '@vegaprotocol/datagrid';
 import { useAppState } from '../../../../contexts/app-state/app-state-context';
 import { BigNumber } from '../../../../lib/bignumber';
 import {
@@ -85,17 +85,17 @@ const TopThirdCellRenderer = (
       }}
       className="grid grid-cols-[60px_1fr] w-full h-full py-4 px-0 text-sm text-white text-center overflow-scroll"
     >
-      <div className="text-xs text-left px-3">
+      <div className="px-3 text-xs text-left">
         {params?.data?.rankingDisplay}
       </div>
-      <div className="whitespace-normal px-3">
+      <div className="px-3 whitespace-normal">
         <div className="mb-4">
           <Button
             data-testid="show-all-validators"
             rightIcon={
               <Icon
                 name="arrow-right"
-                className="fill-current mr-2 align-text-top"
+                className="mr-2 align-text-top fill-current"
               />
             }
             className="inline-flex items-center"
@@ -103,7 +103,7 @@ const TopThirdCellRenderer = (
             {t('Reveal top validators')}
           </Button>
         </div>
-        <p className="font-semibold text-white mb-0">
+        <p className="mb-0 font-semibold text-white">
           {t(
             'Validators with too great a stake share will have the staking rewards for their delegators penalised.'
           )}
diff --git a/apps/governance/src/routes/staking/home/validator-tables/standby-pending-validators-table.tsx b/apps/governance/src/routes/staking/home/validator-tables/standby-pending-validators-table.tsx
index f1553756a..164f29b4f 100644
--- a/apps/governance/src/routes/staking/home/validator-tables/standby-pending-validators-table.tsx
+++ b/apps/governance/src/routes/staking/home/validator-tables/standby-pending-validators-table.tsx
@@ -1,7 +1,7 @@
 import { forwardRef, useMemo, useRef } from 'react';
 import { useTranslation } from 'react-i18next';
 import { useNavigate } from 'react-router-dom';
-import { AgGridLazy as AgGrid } from '@vegaprotocol/datagrid';
+import { AgGrid } from '@vegaprotocol/datagrid';
 import { useAppState } from '../../../../contexts/app-state/app-state-context';
 import { BigNumber } from '../../../../lib/bignumber';
 import {
diff --git a/apps/trading/client-pages/markets/closed.tsx b/apps/trading/client-pages/markets/closed.tsx
index 03b49b31f..a1ebba418 100644
--- a/apps/trading/client-pages/markets/closed.tsx
+++ b/apps/trading/client-pages/markets/closed.tsx
@@ -4,7 +4,7 @@ import type {
   VegaICellRendererParams,
   VegaValueFormatterParams,
 } from '@vegaprotocol/datagrid';
-import { AgGridLazy as AgGrid, COL_DEFS } from '@vegaprotocol/datagrid';
+import { AgGrid, COL_DEFS } from '@vegaprotocol/datagrid';
 import { useMemo } from 'react';
 import { t } from '@vegaprotocol/i18n';
 import type { ProductType } from '@vegaprotocol/types';
diff --git a/apps/trading/client-pages/markets/market-list-table.tsx b/apps/trading/client-pages/markets/market-list-table.tsx
index 8ead66f63..22772efe6 100644
--- a/apps/trading/client-pages/markets/market-list-table.tsx
+++ b/apps/trading/client-pages/markets/market-list-table.tsx
@@ -1,5 +1,5 @@
 import type { TypedDataAgGrid } from '@vegaprotocol/datagrid';
-import { AgGridLazy as AgGrid, PriceFlashCell } from '@vegaprotocol/datagrid';
+import { AgGrid, PriceFlashCell } from '@vegaprotocol/datagrid';
 import type { MarketMaybeWithData } from '@vegaprotocol/markets';
 import { useColumnDefs } from './use-column-defs';
 
diff --git a/libs/accounts/src/lib/accounts-table.tsx b/libs/accounts/src/lib/accounts-table.tsx
index 413eb9338..d01c33d19 100644
--- a/libs/accounts/src/lib/accounts-table.tsx
+++ b/libs/accounts/src/lib/accounts-table.tsx
@@ -18,7 +18,7 @@ import {
   VegaIconNames,
   TooltipCellComponent,
 } from '@vegaprotocol/ui-toolkit';
-import { AgGridLazy as AgGrid } from '@vegaprotocol/datagrid';
+import { AgGrid } from '@vegaprotocol/datagrid';
 import type {
   IGetRowsParams,
   IRowNode,
diff --git a/libs/accounts/src/lib/breakdown-table.tsx b/libs/accounts/src/lib/breakdown-table.tsx
index a782283f5..d7fc7ae26 100644
--- a/libs/accounts/src/lib/breakdown-table.tsx
+++ b/libs/accounts/src/lib/breakdown-table.tsx
@@ -13,7 +13,7 @@ import type {
   VegaICellRendererParams,
 } from '@vegaprotocol/datagrid';
 import { ProgressBarCell } from '@vegaprotocol/datagrid';
-import { AgGridLazy as AgGrid, PriceCell } from '@vegaprotocol/datagrid';
+import { AgGrid, PriceCell } from '@vegaprotocol/datagrid';
 import type { ColDef } from 'ag-grid-community';
 import { accountValuesComparator } from './accounts-table';
 import { MarginHealthChart } from './margin-health-chart';
diff --git a/libs/datagrid/src/index.ts b/libs/datagrid/src/index.ts
index b166a9b7c..22fd937be 100644
--- a/libs/datagrid/src/index.ts
+++ b/libs/datagrid/src/index.ts
@@ -1,4 +1,4 @@
-export * from './lib/ag-grid/ag-grid-lazy';
+export * from './lib/ag-grid/ag-grid';
 
 export * from './lib/column-definitions';
 
diff --git a/libs/datagrid/src/lib/ag-grid/ag-grid-lazy.tsx b/libs/datagrid/src/lib/ag-grid/ag-grid-lazy.tsx
deleted file mode 100644
index 5d550d940..000000000
--- a/libs/datagrid/src/lib/ag-grid/ag-grid-lazy.tsx
+++ /dev/null
@@ -1,17 +0,0 @@
-import { forwardRef, lazy } from 'react';
-import type { AgGridReactProps, AgGridReact } from 'ag-grid-react';
-
-type Props = AgGridReactProps & {
-  style?: React.CSSProperties;
-  gridRef?: React.Ref<AgGridReact>;
-};
-
-export const AgGridLazyInternal = lazy(() =>
-  import('./ag-grid-lazy-themed').then((module) => ({
-    default: module.AgGridThemed,
-  }))
-);
-
-export const AgGridLazy = forwardRef<AgGridReact, Props>((props, ref) => (
-  <AgGridLazyInternal {...props} gridRef={ref} />
-));
diff --git a/libs/datagrid/src/lib/ag-grid/ag-grid-lazy-themed.tsx b/libs/datagrid/src/lib/ag-grid/ag-grid-themed.tsx
similarity index 100%
rename from libs/datagrid/src/lib/ag-grid/ag-grid-lazy-themed.tsx
rename to libs/datagrid/src/lib/ag-grid/ag-grid-themed.tsx
diff --git a/libs/datagrid/src/lib/ag-grid/ag-grid.tsx b/libs/datagrid/src/lib/ag-grid/ag-grid.tsx
new file mode 100644
index 000000000..2f0d99c1a
--- /dev/null
+++ b/libs/datagrid/src/lib/ag-grid/ag-grid.tsx
@@ -0,0 +1,12 @@
+import { forwardRef } from 'react';
+import type { AgGridReactProps, AgGridReact } from 'ag-grid-react';
+import { AgGridThemed } from './ag-grid-themed';
+
+type Props = AgGridReactProps & {
+  style?: React.CSSProperties;
+  gridRef?: React.Ref<AgGridReact>;
+};
+
+export const AgGrid = forwardRef<AgGridReact, Props>((props, ref) => (
+  <AgGridThemed {...props} gridRef={ref} />
+));
diff --git a/libs/datagrid/src/lib/use-datagrid-events.spec.tsx b/libs/datagrid/src/lib/use-datagrid-events.spec.tsx
index 02504be2f..486a2f3b7 100644
--- a/libs/datagrid/src/lib/use-datagrid-events.spec.tsx
+++ b/libs/datagrid/src/lib/use-datagrid-events.spec.tsx
@@ -1,13 +1,12 @@
 import { act, render, waitFor } from '@testing-library/react';
-import {
-  useDataGridEvents,
-  GRID_EVENT_DEBOUNCE_TIME,
-} from './use-datagrid-events';
-import { AgGridThemed } from './ag-grid/ag-grid-lazy-themed';
+import { useDataGridEvents } from './use-datagrid-events';
+import { AgGridThemed } from './ag-grid/ag-grid-themed';
 import type { MutableRefObject } from 'react';
 import { useRef } from 'react';
 import type { AgGridReact } from 'ag-grid-react';
 
+const GRID_EVENT_DEBOUNCE_TIME = 500;
+
 const gridProps = {
   rowData: [{ id: 1 }],
   columnDefs: [
diff --git a/libs/deposits/src/lib/deposits-table.tsx b/libs/deposits/src/lib/deposits-table.tsx
index e7f77df02..6f2e7fee1 100644
--- a/libs/deposits/src/lib/deposits-table.tsx
+++ b/libs/deposits/src/lib/deposits-table.tsx
@@ -6,7 +6,7 @@ import {
   isNumeric,
 } from '@vegaprotocol/utils';
 import type { ColDef } from 'ag-grid-community';
-import { AgGridLazy as AgGrid } from '@vegaprotocol/datagrid';
+import { AgGrid } from '@vegaprotocol/datagrid';
 import type {
   VegaICellRendererParams,
   VegaValueFormatterParams,
diff --git a/libs/fills/src/lib/fills-table.tsx b/libs/fills/src/lib/fills-table.tsx
index 65351ae48..967d816e6 100644
--- a/libs/fills/src/lib/fills-table.tsx
+++ b/libs/fills/src/lib/fills-table.tsx
@@ -15,7 +15,7 @@ import {
 import { t } from '@vegaprotocol/i18n';
 import * as Schema from '@vegaprotocol/types';
 import {
-  AgGridLazy as AgGrid,
+  AgGrid,
   positiveClassNames,
   negativeClassNames,
   MarketNameCell,
@@ -300,7 +300,7 @@ const FeesBreakdownTooltip = ({
   return (
     <div
       data-testid="fee-breakdown-tooltip"
-      className="max-w-sm bg-vega-light-100 dark:bg-vega-dark-100 border border-vega-light-200 dark:border-vega-dark-200 px-4 py-2 z-20 rounded text-sm break-word text-black dark:text-white"
+      className="z-20 max-w-sm px-4 py-2 text-sm text-black border rounded bg-vega-light-100 dark:bg-vega-dark-100 border-vega-light-200 dark:border-vega-dark-200 break-word dark:text-white"
     >
       {role === MAKER && (
         <>
diff --git a/libs/liquidity/src/lib/liquidity-table.tsx b/libs/liquidity/src/lib/liquidity-table.tsx
index cd594ba0f..63b54a31e 100644
--- a/libs/liquidity/src/lib/liquidity-table.tsx
+++ b/libs/liquidity/src/lib/liquidity-table.tsx
@@ -7,7 +7,7 @@ import {
 } from '@vegaprotocol/utils';
 import { t } from '@vegaprotocol/i18n';
 import type { TypedDataAgGrid } from '@vegaprotocol/datagrid';
-import { AgGridLazy as AgGrid } from '@vegaprotocol/datagrid';
+import { AgGrid } from '@vegaprotocol/datagrid';
 import { TooltipCellComponent } from '@vegaprotocol/ui-toolkit';
 import type {
   ColDef,
diff --git a/libs/orders/src/lib/components/order-list/order-list.tsx b/libs/orders/src/lib/components/order-list/order-list.tsx
index a98821a53..7bba17e75 100644
--- a/libs/orders/src/lib/components/order-list/order-list.tsx
+++ b/libs/orders/src/lib/components/order-list/order-list.tsx
@@ -17,7 +17,7 @@ import {
 import type { ForwardedRef } from 'react';
 import { memo, forwardRef, useMemo } from 'react';
 import {
-  AgGridLazy as AgGrid,
+  AgGrid,
   SetFilter,
   DateRangeFilter,
   negativeClassNames,
diff --git a/libs/orders/src/lib/components/stop-orders-table/stop-orders-table.tsx b/libs/orders/src/lib/components/stop-orders-table/stop-orders-table.tsx
index 5c8a9e049..82a3badff 100644
--- a/libs/orders/src/lib/components/stop-orders-table/stop-orders-table.tsx
+++ b/libs/orders/src/lib/components/stop-orders-table/stop-orders-table.tsx
@@ -18,7 +18,7 @@ import {
 } from '@vegaprotocol/ui-toolkit';
 import { memo, useMemo } from 'react';
 import {
-  AgGridLazy as AgGrid,
+  AgGrid,
   SetFilter,
   DateRangeFilter,
   negativeClassNames,
diff --git a/libs/positions/src/lib/positions-table.tsx b/libs/positions/src/lib/positions-table.tsx
index 097149226..8b049cf3c 100644
--- a/libs/positions/src/lib/positions-table.tsx
+++ b/libs/positions/src/lib/positions-table.tsx
@@ -8,7 +8,7 @@ import type {
   VegaICellRendererParams,
 } from '@vegaprotocol/datagrid';
 import {
-  AgGridLazy as AgGrid,
+  AgGrid,
   COL_DEFS,
   PriceFlashCell,
   signedNumberCssClassRules,
diff --git a/libs/proposals/src/components/proposals-list/proposal-list.spec.tsx b/libs/proposals/src/components/proposals-list/proposal-list.spec.tsx
index 80354dbc1..65d723f55 100644
--- a/libs/proposals/src/components/proposals-list/proposal-list.spec.tsx
+++ b/libs/proposals/src/components/proposals-list/proposal-list.spec.tsx
@@ -100,7 +100,8 @@ describe('ProposalsList', () => {
     const container = within(
       document.querySelector(rowContainerSelector) as HTMLElement
     );
-    expect(container.getAllByRole('row')).toHaveLength(
+
+    expect(await container.findAllByRole('row')).toHaveLength(
       // @ts-ignore data is mocked
       mock?.result?.data.proposalsConnection.edges.length
     );
diff --git a/libs/proposals/src/components/proposals-list/proposals-list.tsx b/libs/proposals/src/components/proposals-list/proposals-list.tsx
index d4cd1a8c2..387395c19 100644
--- a/libs/proposals/src/components/proposals-list/proposals-list.tsx
+++ b/libs/proposals/src/components/proposals-list/proposals-list.tsx
@@ -1,5 +1,5 @@
 import type { FC } from 'react';
-import { AgGridLazy as AgGrid } from '@vegaprotocol/datagrid';
+import { AgGrid } from '@vegaprotocol/datagrid';
 import { t } from '@vegaprotocol/i18n';
 import * as Types from '@vegaprotocol/types';
 import { removePaginationWrapper } from '@vegaprotocol/utils';
diff --git a/libs/trades/src/lib/trades-table.tsx b/libs/trades/src/lib/trades-table.tsx
index 66c271738..02ec5750c 100644
--- a/libs/trades/src/lib/trades-table.tsx
+++ b/libs/trades/src/lib/trades-table.tsx
@@ -4,7 +4,7 @@ import type {
   VegaICellRendererParams,
   VegaValueFormatterParams,
 } from '@vegaprotocol/datagrid';
-import { AgGridLazy as AgGrid, NumericCell } from '@vegaprotocol/datagrid';
+import { AgGrid, NumericCell } from '@vegaprotocol/datagrid';
 import {
   addDecimal,
   addDecimalsFormatNumber,
diff --git a/libs/withdraws/src/lib/withdrawals-table.tsx b/libs/withdraws/src/lib/withdrawals-table.tsx
index e4992c9b4..53d66c632 100644
--- a/libs/withdraws/src/lib/withdrawals-table.tsx
+++ b/libs/withdraws/src/lib/withdrawals-table.tsx
@@ -20,7 +20,7 @@ import type {
   VegaICellRendererParams,
   VegaValueFormatterParams,
 } from '@vegaprotocol/datagrid';
-import { AgGridLazy as AgGrid } from '@vegaprotocol/datagrid';
+import { AgGrid } from '@vegaprotocol/datagrid';
 import { EtherscanLink } from '@vegaprotocol/environment';
 import type { WithdrawalFieldsFragment } from './__generated__/Withdrawal';
 import {