@adaptabletools/adaptable 10.0.2 → 10.0.3

package/src/Utilities/Helpers/DateHelper.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.parseDate = exports.parseToISO = exports.dateToISO = exports.isValueValidDate = exports.isValidDate = void 0;
+exports.parseDateValue = exports.parseToISO = exports.dateToISO = exports.isValueValidDate = exports.isValidDate = void 0;
 const tslib_1 = require("tslib");
 const parseISO_1 = tslib_1.__importDefault(require("date-fns/parseISO"));
 const parse_1 = tslib_1.__importDefault(require("date-fns/parse"));
@@ -25,26 +25,36 @@ exports.dateToISO = (date) => {
     return FormatHelper_1.DateFormatter(date, { Pattern: 'yyyy-MM-dd' });
 };
 exports.parseToISO = (date, dateFormat) => {
-    let dateInstance = date instanceof Date
-        ? date
-        : typeof date === 'number'
-            ? new Date(date)
-            : exports.parseDate(date, dateFormat);
-    let valid = dateInstance && exports.isValidDate(dateInstance);
-    if (!valid) {
-        dateInstance = new Date(date);
-        valid = exports.isValidDate(dateInstance);
-    }
-    return valid ? exports.dateToISO(dateInstance) : '';
+    const dateInstance = exports.parseDateValue(date, dateFormat);
+    return exports.isValidDate(dateInstance) ? exports.dateToISO(dateInstance) : '';
 };
-exports.parseDate = (date, dateFormat) => {
-    let d = parse_1.default(date, dateFormat, new Date());
-    if (!exports.isValidDate(d)) {
-        d = parseISO_1.default(date);
+exports.parseDateValue = (dateValue, dateFormat) => {
+    if (dateValue == undefined) {
+        return undefined;
+    }
+    if (dateValue instanceof Date) {
+        return !isNaN(dateValue.getTime()) ? dateValue : undefined;
+    }
+    let dateInstance;
+    if (typeof dateValue === 'number') {
+        dateInstance = new Date(dateValue);
+    }
+    else {
+        // typeof dateValue === 'string'
+        if (dateFormat) {
+            dateInstance = parse_1.default(dateValue, dateFormat, new Date());
+        }
+        else {
+            dateInstance = parseISO_1.default(dateValue);
+        }
+        if (!exports.isValidDate(dateInstance)) {
+            // last chance: try to use the native Date.parse(), https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/parse
+            dateInstance = new Date(Date.parse(dateValue));
+        }
     }
-    if (!exports.isValidDate(d)) {
-        LoggingHelper_1.LogAdaptableError(`Invalid date value "${date}" - cannot be converted to a Date instance. Please make sure you specify adaptableOptions.userInterfaceOptions.dateInputOptions.dateFormat correctly.`);
-        d = undefined;
+    if (!exports.isValidDate(dateInstance)) {
+        LoggingHelper_1.LogAdaptableError(`Invalid date value "${dateValue}" - cannot be converted to a Date instance. Please make sure you specify adaptableOptions.userInterfaceOptions.dateInputOptions.dateFormat correctly.`);
+        dateInstance = undefined;
     }
-    return d;
+    return dateInstance;
 };

package/src/Utilities/ObjectFactory.d.ts

@@ -61,7 +61,7 @@ export declare function CreateEmptySchedule(): Schedule;
 export declare function CreateEmptyShortcut(): Shortcut;
 export declare function CreateEmptyConditionalStyle(): ConditionalStyle;
 export declare function CreateEmptyFormatColumn(): FormatColumn;
-export declare function CreateEmptyFreeTextColumn(): FreeTextColumn;
+export declare function CreateEmptyFreeTextColumn(isFilterable: boolean): FreeTextColumn;
 export declare function CreateEmptyLayout(layout?: Partial<Layout> & {
     Name: string;
 }, adaptableColumns?: AdaptableColumn[]): Layout;

package/src/Utilities/ObjectFactory.js

@@ -74,6 +74,8 @@ function CreateEmptyCalculatedColumn(isFilterable) {
             Sortable: true,
             Pivotable: true,
             Aggregatable: true,
+            SuppressMenu: false,
+            SuppressMovable: false,
         },
     };
 }
@@ -334,13 +336,23 @@ function CreateEmptyFormatColumn() {
     };
 }
 exports.CreateEmptyFormatColumn = CreateEmptyFormatColumn;
