dev: remove usage of depreacted ag-grid API (finos#3290)

akphi · Jun 25, 2024 · 501792a · 501792a
1 parent 09d9aca
commit 501792a
Show file tree

Hide file tree

Showing 4 changed files with 18 additions and 17 deletions.
diff --git a/.changeset/brown-trees-call.md b/.changeset/brown-trees-call.md
@@ -0,0 +1,4 @@
+---
+'@finos/legend-query-builder': patch
+'@finos/legend-lego': patch
+---
diff --git a/packages/legend-lego/src/data-grid/DataGrid.tsx b/packages/legend-lego/src/data-grid/DataGrid.tsx
@@ -36,7 +36,6 @@ import {
   type CellMouseOverEvent,
   type ICellRendererParams,
   type GridOptions,
-  type ColumnApi,
   type ColDef,
   type ColumnState,
   type GridApi,
@@ -98,7 +97,6 @@ export type {
   GridOptions as DataGridOptions,
   ColDef as DataGridColumnDefinition,
   ColumnState as DataGridColumnState,
-  ColumnApi as DataGridColumnApi,
   GridApi as DataGridApi,
   IRowNode as DataGridIRowNode,
   GetContextMenuItemsParams as DataGridGetContextMenuItemsParams,

diff --git a/packages/legend-query-builder/src/components/result/tds/QueryBuilderTDSGridResult.tsx b/packages/legend-query-builder/src/components/result/tds/QueryBuilderTDSGridResult.tsx
@@ -22,7 +22,6 @@ import {
   DataGrid,
   type DataGridApi,
   type DataGridCellRange,
-  type DataGridColumnApi,
   type DataGridColumnDefinition,
   type DataGridGetContextMenuItemsParams,
   type DataGridIRowNode,
@@ -249,9 +248,7 @@ export const QueryBuilderTDSGridResult = observer(
     const applicationStore = useApplicationStore();
     const darkMode =
       !applicationStore.layoutService.TEMPORARY__isLightColorThemeEnabled;
-    const [columnAPi, setColumnApi] = useState<DataGridColumnApi | undefined>(
-      undefined,
-    );
+    const [gridApi, setGridApi] = useState<DataGridApi | undefined>(undefined);
     const [aggFuncParams, setAggFuncParams] = useState<
       DataGridIAggFuncParams | undefined
     >(undefined);
@@ -262,12 +259,12 @@ export const QueryBuilderTDSGridResult = observer(
       : getColDefs(executionResult, resultState);
 
     const onSaveGridColumnState = (): void => {
-      if (!columnAPi) {
+      if (!gridApi) {
         return;
       }
       resultState.setGridConfig({
-        columns: columnAPi.getColumnState(),
-        isPivotModeEnabled: columnAPi.isPivotMode(),
+        columns: gridApi.getColumnState(),
+        isPivotModeEnabled: gridApi.isPivotMode(),
         isLocalModeEnabled: true,
         previewLimit: resultState.previewLimit,
         ...(resultState.wavgAggregationState?.weightedColumnIdPairs && {
@@ -368,7 +365,7 @@ export const QueryBuilderTDSGridResult = observer(
       ],
     );
 
-    const weightedColumnOptions = columnAPi
+    const weightedColumnOptions = gridApi
       ?.getColumns()
       ?.filter((c) => c.getColDef().cellDataType === 'number')
       .map((col) => ({
@@ -458,7 +455,7 @@ export const QueryBuilderTDSGridResult = observer(
 
     useEffect(() => {
       if (aggFuncParams) {
-        aggFuncParams.columnApi.setColumnAggFunc(
+        aggFuncParams.api.setColumnAggFunc(
           aggFuncParams.colDef.field!,
           QueryBuilderDataGridCustomAggregationFunction.WAVG,
         );
@@ -480,10 +477,12 @@ export const QueryBuilderTDSGridResult = observer(
             <DataGrid
               rowData={getRowDataFromExecutionResult(executionResult)}
               onGridReady={(params): void => {
-                setColumnApi(params.columnApi);
-                params.columnApi.setPivotMode(
-                  Boolean(resultState.gridConfig?.isPivotModeEnabled),
-                );
+                setGridApi(params.api);
+                params.api.updateGridOptions({
+                  pivotMode: Boolean(
+                    resultState.gridConfig?.isPivotModeEnabled,
+                  ),
+                });
               }}
               gridOptions={{
                 suppressScrollOnNewData: true,

diff --git a/packages/legend-query-builder/src/components/result/tds/QueryBuilderTDSSimpleGridResult.tsx b/packages/legend-query-builder/src/components/result/tds/QueryBuilderTDSSimpleGridResult.tsx
@@ -114,11 +114,11 @@ const QueryResultCellRenderer = observer(
       ) {
         return undefined;
       }
-      if (params.columnApi.getColumnState()[colIndex]?.sort === 'asc') {
+      if (params.api.getColumnState()[colIndex]?.sort === 'asc') {
         resultState.executionResult.result.rows.sort((a, b) =>
           getTDSRowRankByColumnInAsc(a, b, colIndex),
         );
-      } else if (params.columnApi.getColumnState()[colIndex]?.sort === 'desc') {
+      } else if (params.api.getColumnState()[colIndex]?.sort === 'desc') {
         resultState.executionResult.result.rows.sort((a, b) =>
           getTDSRowRankByColumnInAsc(b, a, colIndex),
         );