@adaptabletools/adaptable 20.0.2 → 20.0.3-canary.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@adaptabletools/adaptable",
-  "version": "20.0.2",
+  "version": "20.0.3-canary.0",
   "description": "Powerful data-agnostic HTML5 AG Grid extension which provides advanced, cutting-edge functionality to meet all DataGrid requirements",
   "keywords": [
     "web-components",

package/src/AdaptableOptions/FilterOptions.d.ts

@@ -26,7 +26,7 @@ export interface FilterOptions<TData = any> {
      */
     clearFiltersOnStartUp?: boolean;
     /**
-     * Provide custom values (or sorting / count) info when using In Filter
+     * Provide custom values (or sorting / count info) when using the `In` Filter
      * @param context
      * @returns
      */

package/src/AdaptableState/LayoutState.d.ts

@@ -51,7 +51,7 @@ export interface LayoutBase extends AdaptableObject {
      */
     ColumnHeaders?: ColumnStringMap;
     /**
-     * Hides aggFunc name in Column header: e.g. 'sum(Price)' becomes 'Price'
+     * Hides the aggFunc in Column header: e.g. 'sum(Price)' becomes 'Price'
      */
     SuppressAggFuncInHeader?: boolean;
     /**

package/src/Api/Implementation/LayoutHelpers.js

@@ -62,6 +62,8 @@ export const normalizeTableLayout = (tableLayout, options) => {
     const Source = tableLayout.Source;
     const Uuid = tableLayout.Uuid;
     const AdaptableVersion = tableLayout.AdaptableVersion;
+    const ColumnFilters = tableLayout.ColumnFilters;
+    const GridFilter = tableLayout.GridFilter;
     let model = tableLayoutToTableLayoutModel(tableLayout);
     model = normalizeTableLayoutModel(model, options);
     tableLayout = tableLayoutModelToTableLayout(model, tableLayout);
@@ -74,12 +76,20 @@ export const normalizeTableLayout = (tableLayout, options) => {
     if (AdaptableVersion) {
         tableLayout.AdaptableVersion = AdaptableVersion;
     }
+    if (ColumnFilters) {
+        tableLayout.ColumnFilters = ColumnFilters;
+    }
+    if (GridFilter) {
+        tableLayout.GridFilter = GridFilter;
+    }
     return tableLayout;
 };
 export const normalizePivotLayout = (pivotLayout) => {
     const Source = pivotLayout.Source;
     const Uuid = pivotLayout.Uuid;
     const AdaptableVersion = pivotLayout.AdaptableVersion;
+    const ColumnFilters = pivotLayout.ColumnFilters;
+    const GridFilter = pivotLayout.GridFilter;
     let model = pivotLayoutToPivotLayoutModel(pivotLayout);
     model = normalizePivotLayoutModel(model);
     pivotLayout = pivotLayoutModelToPivotLayout(model, pivotLayout);
@@ -92,6 +102,12 @@ export const normalizePivotLayout = (pivotLayout) => {
     if (AdaptableVersion) {
         pivotLayout.AdaptableVersion = AdaptableVersion;
     }
+    if (ColumnFilters) {
+        pivotLayout.ColumnFilters = ColumnFilters;
+    }
+    if (GridFilter) {
+        pivotLayout.GridFilter = GridFilter;
+    }
     return pivotLayout;
 };
 const errorOnceMessages = new Map();
@@ -160,6 +176,12 @@ export const tableLayoutToTableLayoutModel = (tableLayout) => {
     if (tableLayout.RowGroupDisplayType) {
         result.RowGroupDisplayType = tableLayout.RowGroupDisplayType;
     }
+    if (tableLayout.ColumnFilters) {
+        result.ColumnFilters = tableLayout.ColumnFilters;
+    }
+    if (tableLayout.GridFilter) {
+        result.GridFilter = tableLayout.GridFilter;
+    }
     return result;
 };
 export const pivotLayoutToPivotLayoutModel = (pivotLayout) => {
@@ -181,7 +203,24 @@ export const pivotLayoutToPivotLayoutModel = (pivotLayout) => {
                 AggFunc: toAggFunc(AggFunc),
             };
         }),
+        RowGroupValues: pivotLayout.RowGroupValues
+            ? pivotLayout.RowGroupValues.RowGroupDefaultBehavior === 'always-collapsed' ||
+                pivotLayout.RowGroupValues.RowGroupDefaultBehavior === 'always-expanded'
+                ? {
+                    RowGroupDisplay: pivotLayout.RowGroupValues.RowGroupDefaultBehavior,
+                }
+                : {
+                    RowGroupDisplay: pivotLayout.RowGroupValues.RowGroupDefaultBehavior,
+                    Values: pivotLayout.RowGroupValues.ExceptionGroupKeys || [],
+                }
+            : undefined,
     });
+    if (pivotLayout.ColumnFilters) {
+        result.ColumnFilters = pivotLayout.ColumnFilters;
+    }
+    if (pivotLayout.GridFilter) {
+        result.GridFilter = pivotLayout.GridFilter;
+    }
     return result;
 };
 function toAggFunc(aggFunc) {
@@ -238,6 +277,12 @@ export const tableLayoutModelToTableLayout = (layoutModel, defaults) => {
     else {
         delete tableLayout.TableAggregationColumns;
     }
+    if (layoutModel.ColumnFilters) {
+        tableLayout.ColumnFilters = layoutModel.ColumnFilters;
+    }
+    if (layoutModel.GridFilter) {
+        tableLayout.GridFilter = layoutModel.GridFilter;
+    }
     cleanupAdaptableObjectPrimitives(tableLayout);
     return tableLayout;
 };
@@ -267,7 +312,18 @@ export const pivotLayoutModelToPivotLayout = (layoutModel, defaults) => {
     else {
         delete pivotLayout.PivotGroupedColumns;
     }
-    if (!layoutModel.RowGroupValues) {
+    if (layoutModel.RowGroupValues) {
+        pivotLayout.RowGroupValues = {
+            RowGroupDefaultBehavior: layoutModel.RowGroupValues.RowGroupDisplay,
+        };
+        if ((layoutModel.RowGroupValues.RowGroupDisplay === 'collapsed' ||
+            layoutModel.RowGroupValues.RowGroupDisplay === 'expanded') &&
+            layoutModel.RowGroupValues.Values) {
+            // @ts-ignore
+            pivotLayout.RowGroupValues.ExceptionGroupKeys = layoutModel.RowGroupValues.Values;
+        }
+    }
+    else {
         delete pivotLayout.RowGroupValues;
     }
     if (layoutModel.PivotAggregationColumns) {
@@ -279,6 +335,12 @@ export const pivotLayoutModelToPivotLayout = (layoutModel, defaults) => {
     else {
         delete pivotLayout.PivotAggregationColumns;
     }
+    if (layoutModel.ColumnFilters) {
+        pivotLayout.ColumnFilters = layoutModel.ColumnFilters;
+    }
+    if (layoutModel.GridFilter) {
+        pivotLayout.GridFilter = layoutModel.GridFilter;
+    }
     return pivotLayout;
 };
 export const isPivotLayout = (layout) => Array.isArray(layout.PivotColumns);

package/src/Api/Internal/LayoutInternalApi.js

@@ -148,7 +148,7 @@ export class LayoutInternalApi extends ApiBase {
         if (!layout) {
             layout = this.getLayoutApi().getCurrentLayout();
         }
-        return layout?.RowGroupedColumns?.length > 0;
+        return (layout?.RowGroupedColumns?.length || layout?.PivotGroupedColumns?.length) > 0;
     }
     setupRowSummaries() {
         const rowSummaries = this.getAdaptableState().Internal?.RowSummary?.rowSummaries ?? [];

package/src/Redux/Store/AdaptableStore.js

@@ -923,7 +923,8 @@ const adaptableMiddleware = (adaptable) => (function(middlewareAPI) {
                  * Action: Apply Column Filtering and fire associated events
                  */
                 case LayoutRedux.LAYOUT_COLUMN_FILTER_ADD:
-                case LayoutRedux.LAYOUT_COLUMN_FILTER_EDIT:
+                // see ref "also-this-handles-the-LAYOUT_COLUMN_FILTER_EDIT-case"
+                // case LayoutRedux.LAYOUT_COLUMN_FILTER_EDIT:
                 case LayoutRedux.LAYOUT_COLUMN_FILTER_SET:
                 case LayoutRedux.LAYOUT_COLUMN_FILTER_CLEAR:
                 case LayoutRedux.LAYOUT_COLUMN_FILTER_CLEAR_ALL:
@@ -940,7 +941,7 @@ const adaptableMiddleware = (adaptable) => (function(middlewareAPI) {
                         if (shouldTriggerColumnFiltering) {
                             adaptable.applyFiltering();
                         }
-                    }, 5);
+                    }, 50);
                     adaptable.api.eventApi.internalApi.fireColumnFilterAppliedEvent();
                     adaptable.api.eventApi.internalApi.fireLayoutChangedEvent(action.type, oldLayoutState, middlewareAPI.getState().Layout);
                     return returnAction;

package/src/View/Components/Selectors/BulkUpdateValueSelector.js

@@ -18,7 +18,7 @@ export const BulkUpdateValueSelector = (props) => {
     // not sure that we need to
     const permittedValueSelector = (React.createElement(Box, null,
         React.createElement(PermittedValuesSelector, { allowNewValues: true, disabled: props.disabled || !props.selectedColumn, value: props.selectedColumnValue === '' ? null : props.selectedColumnValue, columnId: columnId, placeholder: isDateType ? 'Select' : 'Select or type new value', loadValues: useCallback(({ currentSearchValue }) => {
-                if (!columnId) {
+                if (!columnId || !props.selectedGridCells.length) {
                     return Promise.resolve([]);
                 }
                 return adaptable.api.gridApi.internalApi.getDistinctEditDisplayValuesForColumn({
@@ -28,8 +28,8 @@ export const BulkUpdateValueSelector = (props) => {
                 });
             }, [
                 columnId,
-                props.selectedGridCells[0]?.column.columnId,
-                props.selectedGridCells[0]?.primaryKeyValue,
+                props.selectedGridCells?.[0]?.column.columnId,
+                props.selectedGridCells?.[0]?.primaryKeyValue,
             ]), onChange: (value) => {
                 props.onColumnValueChange(value || null);
             } })));

package/src/agGrid/AdaptableAgGrid.js

@@ -90,7 +90,7 @@ import { weightedAverage } from '../Utilities/weightedAverage';
 import { ROW_SUMMARY_ROW_ID } from '../AdaptableState/Common/RowSummary';
 import { FlashingCellService } from '../Utilities/Services/FlashingCellService';
 import { AgGridExportAdapter } from './AgGridExportAdapter';
-import { checkForDuplicateColumns, isPivotLayout, layoutModelToLayoutState, layoutStateToLayoutModel, normalizeLayout, tableLayoutToTableLayoutModel, } from '../Api/Implementation/LayoutHelpers';
+import { checkForDuplicateColumns, isPivotLayout, layoutModelToLayoutState, layoutStateToLayoutModel, normalizeLayout, } from '../Api/Implementation/LayoutHelpers';
 import { LayoutManager } from '../layout-manager/src';
 import { isPivotLayoutModel } from '../layout-manager/src/isPivotLayoutModel';
 import { ACTION_COLUMN_TYPE, CALCULATED_COLUMN_TYPE, FDC3_COLUMN_TYPE, FREE_TEXT_COLUMN_TYPE, } from '../AdaptableState/Common/AdaptableColumn';
@@ -441,9 +441,7 @@ export class AdaptableAgGrid {
             // see test /tests/pages/quick-search/pivot-search.spec.ts
             this.updateColumnModelAndRefreshGrid();
         }
-        else {
-            this.layoutManager.applyRowGroupValues(layoutStateToLayoutModel(currentLayout).RowGroupValues);
-        }
+        this.layoutManager.applyRowGroupValues(layoutStateToLayoutModel(currentLayout).RowGroupValues);
         this.autoSizeLayoutIfNeeded();
         this.ModuleService.createModuleUIItems();
         const adaptableContainerElem = this.getAdaptableContainerElement();
@@ -1886,11 +1884,8 @@ You need to define at least one Layout!`);
         if (!layout) {
             layout = this.api.layoutApi.getCurrentLayout();
         }
-        if (!isPivotLayout(layout)) {
-            const layoutModel = tableLayoutToTableLayoutModel(layout);
-            this.layoutManager.applyRowGroupValues(layoutModel.RowGroupValues);
-            return;
-        }
+        const layoutModel = layoutStateToLayoutModel(layout);
+        this.layoutManager.applyRowGroupValues(layoutModel.RowGroupValues);
     }
     isGroupRowNode(rowNode) {
         if (!rowNode) {

package/src/agGrid/getAgGridFilterNotifyModelFn.d.ts

@@ -1,2 +1,2 @@
 import { AdaptableApi } from '../types';
-export declare function getAgGridFilterNotifyModelFn(adaptableApi: AdaptableApi, colId: string, onModelChange: (model: any) => void): () => void;
+export declare function getAgGridFilterNotifyModelFn(adaptableApi: AdaptableApi, colId: string, onModelChange: (model: any) => void): import("lodash").DebouncedFunc<() => void>;

package/src/agGrid/getAgGridFilterNotifyModelFn.js

@@ -1,10 +1,16 @@
+import debounce from 'lodash/debounce';
 export function getAgGridFilterNotifyModelFn(adaptableApi, colId, onModelChange) {
-    const notifyModel = () => {
+    const notifyModel = debounce(() => {
         const isActive = adaptableApi.filterApi.columnFilterApi.isColumnFilterActiveForColumn(colId);
-        // call it with non null to indicate that the filter is active
-        // call it with null to indicate that the filter is not active
-        // as per the AG Grid documentation
-        onModelChange(isActive ? true : null);
-    };
+        setTimeout(() => {
+            // call it with non null to indicate that the filter is active
+            // call it with null to indicate that the filter is not active
+            // as per the AG Grid documentation
+            // ref: also-this-handles-the-LAYOUT_COLUMN_FILTER_EDIT-case
+            onModelChange(isActive ? true : null);
+        }, 50);
+    }, 50, {
+        trailing: true,
+    });
     return notifyModel;
 }

package/src/env.js

@@ -1,5 +1,5 @@
 export default {
     NEXT_PUBLIC_INFINITE_TABLE_LICENSE_KEY: "StartDate=2021-06-29|EndDate=2030-01-01|Owner=Adaptable|Type=distribution|TS=1624971462479|C=137829811,1004007071,2756196225,1839832928,3994409405,636616862" || '',
-    PUBLISH_TIMESTAMP: 1743601254997 || Date.now(),
-    VERSION: "20.0.2" || '--current-version--',
+    PUBLISH_TIMESTAMP: 1743753777733 || Date.now(),
+    VERSION: "20.0.3-canary.0" || '--current-version--',
 };

package/src/layout-manager/src/LayoutManagerModel.d.ts

@@ -12,6 +12,17 @@ export interface ColumnSortModel {
     SortOrder: 'Asc' | 'Desc';
 }
 export interface BaseLayoutModel {
+    /**
+     * Those are not actually used by the LayoutManager,
+     * but we need to keep them here so we can give the layout
+     * fully specified back to Adaptable, with this prop
+     * set as it was when we received it from Adaptable
+     */
+    ColumnFilters?: any;
+    /**
+     * Same as ColumnFilters, but for Grid Filter
+     */
+    GridFilter?: any;
     ColumnVisibility?: {
         [columnId: string]: false;
     };

package/src/layout-manager/src/index.js

@@ -268,7 +268,7 @@ export class LayoutManager extends LMEmitter {
         let ColumnSorts = [];
         let RowGroupedColumns = [];
         let RowGroupValues = undefined;
-        let TableAggregationColumnsv = [];
+        let TableAggregationColumns = [];
         let ColumnPinning = {};
         const gridState = this.gridApi.getState();
         const prevLayout = this.currentLayout;
@@ -318,7 +318,7 @@ export class LayoutManager extends LMEmitter {
             return acc;
         }, {});
         if (gridState.aggregation) {
-            TableAggregationColumnsv = gridState.aggregation.aggregationModel.map((agg) => {
+            TableAggregationColumns = gridState.aggregation.aggregationModel.map((agg) => {
                 const prevAggForColumn = prevAggColumnsMap?.[agg.colId];
                 if (prevAggForColumn && prevAggForColumn.AggFunc.aggFunc === agg.aggFunc) {
                     return prevAggForColumn;
@@ -380,7 +380,7 @@ export class LayoutManager extends LMEmitter {
                     delete ColumnVisibility[colId];
                 }
             });
-            TableAggregationColumnsv = TableAggregationColumnsv.filter((agg) => {
+            TableAggregationColumns = TableAggregationColumns.filter((agg) => {
                 if (columnOrderSet.has(agg.ColumnId)) {
                     return true;
                 }
@@ -431,7 +431,7 @@ export class LayoutManager extends LMEmitter {
             ColumnWidths: ColumnWidths,
             ColumnSorts,
             RowGroupedColumns,
-            TableAggregationColumns: TableAggregationColumnsv,
+            TableAggregationColumns,
             ColumnPinning: ColumnPinning,
             RowGroupValues,
         });
@@ -676,7 +676,7 @@ export class LayoutManager extends LMEmitter {
             try {
                 const perfApplyPivot = this.beginPerf('applyLayout:pivot');
                 this.gridApi.setGridOption('pivotMode', true);
-                this.applyPivotLayout(layout);
+                this.applyPivotLayout(layout, options);
                 perfApplyPivot.end();
             }
             finally {
@@ -737,44 +737,45 @@ export class LayoutManager extends LMEmitter {
         return result;
     }
     applyRowGroupValues(RowGroupValues) {
-        if (RowGroupValues) {
-            if (RowGroupValues.RowGroupDisplay === 'always-expanded') {
-                this.gridApi.expandAll();
-                return;
-            }
-            if (RowGroupValues.RowGroupDisplay === 'always-collapsed') {
-                this.gridApi.collapseAll();
-                return;
-            }
-            const defaultExpanded = RowGroupValues.RowGroupDisplay === 'expanded';
-            if (RowGroupValues.Values) {
-                const deepMap = new DeepMap();
-                RowGroupValues.Values.forEach((rowGroupValue) => {
-                    deepMap.set(rowGroupValue, true);
-                });
-                this.gridApi.forEachNode((node) => {
-                    if (!node.group) {
-                        return;
-                    }
-                    if (node.group) {
-                        const nodePath = [];
-                        let currentNode = node;
-                        do {
-                            nodePath.unshift(currentNode.key);
-                            currentNode = currentNode.parent;
-                        } while (currentNode.parent);
-                        const shouldBeExpanded = defaultExpanded
-                            ? // by default nodes should be expanded
-                                // but this node should be expanded if it is not in the map
-                                !deepMap.has(nodePath)
-                            : // by default nodes should be collapsed
-                                // but this node should be expanded if it is in the map
-                                deepMap.has(nodePath);
-                        node.expanded = shouldBeExpanded;
-                    }
-                });
-                this.gridApi.onGroupExpandedOrCollapsed();
-            }
+        if (!RowGroupValues) {
+            return;
+        }
+        if (RowGroupValues.RowGroupDisplay === 'always-expanded') {
+            this.gridApi.expandAll();
+            return;
+        }
+        if (RowGroupValues.RowGroupDisplay === 'always-collapsed') {
+            this.gridApi.collapseAll();
+            return;
+        }
+        const defaultExpanded = RowGroupValues.RowGroupDisplay === 'expanded';
+        if (RowGroupValues.Values) {
+            const deepMap = new DeepMap();
+            RowGroupValues.Values.forEach((rowGroupValue) => {
+                deepMap.set(rowGroupValue, true);
+            });
+            this.gridApi.forEachNode((node) => {
+                if (!node.group) {
+                    return;
+                }
+                if (node.group) {
+                    const nodePath = [];
+                    let currentNode = node;
+                    do {
+                        nodePath.unshift(currentNode.key);
+                        currentNode = currentNode.parent;
+                    } while (currentNode.parent);
+                    const shouldBeExpanded = defaultExpanded
+                        ? // by default nodes should be expanded
+                            // but this node should be expanded if it is not in the map
+                            !deepMap.has(nodePath)
+                        : // by default nodes should be collapsed
+                            // but this node should be expanded if it is in the map
+                            deepMap.has(nodePath);
+                    node.expanded = shouldBeExpanded;
+                }
+            });
+            this.gridApi.onGroupExpandedOrCollapsed();
         }
     }
     computeColumnStateForPivotLayout(layout) {
@@ -981,7 +982,7 @@ export class LayoutManager extends LMEmitter {
         this.gridApi.autoSizeColumns(columnIds);
         return columnIds;
     }
-    applyPivotLayout(layout) {
+    applyPivotLayout(layout, options) {
         const columnState = this.computeColumnStateForPivotLayout(layout);
         // by simply calling this.gridApi.applyColumnState(columnState)
         // the order of aggregations is not preserved/guaranteed by ag-grid
@@ -1003,6 +1004,11 @@ export class LayoutManager extends LMEmitter {
         this.computePivotAggregations(layout, columnState);
         this.gridApi.applyColumnState(columnState);
         this.applyPivotExpandLevel(layout);
+        const hasGroupedColumns = layout.PivotGroupedColumns && layout.PivotGroupedColumns.length;
+        // but also let's not forget to apply the row group values
+        if (hasGroupedColumns && layout.RowGroupValues && !options?.skipApplyRowGroupsExpandedState) {
+            this.applyRowGroupValues(layout.RowGroupValues);
+        }
     }
     applyPivotExpandLevel(layout) {
         const PivotExpandLevel = layout.PivotExpandLevel ?? -1;

package/src/layout-manager/src/simplifyLayoutModel.js

@@ -69,7 +69,7 @@ export function simplifyPivotLayoutModel(layout) {
     if (layout.ColumnSorts && !layout.ColumnSorts.length) {
         delete layout.ColumnSorts;
     }
-    if (!layout.RowGroupedColumns && layout.RowGroupValues) {
+    if (!layout.PivotGroupedColumns && layout.RowGroupValues) {
         delete layout.RowGroupValues;
     }
     return layout;