-function CreateEmptyFreeTextColumn() {
+function CreateEmptyFreeTextColumn(isFilterable) {
     return {
         Uuid: Uuid_1.createUuid(),
         ColumnId: GeneralConstants_1.EMPTY_STRING,
         DefaultValue: GeneralConstants_1.EMPTY_STRING,
         FreeTextStoredValues: [],
         TextEditor: 'Inline',
+        FreeTextColumnSettings: {
+            Filterable: isFilterable,
+            Resizable: true,
+            Groupable: true,
+            Sortable: true,
+            Pivotable: true,
+            Aggregatable: true,
+            SuppressMenu: false,
+            SuppressMovable: false,
+        },
     };
 }
 exports.CreateEmptyFreeTextColumn = CreateEmptyFreeTextColumn;

package/src/Utilities/Services/MetamodelService.js

@@ -16,6 +16,7 @@ class MetamodelService {
     buildGridInfoOptions() {
         const gridInfoOptions = new Map();
         const adaptableMetamodel = adaptable_metamodel_1.ADAPTABLE_METAMODEL;
+        console.log({ adaptableMetamodel });
         const adaptableOptionsMetamodel = adaptableMetamodel['AdaptableOptions'];
         const adaptableOptionsValues = this.adaptable.adaptableOptions;
         const adaptableOptionsDefaultValues = DefaultAdaptableOptions_1.DefaultAdaptableOptions;

package/src/Utilities/Services/ReportService.js

@@ -329,7 +329,7 @@ class ReportService {
         return type === 'rawValue'
             ? cellRawValue
             : // type === formattedValue
-                this.adaptable.getFormattedValueFromRawValue(cellRawValue, columnId);
+                this.adaptable.getDisplayValueFromRawValue(columnId, cellRawValue);
     }
     computeCellExportValueFormat(columnType) {
         if (this.adaptable.adaptableOptions.exportOptions.exportFormatType === 'rawValue' ||

package/src/Utilities/runIfNotResolvedIn.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Calls the callback if the promise does not resolve in a amount of time.
+ *
+ * @param promise
+ * @param callback Called if promise does not resolve in the time defined by 'delay'
+ * @param delay Time after which if the promise was not resolved the callback (fn) is called.
+ */
+export declare const runIfNotResolvedIn: <T>(promise: Promise<T>, callback: () => void, delay?: number) => Promise<T>;

package/src/Utilities/runIfNotResolvedIn.js

@@ -0,0 +1,23 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.runIfNotResolvedIn = void 0;
+/**
+ * Calls the callback if the promise does not resolve in a amount of time.
+ *
+ * @param promise
+ * @param callback Called if promise does not resolve in the time defined by 'delay'
+ * @param delay Time after which if the promise was not resolved the callback (fn) is called.
+ */
+exports.runIfNotResolvedIn = async (promise, callback, delay = 100) => {
+    let isFulfilled = false;
+    promise === null || promise === void 0 ? void 0 : promise.then(() => {
+        isFulfilled = true;
+    });
+    (async () => {
+        await new Promise((resolve) => setTimeout(resolve, delay));
+        if (!isFulfilled) {
+            callback();
+        }
+    })();
+    return promise;
+};

package/src/View/AdaptableView.js

@@ -15,9 +15,9 @@ const ChartEnums_1 = require("../PredefinedConfig/Common/ChartEnums");
 const AdaptableLoadingScreen_1 = require("./Components/Popups/AdaptableLoadingScreen");
 const Toastify_1 = require("../components/Toastify");
 const renderWithAdaptableContext_1 = require("./renderWithAdaptableContext");
-const ProgressIndicator_1 = require("./Export/ProgressIndicator");
 const License_1 = require("./License");
 const ExportCustomDestinationFormPopups_1 = require("./Export/ExportCustomDestinationFormPopups");
+const ProgressIndicator_1 = require("../components/ProgressIndicator/ProgressIndicator");
 class AdaptableView extends React.Component {
     render() {
         var _a, _b, _c, _d, _e;

package/src/View/Alert/Wizard/AlertDisplayWizardSection.js

@@ -11,6 +11,7 @@ const rebass_1 = require("rebass");
 const AdaptablePopupAlert_1 = require("../../Components/Popups/AdaptablePopupAlert");
 const AlertButtonsEditor_1 = require("./AlertButtonsEditor");
 const CodeBlock_1 = require("../../../components/CodeBlock");
+const AdaptableInput_1 = tslib_1.__importDefault(require("../../Components/AdaptableInput"));
 const DEFAULT_BUTTONS = [
     {
         Label: 'OK',
@@ -58,22 +59,35 @@ exports.AlertDisplayWizardSection = (props) => {
     var _a, _b, _c, _d;
     const { data, api } = OnePageAdaptableWizard_1.useOnePageWizardContext();
     const messageType = data.MessageType;
+    const messageText = api.alertApi.getAlertDescription(data);
     const adaptableAlert = {
         header: data.MessageType,
         message: '',
         alertDefinition: data,
     };
+    const onMessageTextChange = (e) => {
+        const { value } = e.target;
+        props.onChange(Object.assign(Object.assign({}, data), { MessageText: value }));
+    };
     return (React.createElement(React.Fragment, null,
         React.createElement(Tabs_1.Tabs, null,
             React.createElement(Tabs_1.Tabs.Tab, null, "Message Type"),
             React.createElement(Tabs_1.Tabs.Content, null,
-                React.createElement(Radio_1.RadioGroup, { value: messageType, name: "messageType", orientation: "vertical", onRadioChange: (MessageType) => {
+                React.createElement(Radio_1.RadioGroup, { value: messageType, name: "messageType", orientation: "horizontal", onRadioChange: (MessageType) => {
                         props.onChange(Object.assign(Object.assign({}, data), { MessageType }));
                     } },
-                    React.createElement(Radio_1.default, { value: "Info" }, "Info"),
-                    React.createElement(Radio_1.default, { value: "Success" }, "Success"),
-                    React.createElement(Radio_1.default, { value: "Warning" }, "Warning"),
-                    React.createElement(Radio_1.default, { value: "Error" }, "Error")))),
+                    React.createElement(Radio_1.default, { marginLeft: 1, value: "Info" }, "Info"),
+                    React.createElement(Radio_1.default, { marginLeft: 4, value: "Success" }, "Success"),
+                    React.createElement(Radio_1.default, { marginLeft: 4, value: "Warning" }, "Warning"),
+                    React.createElement(Radio_1.default, { marginLeft: 4, value: "Error" }, "Error")))),
+        React.createElement(Tabs_1.Tabs, { mt: 2, mb: 3, autoFocus: false },
+            React.createElement(Tabs_1.Tabs.Tab, null, "Message Text"),
+            React.createElement(Tabs_1.Tabs.Content, null,
+                React.createElement(rebass_1.Text, { fontSize: 2, mt: 3, mb: 2 }, "The text to display as the Alert Message (leave blank to show automated Message based on Trigger and Condition)"),
+                ' ',
+                React.createElement(AdaptableInput_1.default, { marginTop: 2, type: 'text', autoFocus: false, value: messageText, 
+                    // onChange={(e: any) => onPredicateInputChange(e, index)}
+                    onChange: (e) => onMessageTextChange(e) }))),
         React.createElement(Tabs_1.Tabs, { mt: 2, mb: 3, autoFocus: false },
             React.createElement(Tabs_1.Tabs.Tab, null, "Display options"),
             React.createElement(Tabs_1.Tabs.Content, null,

package/src/View/BulkUpdate/BulkUpdatePopup.d.ts

@@ -4,6 +4,7 @@ import * as SystemRedux from '../../Redux/ActionsReducers/SystemRedux';
 import { ModuleViewPopupProps } from '../Components/SharedProps/ModuleViewPopupProps';
 import { PreviewInfo } from '../../Utilities/Interface/Preview';
 import { BulkUpdateValidationResult } from '../../Strategy/Interface/IBulkUpdateModule';
+import { GridCell } from '../../types';
 interface BulkUpdatePopupProps extends ModuleViewPopupProps<BulkUpdatePopupComponent> {
     BulkUpdateValue: string;
     BulkUpdateValidationResult: BulkUpdateValidationResult;
@@ -11,6 +12,7 @@ interface BulkUpdatePopupProps extends ModuleViewPopupProps<BulkUpdatePopupCompo
     onBulkUpdateValueChange: (value: string) => SystemRedux.BulkUpdateChangeValueAction;
     onBulkUpdateCheckSelectedCells: () => SystemRedux.BulkUpdateCheckCellSelectionAction;
     onRunBulkUpdate: () => BulkUpdateRedux.BulkUpdateCompleteAction;
+    SelectedGridCells: GridCell[];
 }
 export interface BulkUpdatePopupState {
     isShowingError: boolean;

package/src/View/BulkUpdate/BulkUpdatePopup.js

@@ -57,7 +57,7 @@ class BulkUpdatePopupComponent extends React.Component {
                         ' ',
                         "Select from existing column values")),
                 React.createElement(rebass_1.Flex, { padding: 2, flexDirection: "row", alignItems: "center" },
-                    React.createElement(rebass_1.Flex, { alignItems: "center", flexDirection: "row", flex: 1, marginRight: 2 }, this.state.useSelector ? (React.createElement(ColumnValueSelector_1.ColumnValueSelector, { selectedColumnValue: this.props.BulkUpdateValue, selectedColumn: col, api: this.props.api, onColumnValueChange: (values) => this.onColumnValueSelectedChanged(values), allowNew: false, style: { width: '100%', maxWidth: 'inherit' } })) : (React.createElement(AdaptableInput_1.default, { style: { width: '100%' }, value: String(this.props.BulkUpdateValue), type: UIHelper_1.UIHelper.getDescriptionForDataType(col.DataType), placeholder: UIHelper_1.UIHelper.getPlaceHolderforDataType(col.DataType), onChange: (e) => this.onBulkUpdateValueChange(e) }))),
+                    React.createElement(rebass_1.Flex, { alignItems: "center", flexDirection: "row", flex: 1, marginRight: 2 }, this.state.useSelector ? (React.createElement(ColumnValueSelector_1.ColumnValueSelector, { selectedGridCells: this.props.SelectedGridCells, selectedColumnValue: this.props.BulkUpdateValue, selectedColumn: col, api: this.props.api, onColumnValueChange: (values) => this.onColumnValueSelectedChanged(values), allowNew: false, style: { width: '100%', maxWidth: 'inherit' } })) : (React.createElement(AdaptableInput_1.default, { style: { width: '100%' }, value: String(this.props.BulkUpdateValue), type: UIHelper_1.UIHelper.getDescriptionForDataType(col.DataType), placeholder: UIHelper_1.UIHelper.getPlaceHolderforDataType(col.DataType), onChange: (e) => this.onBulkUpdateValueChange(e) }))),
                     React.createElement(SimpleButton_1.default, { disabled: StringExtensions_1.StringExtensions.IsNullOrEmpty(this.props.BulkUpdateValue) ||
                             this.props.PreviewInfo.previewValidationSummary.validationResult == 'All', onClick: () => {
                             this.onApplyClick();
@@ -65,7 +65,7 @@ class BulkUpdatePopupComponent extends React.Component {
                 React.createElement(HelpBlock_1.default, { marginTop: 2, marginBottom: 2 }, "Select an existing column value from the dropdown, or enter a new value"),
                 React.createElement(rebass_1.Flex, { marginTop: 2, flexDirection: "row", alignItems: "center" },
                     React.createElement(rebass_1.Flex, { alignItems: "center", flexDirection: "row", flex: 1, marginRight: 2 },
-                        React.createElement(ColumnValueSelector_1.ColumnValueSelector, { selectedColumnValue: this.props.BulkUpdateValue, selectedColumn: col, api: this.props.api, onColumnValueChange: (columns) => this.onColumnValueSelectedChanged(columns), style: { width: '100%', maxWidth: 'inherit' } })),
+                        React.createElement(ColumnValueSelector_1.ColumnValueSelector, { selectedGridCells: this.props.SelectedGridCells, selectedColumnValue: this.props.BulkUpdateValue, selectedColumn: col, api: this.props.api, onColumnValueChange: (columns) => this.onColumnValueSelectedChanged(columns), style: { width: '100%', maxWidth: 'inherit' } })),
                     React.createElement(SimpleButton_1.default, { disabled: StringExtensions_1.StringExtensions.IsNullOrEmpty(this.props.BulkUpdateValue) ||
                             this.props.PreviewInfo.previewValidationSummary.validationResult == 'All' ||
                             hasDataTypeError, variant: "raised", tone: "accent", marginRight: 2, onClick: () => {
@@ -96,10 +96,12 @@ class BulkUpdatePopupComponent extends React.Component {
     }
 }
 function mapStateToProps(state, ownProps) {
+    var _a;
     return {
         BulkUpdateValue: state.System.BulkUpdateValue,
         PreviewInfo: state.System.BulkUpdatePreviewInfo,
         BulkUpdateValidationResult: state.System.BulkUpdateValidationResult,
+        SelectedGridCells: (_a = state.Grid.SelectedCellInfo) === null || _a === void 0 ? void 0 : _a.gridCells,
     };
 }
 function mapDispatchToProps(dispatch) {

package/src/View/BulkUpdate/BulkUpdateViewPanel.d.ts

@@ -4,6 +4,7 @@ import * as SystemRedux from '../../Redux/ActionsReducers/SystemRedux';
 import * as BulkUpdateRedux from '../../Redux/ActionsReducers/BulkUpdateRedux';
 import { BulkUpdateValidationResult } from '../../Strategy/Interface/IBulkUpdateModule';
 import { PreviewInfo } from '../../Utilities/Interface/Preview';
+import { GridCell } from '../../types';
 export interface BulkUpdateViewPanelComponentProps extends ViewPanelProps {
     BulkUpdateValue: string;
     BulkUpdateValidationResult: BulkUpdateValidationResult;
@@ -12,6 +13,7 @@ export interface BulkUpdateViewPanelComponentProps extends ViewPanelProps {
     onBulkUpdateValueChange: (value: string) => SystemRedux.BulkUpdateChangeValueAction;
     onBulkUpdateCheckSelectedCells: () => SystemRedux.BulkUpdateCheckCellSelectionAction;
     onRunBulkUpdate: () => BulkUpdateRedux.BulkUpdateCompleteAction;
+    SelectedGridCells: GridCell[];
 }
 declare class BulkUpdateViewPanelComponent extends React.Component<BulkUpdateViewPanelComponentProps, {}> {
     private cleanupEvent?;

package/src/View/BulkUpdate/BulkUpdateViewPanel.js

@@ -52,7 +52,7 @@ class BulkUpdateViewPanelComponent extends React.Component {
         const elementType = this.props.viewType === 'Toolbar' ? 'DashboardToolbar' : 'ToolPanel';
         return (React.createElement(rebass_1.Flex, { flexDirection: "row", className: join_1.default(shouldDisable ? GeneralConstants.READ_ONLY_STYLE : '', `ab-${elementType}__BulkUpdate__wrap`), flexWrap: this.props.viewType === 'ToolPanel' ? 'wrap' : 'nowrap' },
             React.createElement(rebass_1.Flex, null,
-                React.createElement(ColumnValueSelector_1.ColumnValueSelector, { newLabel: "New", existingLabel: "Existing", dropdownButtonProps: {
+                React.createElement(ColumnValueSelector_1.ColumnValueSelector, { selectedGridCells: this.props.SelectedGridCells, newLabel: "New", existingLabel: "Existing", dropdownButtonProps: {
                         listMinWidth: 160,
                     }, className: `ab-${elementType}__BulkUpdate__select`, disabled: shouldDisable, selectedColumnValue: this.props.BulkUpdateValue, selectedColumn: selectedColumn, api: this.props.api, onColumnValueChange: (columns) => this.onColumnValueSelectedChanged(columns) })),
             React.createElement(rebass_1.Flex, null,
@@ -90,7 +90,9 @@ class BulkUpdateViewPanelComponent extends React.Component {
     }
 }
 function mapStateToProps(state, ownProps) {
+    var _a;
     return {
+        SelectedGridCells: (_a = state.Grid.SelectedCellInfo) === null || _a === void 0 ? void 0 : _a.gridCells,
         BulkUpdateValue: state.System.BulkUpdateValue,
         BulkUpdateValidationResult: state.System.BulkUpdateValidationResult,
         PreviewInfo: state.System.BulkUpdatePreviewInfo,

package/src/View/Components/FilterForm/FilterForm.d.ts

@@ -1,63 +1,15 @@
-import * as React from 'react';
-import * as Redux from 'redux';
-import * as FilterRedux from '../../../Redux/ActionsReducers/FilterRedux';
-import * as PopupRedux from '../../../Redux/ActionsReducers/PopupRedux';
-import { AdaptableColumn } from '../../../PredefinedConfig/Common/AdaptableColumn';
+/// <reference types="react" />
 import { ColumnFilterContext } from '../../../Utilities/Interface/ColumnFilterContext';
 import { ColumnMenuTab } from '../../../PredefinedConfig/Common/Enums';
-import { ModuleViewPopupProps } from '../SharedProps/ModuleViewPopupProps';
-import { UIPrompt } from '../../../Utilities/Interface/MessagePopups';
-import { AdaptableMenuItem } from '../../../PredefinedConfig/Common/Menu';
 import { ColumnFilter } from '../../../PredefinedConfig/FilterState';
-import { AdaptablePredicateDef } from '../../../PredefinedConfig/Common/AdaptablePredicate';
-import { AdaptableApi } from '../../../Api/AdaptableApi';
-interface FilterFormProps extends ModuleViewPopupProps<FilterFormComponent> {
-    currentColumn: AdaptableColumn;
-    api: AdaptableApi;
-    columns: AdaptableColumn[];
-    columnFilters: ColumnFilter[];
-    embedColumnMenu: boolean;
-    showCloseButton: boolean;
-    onClearColumnFilter: (columnfilter: ColumnFilter) => FilterRedux.ColumnFilterClearAction;
-    onAddColumnFilter: (columnFilter: ColumnFilter) => FilterRedux.ColumnFilterAddAction;
-    onEditColumnFilter: (columnFilter: ColumnFilter) => FilterRedux.ColumnFilterEditAction;
-    onSetColumnFilter: (columnFilter: ColumnFilter) => FilterRedux.ColumnFilterSetAction;
-    onHideFilterForm: () => FilterRedux.FilterFormHideAction;
-    onMenuItemClick: (action: Redux.Action) => Redux.Action;
-    onShowPrompt: (prompt: UIPrompt) => PopupRedux.PopupShowPromptAction;
-}
 export interface FilterFormState {
     columnFilters: ColumnFilter[];
     distinctColumnValues: any[];
+    isDistinctColumnValuesLoading: boolean;
     showTab: boolean;
     selectedTab: ColumnMenuTab;
     editedColumnFilter: ColumnFilter | undefined;
     currentTab: 'values' | 'predicates';
+    suppressClientSideFilter: boolean;
 }
-declare class FilterFormComponent extends React.Component<FilterFormProps, FilterFormState> {
-    static createColumnFilterFromProps(props: FilterFormProps): ColumnFilter;
-    static getCurrentTab(editedColumnFilter: ColumnFilter | undefined): 'values' | 'predicates';
-    static getDerivedStateFromProps(props: FilterFormProps, state: FilterFormState): {
-        editedColumnFilter: ColumnFilter;
-        columnFilters: ColumnFilter[];
-        currentTab: "values" | "predicates";
-    };
-    constructor(props: FilterFormProps);
-    componentDidMount(): void;
-    render(): any;
-    private renderColumnPredicate;
-    renderPredicateInput(predicateDef: AdaptablePredicateDef, filter: ColumnFilter): JSX.Element | JSX.Element[];
-    isFilterable(): string;
-    onSelectTab(tab: any): any;
-    onColumnValuesChange(columnValues: any[]): void;
-    persistFilter(): void;
-    onClearFilter(): void;
-    onFilterApplied(): void;
-    onCloseForm(): void;
-    onMenuItemClick(menuItem: AdaptableMenuItem): any;
-    selectColumnPredicate(predicateDef: AdaptablePredicateDef): void;
-    changeColumnPredicateInput(value: string, index: number): void;
-}
-export declare let FilterForm: import("react-redux").ConnectedComponent<typeof FilterFormComponent, any>;
 export declare const FilterFormReact: (FilterContext: ColumnFilterContext) => JSX.Element;
-export {};

package/src/View/Components/FilterForm/FilterForm.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.FilterFormReact = exports.FilterForm = void 0;
+exports.FilterFormReact = void 0;
 const tslib_1 = require("tslib");
 const React = tslib_1.__importStar(require("react"));
 const react_redux_1 = require("react-redux");
@@ -18,15 +18,37 @@ const HelpBlock_1 = tslib_1.__importDefault(require("../../../components/HelpBlo
 const rebass_1 = require("rebass");
 const Radio_1 = tslib_1.__importDefault(require("../../../components/Radio"));
 const Helper_1 = tslib_1.__importDefault(require("../../../Utilities/Helpers/Helper"));
-const ArrayExtensions_1 = tslib_1.__importDefault(require("../../../Utilities/Extensions/ArrayExtensions"));
 const AdaptableInput_1 = tslib_1.__importDefault(require("../AdaptableInput"));
 const renderWithAdaptableContext_1 = require("../../renderWithAdaptableContext");
 const CheckBox_1 = require("../../../components/CheckBox");
+const runIfNotResolvedIn_1 = require("../../../Utilities/runIfNotResolvedIn");
+const getDefaultColumnFilterPredicate_1 = require("./getDefaultColumnFilterPredicate");
 const panelStyle = {
     width: '100%',
     minWidth: 150,
 };
 class FilterFormComponent extends React.Component {
+    constructor(props) {
+        super(props);
+        this._isMounted = false;
+        this.handleFilterChange = (filter) => {
+            if (this.state.suppressClientSideFilter) {
+                this.loadPermittedValues(filter);
+            }
+        };
+        this._isMounted = true;
+        const existingColumnFilter = FilterFormComponent.createColumnFilterFromProps(this.props);
+        this.state = {
+            columnFilters: props.columnFilters,
+            distinctColumnValues: [],
+            isDistinctColumnValuesLoading: false,
+            showTab: true,
+            selectedTab: Enums_1.ColumnMenuTab.Filter,
+            editedColumnFilter: existingColumnFilter,
+            currentTab: FilterFormComponent.getCurrentTab(existingColumnFilter),
+            suppressClientSideFilter: false,
+        };
+    }
     static createColumnFilterFromProps(props) {
         let existingColumnFilter = props.columnFilters.find((cf) => cf.ColumnId == props.currentColumn.ColumnId);
         if (!existingColumnFilter) {
@@ -36,13 +58,13 @@ class FilterFormComponent extends React.Component {
                 return ObjectFactory_1.ObjectFactory.CreateColumnFilter(props.currentColumn.ColumnId, 'Values', []);
             }
             if (props.currentColumn.DataType === 'Number') {
-                return ObjectFactory_1.ObjectFactory.CreateColumnFilter(props.currentColumn.ColumnId, filterOptions.defaultNumericColumnFilter, ['']);
+                return ObjectFactory_1.ObjectFactory.CreateColumnFilter(props.currentColumn.ColumnId, getDefaultColumnFilterPredicate_1.getDefaultColumnFilterPredicate(props.currentColumn, filterOptions.defaultNumericColumnFilter), ['']);
             }
             if (props.currentColumn.DataType === 'String') {
-                return ObjectFactory_1.ObjectFactory.CreateColumnFilter(props.currentColumn.ColumnId, filterOptions.defaultStringColumnFilter, ['']);
+                return ObjectFactory_1.ObjectFactory.CreateColumnFilter(props.currentColumn.ColumnId, getDefaultColumnFilterPredicate_1.getDefaultColumnFilterPredicate(props.currentColumn, filterOptions.defaultStringColumnFilter), ['']);
             }
             if (props.currentColumn.DataType === 'Date') {
-                return ObjectFactory_1.ObjectFactory.CreateColumnFilter(props.currentColumn.ColumnId, filterOptions.defaultDateColumnFilter, ['']);
+                return ObjectFactory_1.ObjectFactory.CreateColumnFilter(props.currentColumn.ColumnId, getDefaultColumnFilterPredicate_1.getDefaultColumnFilterPredicate(props.currentColumn, filterOptions.defaultDateColumnFilter), ['']);
             }
             if (props.currentColumn.DataType === 'Boolean') {
                 return ObjectFactory_1.ObjectFactory.CreateColumnFilter(props.currentColumn.ColumnId, 'BooleanToggle', [
@@ -76,25 +98,24 @@ class FilterFormComponent extends React.Component {
                 : state.currentTab,
         };
     }
-    constructor(props) {
-        super(props);
-        let existingColumnFilter = FilterFormComponent.createColumnFilterFromProps(this.props);
-        this.state = {
-            columnFilters: props.columnFilters,
-            distinctColumnValues: [],
-            showTab: false,
-            selectedTab: Enums_1.ColumnMenuTab.Filter,
-            editedColumnFilter: existingColumnFilter,
-            currentTab: FilterFormComponent.getCurrentTab(existingColumnFilter),
-        };
+    componentWillUnmount() {
+        this._isMounted = false;
     }
     componentDidMount() {
         if (this.props.currentColumn.DataType != Enums_1.DataType.Boolean) {
-            let distinctColumnValues = this.props.api.columnApi.getDistinctDisplayValuesForColumn(this.props.currentColumn.ColumnId);
-            let hasItems = ArrayExtensions_1.default.IsNotNullOrEmptyNorContainsSingleEmptyValue(distinctColumnValues);
-            let currentTab = hasItems ? this.state.currentTab : 'values';
-            this.setState({ distinctColumnValues, showTab: hasItems, currentTab: currentTab });
+            this.loadPermittedValues();
+        }
+    }
+    async loadPermittedValues(filter = '') {
+        const { values: distinctColumnValues, suppressClientSideFilter } = await runIfNotResolvedIn_1.runIfNotResolvedIn(this.props.api.columnApi.getDistinctFilterDisplayValuesForColumn(this.props.currentColumn.ColumnId, filter), () => this._isMounted && this.setState({ isDistinctColumnValuesLoading: true }));
+        if (!this._isMounted) {
+            return;
         }
+        this.setState({
+            distinctColumnValues,
+            isDistinctColumnValuesLoading: false,
+            suppressClientSideFilter,
+        });
     }
     render() {
         var _a, _b;
@@ -120,7 +141,7 @@ class FilterFormComponent extends React.Component {
                 React.createElement(Radio_1.default, { marginLeft: 2, flex: 1, checked: this.state.currentTab == 'predicates', onChange: () => this.setState({ currentTab: 'predicates' }) },
                     React.createElement(rebass_1.Flex, { fontSize: 'var( --ab-font-size-2)' }, "Filters")))),
             this.state.currentTab === 'values' && (React.createElement("div", null,
-                React.createElement(ListBoxFilterForm_1.ListBoxFilterForm, { currentColumn: this.props.currentColumn, columns: this.props.columns, columnDistinctValues: this.state.distinctColumnValues, dataType: this.props.currentColumn.DataType, uiSelectedColumnValues: uiSelectedColumnValues, useVendorStyle: useVendorStyle, onColumnValueSelectedChange: (list) => this.onColumnValuesChange(list) }))),
+                React.createElement(ListBoxFilterForm_1.ListBoxFilterForm, { suppressClientSideFilter: this.state.suppressClientSideFilter, isLoading: this.state.isDistinctColumnValuesLoading, onFilterChange: this.handleFilterChange, currentColumn: this.props.currentColumn, columns: this.props.columns, columnDistinctValues: this.state.distinctColumnValues, dataType: this.props.currentColumn.DataType, uiSelectedColumnValues: uiSelectedColumnValues, useVendorStyle: useVendorStyle, onColumnValueSelectedChange: (list) => this.onColumnValuesChange(list) }))),
             this.state.currentTab === 'predicates' && (React.createElement("div", null,
                 ' ',
                 this.state.showTab && React.createElement("hr", null),
@@ -258,5 +279,5 @@ function mapDispatchToProps(dispatch) {
         onHideFilterForm: () => dispatch(FilterRedux.FilterFormHide()),
     };
 }
-exports.FilterForm = react_redux_1.connect(mapStateToProps, mapDispatchToProps)(FilterFormComponent);
-exports.FilterFormReact = (FilterContext) => renderWithAdaptableContext_1.renderWithAdaptableContext(React.createElement(exports.FilterForm, { api: FilterContext.Adaptable.api, currentColumn: FilterContext.Column, teamSharingActivated: false, embedColumnMenu: FilterContext.Adaptable.embedColumnMenu, showCloseButton: FilterContext.ShowCloseButton }), FilterContext.Adaptable);
+const FilterForm = react_redux_1.connect(mapStateToProps, mapDispatchToProps)(FilterFormComponent);
+exports.FilterFormReact = (FilterContext) => renderWithAdaptableContext_1.renderWithAdaptableContext(React.createElement(FilterForm, { api: FilterContext.Adaptable.api, currentColumn: FilterContext.Column, teamSharingActivated: false, embedColumnMenu: FilterContext.Adaptable.embedColumnMenu, showCloseButton: FilterContext.ShowCloseButton }), FilterContext.Adaptable);

package/src/View/Components/FilterForm/ListBoxFilterForm.d.ts

@@ -9,6 +9,9 @@ export interface ListBoxFilterFormProps extends ListGroupProps {
     uiSelectedColumnValues: Array<string>;
     onColumnValueSelectedChange: (SelectedValues: Array<any>) => void;
     dataType: 'String' | 'Number' | 'NumberArray' | 'Boolean' | 'Date' | 'Object' | 'Unknown';
+    isLoading?: boolean;
+    suppressClientSideFilter?: boolean;
+    onFilterChange?: (filter: string) => void;
 }
 export interface ListBoxFilterFormState extends React.ClassAttributes<any> {
     UiSelectedColumnValues: Array<string>;

package/src/View/Components/FilterForm/ListBoxFilterForm.js

@@ -11,8 +11,13 @@ const join_1 = tslib_1.__importDefault(require("../../../components/utils/join")
 const AdaptableFormControlTextClear_1 = require("../Forms/AdaptableFormControlTextClear");
 const GridList_1 = tslib_1.__importDefault(require("../../../components/List/GridList"));
 const react_1 = require("react");
+const Loader_1 = require("../../../components/Loader");
 exports.ListBoxFilterForm = (props) => {
     const [FilterValue, setFilterValue] = react_1.useState('');
+    const handleFilterValueChange = React.useCallback((newValue) => {
+        setFilterValue(newValue);
+        props === null || props === void 0 ? void 0 : props.onFilterChange(newValue);
+    }, [props.onFilterChange]);
     const [UiSelectedColumnValues, internalUpdateUISelectedColumnValues] = react_1.useState(props.uiSelectedColumnValues);
     const setUiSelectedColumnValues = (values) => {
         internalUpdateUISelectedColumnValues(values);
@@ -41,7 +46,8 @@ exports.ListBoxFilterForm = (props) => {
         if (StringExtensions_1.StringExtensions.IsNullOrEmpty(columnValue)) {
             return null;
         }
-        if (StringExtensions_1.StringExtensions.IsNotNullOrEmpty(FilterValue) &&
+        if (!props.suppressClientSideFilter &&
+            StringExtensions_1.StringExtensions.IsNotNullOrEmpty(FilterValue) &&
             columnValue.toLocaleLowerCase().indexOf(FilterValue.toLocaleLowerCase()) < 0) {
             return null;
         }
@@ -60,9 +66,12 @@ exports.ListBoxFilterForm = (props) => {
             paddingBottom: 'var(--ab-space-1)',
             paddingLeft: 'var(--ab-space-1)',
             borderRadius: 'var(--ab__border-radius)',
-        }, OnTextChange: setFilterValue }));
-    return (React.createElement("div", { className: join_1.default(`ab-ListBoxFilterForm`, props.useVendorStyle ? `ab-ListBoxFilterForm--vendor-style` : null) },
+        }, OnTextChange: handleFilterValueChange }));
+    const baseClassName = 'ab-ListBoxFilterForm';
+    return (React.createElement("div", { className: join_1.default(baseClassName, props.useVendorStyle ? `${baseClassName}--vendor-style` : null, props.isLoading && `${baseClassName}--loading`) },
         React.createElement(rebass_1.Box, { px: 2 },
-            React.createElement(rebass_1.Box, { mx: props.useVendorStyle ? 0 : '2px', marginBottom: 2 }, textClear)),
-        React.createElement(GridList_1.default, { showZebraRows: false, className: !props.useVendorStyle ? 'ab-padding-horizontal-0' : '' }, columnValuesItemsElements)));
+            React.createElement(rebass_1.Box, { mx: props.useVendorStyle ? 0 : '2px', marginBottom: 2 },
+                textClear,
+                props.isLoading && React.createElement(Loader_1.Loader, null, "Loading"))),
+        !props.isLoading && (React.createElement(GridList_1.default, { showZebraRows: false, className: !props.useVendorStyle ? 'ab-padding-horizontal-0' : '' }, columnValuesItemsElements))));
 };

package/src/View/Components/FilterForm/QuickFilterForm.d.ts

@@ -1,50 +1,10 @@
-import * as React from 'react';
-import * as FilterRedux from '../../../Redux/ActionsReducers/FilterRedux';
+/// <reference types="react" />
 import { ColumnFilterContext } from '../../../Utilities/Interface/ColumnFilterContext';
-import { ModuleViewPopupProps } from '../SharedProps/ModuleViewPopupProps';
-import { AdaptableColumn } from '../../../PredefinedConfig/Common/AdaptableColumn';
-import { AdaptableApi } from '../../../Api/AdaptableApi';
 import { ColumnFilter } from '../../../PredefinedConfig/FilterState';
-import { AdaptablePredicateDef } from '../../../PredefinedConfig/Common/AdaptablePredicate';
-import { FilterOptions } from '../../../AdaptableOptions/FilterOptions';
-interface QuickFilterFormProps extends ModuleViewPopupProps<QuickFilterFormComponent> {
-    api: AdaptableApi;
-    currentColumn: AdaptableColumn;
-    columnFilters: ColumnFilter[];
-    quickFilterTrigger?: FilterOptions['quickFilterTrigger'];
-    onAddColumnFilter: (columnFilter: ColumnFilter) => FilterRedux.ColumnFilterAddAction;
-    onEditColumnFilter: (columnFilter: ColumnFilter) => FilterRedux.ColumnFilterEditAction;
-}
 export interface QuickFilterFormState {
     filter: ColumnFilter;
     distinctColumnValues: any[];
+    isDistinctColumnValuesLoading: boolean;
+    suppressClientSideFilter: boolean;
 }
-declare class QuickFilterFormComponent extends React.Component<QuickFilterFormProps, QuickFilterFormState> {
-    private valuesDropdown?;
-    constructor(props: QuickFilterFormProps);
-    getDistinctValues: (props?: Readonly<QuickFilterFormProps> & Readonly<{
-        children?: React.ReactNode;
-    }>) => any[];
-    updateDistinctValues(props?: Readonly<QuickFilterFormProps> & Readonly<{
-        children?: React.ReactNode;
-    }>): void;
-    UNSAFE_componentWillReceiveProps(nextProps: QuickFilterFormProps): void;
-    getFilterFromProps(props: QuickFilterFormProps): ColumnFilter;
-    render(): any;
-    renderLabel(filter: ColumnFilter, activePredicateDef: AdaptablePredicateDef): JSX.Element;
-    renderPredicateIcon(predicateDef: AdaptablePredicateDef): JSX.Element;
-    renderPredicateInput(predicateDef: AdaptablePredicateDef, filter: ColumnFilter): JSX.Element | JSX.Element[];
-    renderNoValuesDropdown(filter: ColumnFilter): JSX.Element;
-    renderValuesDropdown(filter: ColumnFilter): JSX.Element;
-    onColumnValuesChange(columnValues: any[]): void;
-    selectColumnPredicate(predicateId: string): void;
-    debouncedAddFilter: import("lodash").DebouncedFunc<() => FilterRedux.ColumnFilterAddAction>;
-    debouncedEditFilter: import("lodash").DebouncedFunc<() => FilterRedux.ColumnFilterEditAction>;
-    private updateFilter;
-    changeColumnPredicateInput(value: string, index: number): void;
-    getPredicateIdForShortcutValue(value: string): string;
-    clearFilter(): void;
-}
-export declare const QuickFilterForm: import("react-redux").ConnectedComponent<typeof QuickFilterFormComponent, any>;
 export declare const QuickFilterFormReact: (FilterContext: ColumnFilterContext) => JSX.Element;
-export {};