@adaptabletools/adaptable 17.0.0-canary.0 → 17.0.0-canary.10

package/src/View/GridFilter/GridFilterViewPanel.js

@@ -1,165 +1,70 @@
-import * as React from 'react';
-import { connect } from 'react-redux';
-import { Flex } from 'rebass';
-import DropdownButton from '../../components/DropdownButton';
-import FieldWrap from '../../components/FieldWrap';
-import { Icon } from '../../components/icons';
-import Input from '../../components/Input';
-import { SortOrder } from '../../PredefinedConfig/Common/Enums';
-import * as PopupRedux from '../../Redux/ActionsReducers/PopupRedux';
-import * as SystemRedux from '../../Redux/ActionsReducers/SystemRedux';
-import * as ModuleConstants from '../../Utilities/Constants/ModuleConstants';
-import { NamedQueryModuleId } from '../../Utilities/Constants/ModuleConstants';
-import { ArrayExtensions } from '../../Utilities/Extensions/ArrayExtensions';
-import StringExtensions from '../../Utilities/Extensions/StringExtensions';
-import { ButtonClear } from '../Components/Buttons/ButtonClear';
-import { ButtonExpand } from '../Components/Buttons/ButtonExpand';
-import { ButtonInvalid } from '../Components/Buttons/ButtonInvalid';
-import { ButtonPlay } from '../Components/Buttons/ButtonPlay';
-import { ButtonSave } from '../Components/Buttons/ButtonSave';
-class QueryViewPanelComponent extends React.Component {
-    constructor(props) {
-        super(props);
-        this.state = {
-            isAdaptableReady: false,
-            expression: this.props.CurrentQuery || '',
-        };
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.GridFilterPanelControl = void 0;
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const rebass_1 = require("rebass");
+const DropdownButton_1 = tslib_1.__importDefault(require("../../components/DropdownButton"));
+const FieldWrap_1 = tslib_1.__importDefault(require("../../components/FieldWrap"));
+const icons_1 = require("../../components/icons");
+const Input_1 = tslib_1.__importDefault(require("../../components/Input"));
+const StringExtensions_1 = tslib_1.__importDefault(require("../../Utilities/Extensions/StringExtensions"));
+const ButtonClear_1 = require("../Components/Buttons/ButtonClear");
+const ButtonExpand_1 = require("../Components/Buttons/ButtonExpand");
+const ButtonInvalid_1 = require("../Components/Buttons/ButtonInvalid");
+const ButtonPause_1 = require("../Components/Buttons/ButtonPause");
+const ButtonPlay_1 = require("../Components/Buttons/ButtonPlay");
+const ButtonSave_1 = require("../Components/Buttons/ButtonSave");
+const ButtonUnsuspend_1 = require("../Components/Buttons/ButtonUnsuspend");
+const NamedQuerySelector_1 = require("./NamedQuerySelector");
+const useGridFilterExpressionEditor_1 = require("./useGridFilterExpressionEditor");
+const QueryViewPanelComponent = (props) => {
+    const { cachedQueries, expression, setExpression, isExpressionNamedQuery, isExpressionValid, isSuspended, gridFilter, isAdaptableReady, namedQueries, availableColumns, runQuery, onExpand, clearQuery, namedQueryModuleAccessLevel, saveQuery, suspendGridFilter, unSuspendGridFilter, setGridFilterExpression, gridFilterAccessLevel, } = (0, useGridFilterExpressionEditor_1.useGridFilterExpressionEditor)();
+    if (!isAdaptableReady) {
+        return null;
     }
-    componentDidMount() {
-        this.props.api.eventApi.on('AdaptableReady', () => {
-            this.setState({ isAdaptableReady: true });
-        });
-    }
-    componentDidUpdate(prevProps) {
-        if (prevProps.CurrentQuery !== this.props.CurrentQuery) {
-            this.setState({
-                expression: this.props.CurrentQuery,
-            });
-        }
-    }
-    render() {
-        if (this.state.isAdaptableReady === false) {
-            return null;
-        }
-        const isExpressionValid = this.state.expression == '' ||
-            this.props.api.internalApi
-                .getQueryLanguageService()
-                .validateBoolean(this.state.expression, NamedQueryModuleId).isValid;
-        const isExpressionNamedQuery = this.props.NamedQueries.find((sq) => sq.BooleanExpression == this.state.expression) != null;
-        let sortedNamedQueries = ArrayExtensions.sortArrayWithProperty(SortOrder.Asc, this.props.NamedQueries, 'Name');
-        let availableSearches = [
-            ...sortedNamedQueries.map((expression) => {
-                return {
-                    label: expression.Name,
-                    icon: expression.BooleanExpression === this.props.CurrentQuery ? (React.createElement(Icon, { name: 'check' })) : null,
-                    onClick: () => this.runQuery(expression.BooleanExpression),
-                };
-            }),
-            ...(ArrayExtensions.IsNotNullOrEmpty(this.props.CachedQueries) ? [{ separator: true }] : []),
-            ...(ArrayExtensions.IsNotNullOrEmpty(this.props.CachedQueries)
-                ? this.props.CachedQueries.slice(-5)
-                    .reverse()
-                    .map((item) => ({
-                    label: `Grid Filter at ${item.time.toLocaleTimeString('en-US')}`,
-                    icon: React.createElement(Icon, { name: 'history' }),
-                    onClick: () => this.props.api.gridFilterApi.setGridFilterExpression(item.expression),
-                }))
-                : []),
-        ];
-        let availableColumns = this.props.api.columnApi.getColumns().map((col) => {
-            return {
-                label: col.friendlyName,
-                onClick: () => this.setState({
-                    expression: this.state.expression + `[${col.columnId}]`,
-                }),
-            };
-        });
-        const elementType = this.props.viewType === 'Toolbar' ? 'DashboardToolbar' : 'ToolPanel';
-        const handleEnter = (e) => {
-            if (e.key === 'Enter') {
-                this.runQuery();
-            }
-        };
-        const renderTextInput = () => {
-            return this.props.viewType === 'Toolbar' ? (React.createElement(FieldWrap, { marginRight: 1, width: 500 },
-                React.createElement(ButtonExpand, { variant: "text", tone: "neutral", onClick: () => this.props.api.gridFilterApi.expandGridFilterEditor(this.state.expression), tooltip: "Expand", marginLeft: 1 }),
-                React.createElement(Input, { type: "text", "data-name": "grid-filter-input", placeholder: "Grid Filter", spellCheck: false, value: this.state.expression, onChange: (x) => this.setState({ expression: x.target.value }), style: { fontFamily: 'monospace', fontSize: 12 } }),
-                isExpressionValid ? (React.createElement(ButtonPlay, { onClick: () => this.runQuery(), tooltip: '', accessLevel: 'Full', variant: "text", tone: "neutral", disabled: this.state.expression == '' || this.state.expression == this.props.CurrentQuery, marginRight: 1 })) : (React.createElement(ButtonInvalid, { variant: "text", tone: "neutral", tooltip: "Invalid Grid Filter", marginRight: 1 })),
-                ' ',
-                this.props.CurrentQuery !== '' && (React.createElement(ButtonClear, { onClick: () => this.clearQuery(), tooltip: "Clear Grid Filter", accessLevel: 'Full' })))) : (React.createElement(Input, { type: "text", placeholder: "Grid Filter", spellCheck: false, value: this.state.expression, onChange: (x) => this.setState({ expression: x.target.value }), style: { width: '100%' } }));
-        };
-        const queryModuleAccessLevel = this.props.api.internalApi
-            .getEntitlementService()
-            .getEntitlementAccessLevelForModule(NamedQueryModuleId);
-        const saveButton = (React.createElement(ButtonSave, { onClick: () => this.saveQuery(), tooltip: "Save as Named Query", accessLevel: queryModuleAccessLevel, disabled: !isExpressionValid || isExpressionNamedQuery || this.state.expression == '', variant: "text", tone: "neutral", marginRight: 1 }));
-        const renderButtons = () => {
-            return this.props.viewType === 'Toolbar' ? (React.createElement(React.Fragment, null,
-                saveButton,
-                React.createElement(DropdownButton, { variant: "text", items: availableColumns, marginRight: 1, tooltip: "Pick Columns" },
-                    React.createElement(Icon, { name: 'list' })),
-                React.createElement(DropdownButton, { disabled: ArrayExtensions.IsNullOrEmpty(availableSearches), variant: "text", items: availableSearches, marginRight: 1, tooltip: "Load Named Query", icon: "folder-open" }),
-                ' ')) : (React.createElement(React.Fragment, null,
-                saveButton,
-                React.createElement(ButtonExpand, { variant: "text", tone: "neutral", onClick: () => this.props.api.gridFilterApi.expandGridFilterEditor(this.state.expression), tooltip: "Expand", marginLeft: 1 }),
-                React.createElement(ButtonClear, { onClick: () => this.clearQuery(), tooltip: "Clear Grid Filter", accessLevel: 'Full', disabled: this.state.expression == '' }),
-                React.createElement(ButtonPlay, { onClick: () => this.runQuery(), tooltip: "Run Grid Filter", accessLevel: 'Full', variant: "text", tone: "neutral", disabled: !isExpressionValid ||
-                        this.state.expression == '' ||
-                        this.state.expression == this.props.CurrentQuery, marginRight: 1 }),
-                React.createElement(DropdownButton, { variant: "text", disabled: ArrayExtensions.IsNullOrEmpty(availableSearches), items: availableSearches, marginRight: 1, tooltip: "Load Named Query", icon: "folder-open" })));
-        };
-        return (React.createElement(Flex, { onKeyDown: handleEnter, flexDirection: "row", className: `ab-${elementType}__Query__wrap`, flexWrap: this.props.viewType === 'ToolPanel' ? 'wrap' : 'nowrap' },
-            React.createElement(Flex, null, renderTextInput()),
-            React.createElement(Flex, null, renderButtons())));
-    }
-    clearQuery() {
-        this.props.api.gridFilterApi.setGridFilterExpression('');
-    }
-    saveQuery() {
-        this.props.onShowNamedQueries(this.state.expression, this.props.moduleInfo.Popup);
-    }
-    onSelectedQueryChanged(queryName) {
-        this.props.api.gridFilterApi.setGridFilterExpression(queryName);
-    }
-    runQuery(expression = this.state.expression) {
-        if (StringExtensions.IsNullOrEmpty(expression) &&
-            StringExtensions.IsNotNullOrEmpty(this.props.CurrentQuery)) {
-            // user pressed enter key with an empty input => clear existing current query
-            this.props.api.gridFilterApi.setGridFilterExpression('');
-            return;
-        }
-        if (!this.props.api.internalApi
-            .getQueryLanguageService()
-            .validateBoolean(expression, NamedQueryModuleId).isValid) {
-            return;
+    const elementType = props.viewType === 'Toolbar' ? 'DashboardToolbar' : 'ToolPanel';
+    const handleEnter = (e) => {
+        if (e.key === 'Enter') {
+            runQuery();
         }
-        if (StringExtensions.IsNotNullOrEmpty(this.state.expression)) {
-            let cachedQuery = {
-                expression: this.state.expression,
-                time: new Date(),
-            };
-            if (cachedQuery) {
-                this.props.onAddCachedQuery(cachedQuery);
-            }
-        }
-        this.props.api.gridFilterApi.setGridFilterExpression(expression);
-    }
-}
-function mapStateToProps(state) {
-    var _a, _b, _c;
-    return {
-        CurrentQuery: (_c = (_b = (_a = state.Layout.Layouts.find((l) => l.Name == state.Layout.CurrentLayout)) === null || _a === void 0 ? void 0 : _a.GridFilter) === null || _b === void 0 ? void 0 : _b.Expression) !== null && _c !== void 0 ? _c : '',
-        NamedQueries: state.NamedQuery.NamedQueries,
-        CachedQueries: state.System.CachedQueries,
     };
-}
-function mapDispatchToProps(dispatch) {
-    return {
-        onAddCachedQuery: (cachedQuery) => dispatch(SystemRedux.SystemCachedQueryAdd(cachedQuery)),
-        onShowNamedQueries: (value, popup) => dispatch(PopupRedux.PopupShowScreen(ModuleConstants.NamedQueryModuleId, popup, {
-            action: 'New',
-            source: 'Toolbar',
-            value,
-        })),
+    const buttonExpand = (React.createElement(ButtonExpand_1.ButtonExpand, { disabled: isSuspended, accessLevel: gridFilterAccessLevel, variant: "text", tone: "neutral", onClick: onExpand, tooltip: "Edit the Expression in UI", marginLeft: 1 }));
+    const renderTextInput = () => {
+        return props.viewType === 'Toolbar' ? (React.createElement(FieldWrap_1.default, { marginRight: 1, width: 500 },
+            buttonExpand,
+            React.createElement(Input_1.default, { disabled: isSuspended || gridFilterAccessLevel == 'ReadOnly', type: "text", "data-name": "grid-filter-input", placeholder: "Grid Filter", spellCheck: false, value: expression, onChange: (x) => setExpression(x.target.value), style: { fontFamily: 'monospace', fontSize: 12 } }),
+            isExpressionValid && (React.createElement(ButtonPlay_1.ButtonPlay, { onClick: () => runQuery(), tooltip: '', accessLevel: gridFilterAccessLevel, variant: "text", tone: "neutral", disabled: isSuspended || expression == '' || expression == (gridFilter === null || gridFilter === void 0 ? void 0 : gridFilter.Expression), marginRight: 1 })),
+            gridFilter && !isExpressionValid && (React.createElement(ButtonInvalid_1.ButtonInvalid, { variant: "text", tone: "neutral", tooltip: "Invalid Grid Filter", marginRight: 1 })),
+            ' ',
+            StringExtensions_1.default.IsNotNullOrEmpty(expression) && (React.createElement(ButtonClear_1.ButtonClear, { onClick: () => clearQuery(), tooltip: "Clear Grid Filter", accessLevel: gridFilterAccessLevel })))) : (React.createElement(FieldWrap_1.default, null,
+            ' ',
+            buttonExpand,
+            React.createElement(Input_1.default, { disabled: isSuspended || gridFilterAccessLevel == 'ReadOnly', type: "text", "data-name": "grid-filter-input", placeholder: "Grid Filter", spellCheck: false, value: expression, onChange: (x) => setExpression(x.target.value), style: { width: '100%' } })));
+    };
+    const saveButton = (React.createElement(ButtonSave_1.ButtonSave, { onClick: () => saveQuery(), tooltip: "Save as Named Query", accessLevel: namedQueryModuleAccessLevel, disabled: isSuspended || !isExpressionValid || isExpressionNamedQuery || expression == '', variant: "text", tone: "neutral", marginRight: 1 }));
+    const suspendButton = (React.createElement(ButtonPause_1.ButtonPause, { onClick: () => suspendGridFilter(), tooltip: "Suspend Grid Filter", accessLevel: gridFilterAccessLevel, disabled: !isExpressionValid, variant: "text", tone: "neutral", marginRight: 1 }));
+    const unSuspendButton = (React.createElement(ButtonUnsuspend_1.ButtonUnsuspend, { onClick: () => unSuspendGridFilter(), tooltip: "Unsuspend Grid Filter", accessLevel: gridFilterAccessLevel, disabled: !isExpressionValid, variant: "text", tone: "neutral", marginRight: 1 }));
+    const namedQuerySelector = (React.createElement(NamedQuerySelector_1.NamedQuerySelector, { namedQueries: namedQueries, cachedQueries: cachedQueries, currentQuery: gridFilter === null || gridFilter === void 0 ? void 0 : gridFilter.Expression, onSelect: (query) => runQuery(query), setGridFilterExpression: (query) => setGridFilterExpression(query) }));
+    const columnsDropdown = (React.createElement(DropdownButton_1.default, { disabled: isSuspended, accessLevel: gridFilterAccessLevel, variant: "text", items: availableColumns, marginRight: 1, tooltip: "Pick Columns" },
+        React.createElement(icons_1.Icon, { name: 'list' })));
+    const renderButtons = () => {
+        return props.viewType === 'Toolbar' ? (React.createElement(React.Fragment, null,
+            saveButton,
+            isSuspended ? unSuspendButton : suspendButton,
+            columnsDropdown,
+            namedQuerySelector,
+            ' ')) : (React.createElement(React.Fragment, null,
+            React.createElement(ButtonPlay_1.ButtonPlay, { onClick: () => runQuery(), tooltip: "Run Grid Filter", accessLevel: gridFilterAccessLevel, variant: "text", tone: "neutral", disabled: isSuspended || !isExpressionValid || expression == '' || expression == gridFilter, marginRight: 1 }),
+            ' ',
+            React.createElement(ButtonClear_1.ButtonClear, { onClick: () => clearQuery(), tooltip: "Clear Grid Filter", accessLevel: gridFilterAccessLevel, disabled: expression == '' }),
+            ' ',
+            saveButton,
+            isSuspended ? unSuspendButton : suspendButton,
+            namedQuerySelector));
     };
-}
-export let GridFilterPanelControl = connect(mapStateToProps, mapDispatchToProps)(QueryViewPanelComponent);
+    return (React.createElement(rebass_1.Flex, { onKeyDown: handleEnter, flexDirection: "row", className: `ab-${elementType}__Query__wrap`, flexWrap: props.viewType === 'ToolPanel' ? 'wrap' : 'nowrap' },
+        React.createElement(rebass_1.Flex, null, renderTextInput()),
+        React.createElement(rebass_1.Flex, null, renderButtons())));
+};
+exports.GridFilterPanelControl = QueryViewPanelComponent;

package/src/View/GridFilter/GridFilterWindowPopup.js

@@ -1,5 +1,10 @@
-import * as React from 'react';
-import { GridFilterExpressionEditor } from './GridFilterExpressionEditor';
-export const GridFilterWindowPopup = (props) => {
-    return (React.createElement(GridFilterExpressionEditor, { expression: props.popupProps.value, onDismiss: props.onDismiss }));
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.GridFilterWindowPopup = void 0;
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const GridFilterExpressionEditor_1 = require("./GridFilterExpressionEditor");
+const GridFilterWindowPopup = (props) => {
+    return (React.createElement(GridFilterExpressionEditor_1.GridFilterExpressionEditor, { expression: props.popupProps.value, onDismiss: props.onDismiss }));
 };
+exports.GridFilterWindowPopup = GridFilterWindowPopup;

package/src/View/GridFilter/NamedQuerySelector.d.ts

@@ -0,0 +1,16 @@
+/// <reference types="react" />
+import { CachedQuery } from '../../PredefinedConfig/NamedQueryState';
+import { NamedQuery } from '../../types';
+export declare const AvailableSearchLabel: (props: {
+    label: string;
+    expression: string;
+}) => JSX.Element;
+export declare const NamedQuerySelector: (props: {
+    namedQueries: NamedQuery[];
+    cachedQueries: CachedQuery[];
+    currentQuery: string;
+    onSelect: (query: string) => void;
+    setGridFilterExpression: (query: string) => void;
+    children?: any;
+    disabled?: boolean;
+}) => JSX.Element;

package/src/View/GridFilter/NamedQuerySelector.js

@@ -0,0 +1,56 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.NamedQuerySelector = exports.AvailableSearchLabel = void 0;
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const rebass_1 = require("rebass");
+const icons_1 = require("../../components/icons");
+const Panel_1 = tslib_1.__importDefault(require("../../components/Panel"));
+const SimpleButton_1 = tslib_1.__importDefault(require("../../components/SimpleButton"));
+const Tag_1 = require("../../components/Tag");
+const Enums_1 = require("../../PredefinedConfig/Common/Enums");
+const ArrayExtensions_1 = tslib_1.__importDefault(require("../../Utilities/Extensions/ArrayExtensions"));
+const AdaptablePopover_1 = require("../AdaptablePopover");
+const ButtonOpen_1 = require("../Components/Buttons/ButtonOpen");
+const AvailableSearchLabel = (props) => {
+    return (React.createElement(rebass_1.Flex, { flexDirection: "column", textAlign: "start", width: "100%", justifyContent: "space-around" },
+        React.createElement(rebass_1.Box, { mb: 2, flex: 1 }, props.label),
+        React.createElement(Tag_1.Tag, null, props.expression)));
+};
+exports.AvailableSearchLabel = AvailableSearchLabel;
+const NamedQuerySelector = (props) => {
+    var _a;
+    const sortedNamedQueries = (_a = ArrayExtensions_1.default.sortArrayWithProperty(Enums_1.SortOrder.Asc, props.namedQueries, 'Name')) !== null && _a !== void 0 ? _a : [];
+    const availableSearches = sortedNamedQueries.map((expression) => {
+        return {
+            label: (React.createElement(exports.AvailableSearchLabel, { label: expression.Name, expression: expression.BooleanExpression })),
+            icon: expression.BooleanExpression === props.currentQuery ? React.createElement(icons_1.Icon, { name: 'check' }) : null,
+            onClick: () => props.onSelect(expression.BooleanExpression),
+        };
+    });
+    const cachedQueries = ArrayExtensions_1.default.IsNotNullOrEmpty(props.cachedQueries)
+        ? props.cachedQueries
+            .slice(-3)
+            .reverse()
+            .map((item) => ({
+            label: (React.createElement(exports.AvailableSearchLabel, { label: `Grid Filter at ${item.time.toLocaleTimeString('en-US')}`, expression: item.expression })),
+            icon: React.createElement(icons_1.Icon, { name: 'history' }),
+            onClick: () => props.setGridFilterExpression(item.expression),
+        }))
+        : null;
+    return ArrayExtensions_1.default.IsNotNullOrEmpty(cachedQueries) ||
+        ArrayExtensions_1.default.IsNotNullOrEmpty(availableSearches) ? (React.createElement(AdaptablePopover_1.AdaptablePopover, { tooltipText: "Load Named Query", showIcon: false, popoverMinWidth: 300, bodyText: [
+            React.createElement(rebass_1.Flex, { justifyContent: "stretch", flexDirection: "column" },
+                React.createElement(Panel_1.default, { header: "Named Queries" },
+                    React.createElement(rebass_1.Flex, { flexDirection: "column" }, availableSearches.map((item, index) => {
+                        return (React.createElement(SimpleButton_1.default, { mb: 2, variant: "text", key: index, onClick: item.onClick }, item.label));
+                    }))),
+                cachedQueries ? (React.createElement(React.Fragment, null,
+                    React.createElement(Panel_1.default, { mt: 2, header: "Recent Grid Filters" },
+                        React.createElement(rebass_1.Flex, { flexDirection: "column" }, cachedQueries.map((cachedQuery, index) => {
+                            return (React.createElement(SimpleButton_1.default, { mb: 2, variant: "text", key: index, onClick: cachedQuery.onClick }, cachedQuery.label));
+                        }))))) : null),
+        ] },
+        React.createElement(SimpleButton_1.default, { disabled: props.disabled, variant: "text", icon: "folder-open" }, props.children))) : (React.createElement(ButtonOpen_1.ButtonOpen, { tooltip: "Load Named Query", disabled: true }));
+};
+exports.NamedQuerySelector = NamedQuerySelector;

package/src/View/GridFilter/useGridFilterExpressionEditor.d.ts

@@ -0,0 +1,26 @@
+import * as React from 'react';
+import { CachedQuery } from '../../PredefinedConfig/NamedQueryState';
+export declare const useGridFilterExpressionEditor: () => {
+    namedQueryModuleAccessLevel: import("../../types").AccessLevel;
+    cachedQueries: CachedQuery[];
+    expression: string;
+    setExpression: React.Dispatch<React.SetStateAction<string>>;
+    isExpressionNamedQuery: boolean;
+    isExpressionValid: boolean;
+    isSuspended: boolean;
+    gridFilter: import("../../types").GridFilter;
+    isAdaptableReady: boolean;
+    namedQueries: import("../../types").NamedQuery[];
+    onAddCachedQuery: (cachedQuery: CachedQuery) => void;
+    availableColumns: any[];
+    runQuery: (newExpression?: string) => void;
+    clearQuery: () => void;
+    onExpand: () => void;
+    saveQuery: () => void;
+    suspendGridFilter: () => void;
+    unSuspendGridFilter: () => void;
+    setGridFilterExpression: (expression: string) => void;
+    gridFilterAccessLevel: import("../../types").AccessLevel;
+    gridFilterHelpPage: string;
+    gridFilterLinkDisabled: boolean;
+};

package/src/View/GridFilter/useGridFilterExpressionEditor.js

@@ -0,0 +1,136 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useGridFilterExpressionEditor = void 0;
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const react_redux_1 = require("react-redux");
+const SystemRedux = tslib_1.__importStar(require("../../Redux/ActionsReducers/SystemRedux"));
+const ModuleConstants_1 = require("../../Utilities/Constants/ModuleConstants");
+const StringExtensions_1 = tslib_1.__importDefault(require("../../Utilities/Extensions/StringExtensions"));
+const AdaptableContext_1 = require("../AdaptableContext");
+const PopupRedux = tslib_1.__importStar(require("../../Redux/ActionsReducers/PopupRedux"));
+const useGridFilterExpressionEditor = () => {
+    var _a, _b, _c;
+    const adaptable = (0, AdaptableContext_1.useAdaptable)();
+    const dispatch = (0, react_redux_1.useDispatch)();
+    const gridFilter = (0, react_redux_1.useSelector)((state) => {
+        var _a;
+        return (_a = state.Layout.Layouts.find((l) => l.Name == state.Layout.CurrentLayout)) === null || _a === void 0 ? void 0 : _a.GridFilter;
+    });
+    const [isAdaptableReady, setIsAdaptableReady] = React.useState(false);
+    const [expression, setExpression] = React.useState(() => {
+        return adaptable.api.gridFilterApi.getCurrentGridFilterExpression();
+    });
+    const namedQueries = (_a = (0, react_redux_1.useSelector)((state) => state.NamedQuery.NamedQueries)) !== null && _a !== void 0 ? _a : [];
+    const cachedQueries = (_b = (0, react_redux_1.useSelector)((state) => state.System.CachedQueries)) !== null && _b !== void 0 ? _b : [];
+    const isSuspended = (_c = gridFilter === null || gridFilter === void 0 ? void 0 : gridFilter.IsSuspended) !== null && _c !== void 0 ? _c : false;
+    const onAddCachedQuery = (cachedQuery) => {
+        dispatch(SystemRedux.SystemCachedQueryAdd(cachedQuery));
+    };
+    const gridFilterHelpPage = adaptable.ModuleService.getModuleById('GridFilter').moduleInfo.HelpPage;
+    const gridFilterLinkDisabled = !adaptable.api.internalApi.isDocumentationLinksDisplayed();
+    React.useEffect(() => {
+        adaptable.api.eventApi.on('AdaptableReady', () => {
+            setIsAdaptableReady(true);
+        });
+    }, []);
+    React.useEffect(() => {
+        if ((gridFilter === null || gridFilter === void 0 ? void 0 : gridFilter.Expression) != expression) {
+            setExpression(gridFilter === null || gridFilter === void 0 ? void 0 : gridFilter.Expression);
+        }
+    }, [gridFilter === null || gridFilter === void 0 ? void 0 : gridFilter.Expression]);
+    const isExpressionValid = expression == '' ||
+        adaptable.api.internalApi
+            .getQueryLanguageService()
+            .validateBoolean(expression, ModuleConstants_1.NamedQueryModuleId).isValid;
+    const isExpressionNamedQuery = namedQueries.find((sq) => sq.BooleanExpression == expression) != null;
+    let availableColumns = adaptable.api.columnApi.getColumns().map((col) => {
+        return {
+            label: col.friendlyName,
+            onClick: () => {
+                // Bogdan - im sure there is a better way to do this check with fancy operators i dont know
+                const newExp = StringExtensions_1.default.IsNotNullOrEmpty(expression) ? expression : '';
+                setExpression(newExp + `[${col.columnId}]`);
+            },
+        };
+    });
+    const clearQuery = () => {
+        adaptable.api.gridFilterApi.clearGridFilter();
+        setExpression('');
+    };
+    const runQuery = (newExpression = expression) => {
+        if (StringExtensions_1.default.IsNullOrEmpty(newExpression) &&
+            StringExtensions_1.default.IsNotNullOrEmpty(gridFilter === null || gridFilter === void 0 ? void 0 : gridFilter.Expression)) {
+            // user pressed enter key with an empty input => clear existing current query
+            adaptable.api.gridFilterApi.setGridFilterExpression('');
+            return;
+        }
+        if (!adaptable.api.internalApi
+            .getQueryLanguageService()
+            .validateBoolean(newExpression, ModuleConstants_1.NamedQueryModuleId).isValid) {
+            return;
+        }
+        if (StringExtensions_1.default.IsNotNullOrEmpty(expression)) {
+            let cachedQuery = {
+                expression: expression,
+                time: new Date(),
+            };
+            if (cachedQuery) {
+                onAddCachedQuery(cachedQuery);
+            }
+        }
+        adaptable.api.gridFilterApi.setGridFilterExpression(newExpression);
+    };
+    const gridFilterAccessLevel = React.useMemo(() => {
+        return adaptable.api.internalApi
+            .getEntitlementService()
+            .getEntitlementAccessLevelForModule(ModuleConstants_1.GridFilterModuleId);
+    }, []);
+    const namedQueryModuleAccessLevel = adaptable.api.internalApi
+        .getEntitlementService()
+        .getEntitlementAccessLevelForModule(ModuleConstants_1.NamedQueryModuleId);
+    const onShowNamedQueries = (value, popup) => dispatch(PopupRedux.PopupShowScreen(ModuleConstants_1.NamedQueryModuleId, popup, {
+        action: 'New',
+        source: 'Other',
+        value,
+    }));
+    const saveQuery = () => {
+        const namedqueryPopuName = adaptable.api.internalApi
+            .getModuleService()
+            .getModuleById(ModuleConstants_1.NamedQueryModuleId).moduleInfo.Popup;
+        onShowNamedQueries(expression, namedqueryPopuName);
+    };
+    const suspendGridFilter = () => {
+        adaptable.api.gridFilterApi.suspendGridFilter();
+    };
+    const unSuspendGridFilter = () => {
+        adaptable.api.gridFilterApi.unSuspendGridFilter();
+    };
+    return {
+        namedQueryModuleAccessLevel,
+        cachedQueries,
+        expression,
+        setExpression,
+        isExpressionNamedQuery,
+        isExpressionValid,
+        isSuspended,
+        gridFilter,
+        isAdaptableReady,
+        namedQueries,
+        onAddCachedQuery,
+        availableColumns,
+        runQuery,
+        clearQuery,
+        onExpand: () => adaptable.api.gridFilterApi.openUIEditorForGridFilter(expression),
+        saveQuery,
+        suspendGridFilter,
+        unSuspendGridFilter,
+        setGridFilterExpression: (expression) => {
+            adaptable.api.gridFilterApi.setGridFilterExpression(expression);
+        },
+        gridFilterAccessLevel,
+        gridFilterHelpPage,
+        gridFilterLinkDisabled,
+    };
+};
+exports.useGridFilterExpressionEditor = useGridFilterExpressionEditor;

package/src/View/GridFilter/useGridFilterOptionsForExpressionEditor.d.ts

@@ -0,0 +1,4 @@
+export declare const useGridFilterOptionsForExpressionEditorProps: () => {
+    showQueryBuilder: boolean;
+    showExpressionEditor: boolean;
+};

package/src/View/GridFilter/useGridFilterOptionsForExpressionEditor.js

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useGridFilterOptionsForExpressionEditorProps = void 0;
+const AdaptableContext_1 = require("../AdaptableContext");
+const useGridFilterOptionsForExpressionEditorProps = () => {
+    const adaptable = (0, AdaptableContext_1.useAdaptable)();
+    const gridFilterEditors = adaptable.api.optionsApi.getGridFilterOptions().availableFilterEditors;
+    return {
+        showQueryBuilder: gridFilterEditors.includes('QueryBuilder'),
+        showExpressionEditor: gridFilterEditors.includes('ExpressionEditor'),
+    };
+};
+exports.useGridFilterOptionsForExpressionEditorProps = useGridFilterOptionsForExpressionEditorProps;

package/src/View/GridInfo/GridInfoPopup/AdaptableObjectsSummary.js

@@ -1,14 +1,18 @@
-import * as React from 'react';
-import { useSelector } from 'react-redux';
-import { Box } from 'rebass';
-import { useAdaptable } from '../../AdaptableContext';
-import { AdaptableObjectList } from '../../Components/AdaptableObjectList';
-export const AdaptableObjectsSummary = () => {
-    const state = useSelector((state) => state);
-    const adaptable = useAdaptable();
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AdaptableObjectsSummary = void 0;
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const react_redux_1 = require("react-redux");
+const rebass_1 = require("rebass");
+const AdaptableContext_1 = require("../../AdaptableContext");
+const AdaptableObjectList_1 = require("../../Components/AdaptableObjectList");
+const AdaptableObjectsSummary = () => {
+    const state = (0, react_redux_1.useSelector)((state) => state);
+    const adaptable = (0, AdaptableContext_1.useAdaptable)();
     const modules = adaptable.ModuleService.getModuleCollection();
     const baseClassName = 'ab-AdaptableObjectsSummary';
-    return (React.createElement(Box, { className: baseClassName }, [...modules].map(([moduleName, module]) => {
+    return (React.createElement(rebass_1.Box, { className: baseClassName }, [...modules].map(([moduleName, module]) => {
         var _a;
         if (!module.isModuleAvailable()) {
             return null;
@@ -17,8 +21,9 @@ export const AdaptableObjectsSummary = () => {
         if (!(items === null || items === void 0 ? void 0 : items.length)) {
             return null;
         }
-        return (React.createElement(Box, { "data-name": module.moduleInfo.ModuleName, className: `${baseClassName}__module-list`, key: module.moduleInfo.ModuleName },
+        return (React.createElement(rebass_1.Box, { "data-name": module.moduleInfo.ModuleName, className: `${baseClassName}__module-list`, key: module.moduleInfo.ModuleName },
             React.createElement("b", { className: `${baseClassName}__header` }, module.moduleInfo.FriendlyName),
-            (items === null || items === void 0 ? void 0 : items.length) && React.createElement(AdaptableObjectList, { items: items, module: module })));
+            (items === null || items === void 0 ? void 0 : items.length) && React.createElement(AdaptableObjectList_1.AdaptableObjectList, { items: items, module: module })));
     })));
 };
+exports.AdaptableObjectsSummary = AdaptableObjectsSummary;