@adaptabletools/adaptable 14.0.3 → 14.1.0

package/src/View/Alert/Utilities/getAlertType.js

@@ -0,0 +1,58 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getAlertTypeText = exports.getAlertType = exports.AlertType = void 0;
+var AlertType;
+(function (AlertType) {
+    AlertType["DataChange"] = "DataChange";
+    AlertType["RowChange"] = "RowChange";
+    AlertType["Aggregation"] = "Aggregation";
+    AlertType["Observable"] = "Observable";
+})(AlertType = exports.AlertType || (exports.AlertType = {}));
+/**
+ * Based on alert shape the type is derived.
+ * In the future the alert will get a type property.
+ *
+ * @param alert
+ */
+const getAlertType = (alert) => {
+    if (alert.Rule.ObservableExpression) {
+        return AlertType.Observable;
+    }
+    if (alert.Rule.AggregatedBooleanExpression) {
+        return AlertType.Aggregation;
+    }
+    if (alert.Rule.BooleanExpression) {
+        return AlertType.DataChange;
+    }
+    const predicates = alert.Rule.Predicates;
+    if (predicates) {
+        if (predicates.some((predicate) => ['AddedRow', 'RemovedRow'].includes(predicate.PredicateId))) {
+            return AlertType.RowChange;
+        }
+        else {
+            return AlertType.DataChange;
+        }
+    }
+    // the object is not a valid alert
+    return null;
+};
+exports.getAlertType = getAlertType;
+const getAlertTypeText = (alertType) => {
+    let text = '';
+    switch (alertType) {
+        case AlertType.DataChange:
+            text = 'Data Change';
+            break;
+        case AlertType.RowChange:
+            text = 'Row Change';
+            break;
+        case AlertType.Aggregation:
+            text = 'Aggregation';
+            break;
+        case AlertType.Observable:
+            text = 'Observable';
+            break;
+    }
+    return text;
+};
+exports.getAlertTypeText = getAlertTypeText;

package/src/View/Alert/Utilities/getAvailablePredicates.d.ts

@@ -0,0 +1,3 @@
+import { AdaptableApi, AdaptablePredicateDef, AdaptableScope } from '../../../types';
+import { AlertType } from './getAlertType';
+export declare const getAvailablePredicateDefinitions: (api: AdaptableApi, scope: AdaptableScope, alertType: AlertType) => AdaptablePredicateDef[];

package/src/View/Alert/Utilities/getAvailablePredicates.js

@@ -0,0 +1,19 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getAvailablePredicateDefinitions = void 0;
+const getAvailablePredicateDefinitions = (api, scope, alertType) => {
+    let predicateDefs = [];
+    if (alertType === 'DataChange') {
+        predicateDefs = api.alertApi.internalApi
+            .getAlertPredicateDefsForScope(scope)
+            .filter((predicateDef) => !['AddedRow', 'RemovedRow'].includes(predicateDef.id));
+        predicateDefs = [...predicateDefs].sort((a, b) => a.id === 'Any' ? -1 : b.id === 'Any' ? 1 : 0);
+    }
+    else if (alertType === 'RowChange') {
+        predicateDefs = api.alertApi.internalApi
+            .getAlertPredicateDefsForScope(scope)
+            .filter((predicateDef) => ['AddedRow', 'RemovedRow'].includes(predicateDef.id));
+    }
+    return predicateDefs;
+};
+exports.getAvailablePredicateDefinitions = getAvailablePredicateDefinitions;

package/src/View/Alert/Utilities/getDefaultAlertDefinition.d.ts

@@ -0,0 +1,37 @@
+import { AlertDefinition } from '../../../types';
+import { AlertType } from './getAlertType';
+/**
+ * This logic should be moved into Object factory once we have types on alert definitions
+ * @param type AlertType
+ */
+export declare const getDefaultAlertDefinition: (alertDefinition: AlertDefinition, type: AlertType) => {
+    Uuid: string;
+    Scope: import("../../../types").AdaptableScope<import("../../../PredefinedConfig/Common/AdaptableScope").ScopeDataType>;
+    Rule: ({
+        Predicates?: never;
+    } & (({
+        BooleanExpression?: never;
+    } & (({
+        ObservableExpression?: never;
+    } & import("../../../types").AdaptableAggregatedBooleanQuery) | ({
+        AggregatedBooleanExpression?: never;
+    } & import("../../../types").AdaptableObservableQuery))) | ({
+        AggregatedBooleanExpression?: never;
+        ObservableExpression?: never;
+    } & import("../../../types").AdaptableBooleanQuery))) | ({
+        AggregatedBooleanExpression?: never;
+        ObservableExpression?: never;
+        BooleanExpression?: never;
+    } & {
+        Predicates: import("../../../types").AlertDefinitionPredicate[];
+    });
+    MessageType: import("../../../types").AdaptableMessageType;
+    MessageHeader?: string;
+    MessageText?: string;
+    AlertProperties?: import("../../../types").AlertProperties;
+    AlertForm?: string | import("../../../types").AlertButtonForm;
+    IsSuspended?: boolean;
+    Source?: "Config" | "User";
+    IsReadOnly?: boolean;
+    Tags?: string[];
+};

package/src/View/Alert/Utilities/getDefaultAlertDefinition.js

@@ -0,0 +1,32 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getDefaultAlertDefinition = void 0;
+const tslib_1 = require("tslib");
+const ObjectFactory_1 = tslib_1.__importDefault(require("../../../Utilities/ObjectFactory"));
+const getAlertType_1 = require("./getAlertType");
+/**
+ * This logic should be moved into Object factory once we have types on alert definitions
+ * @param type AlertType
+ */
+const getDefaultAlertDefinition = (alertDefinition, type) => {
+    const newAlert = Object.assign(Object.assign({}, ObjectFactory_1.default.CreateEmptyAlertDefinition()), { Uuid: alertDefinition.Uuid });
+    // can only be all
+    if (type === getAlertType_1.AlertType.Observable ||
+        type === getAlertType_1.AlertType.Aggregation ||
+        type === getAlertType_1.AlertType.RowChange) {
+        newAlert.Scope = {
+            All: true,
+        };
+    }
+    if (type === getAlertType_1.AlertType.RowChange) {
+        newAlert.Rule = {
+            Predicates: [
+                {
+                    PredicateId: 'AddedRow',
+                },
+            ],
+        };
+    }
+    return newAlert;
+};
+exports.getDefaultAlertDefinition = getDefaultAlertDefinition;

package/src/View/Alert/Utilities/mapAlertDefinition.d.ts

@@ -0,0 +1,2 @@
+import { AdaptableApi, AlertDefinition } from '../../../types';
+export declare const mapAlertDefinition: (api: AdaptableApi, alertDefinition: AlertDefinition) => AlertDefinition;

package/src/View/Alert/Utilities/mapAlertDefinition.js

@@ -0,0 +1,38 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.mapAlertDefinition = void 0;
+const mapAlertDefinition = (api, alertDefinition) => {
+    var _a;
+    const isRemovedRowChangeAlert = api.alertApi.internalApi.isAlertDefinitionForRemovedRowChangeEvent(alertDefinition);
+    const mapValidButtonActions = (alertAction) => {
+        if (isRemovedRowChangeAlert) {
+            if (alertAction === 'highlight-row' || alertAction === 'jump-to-row') {
+                return null;
+            }
+            return alertAction;
+        }
+    };
+    // the only case needed is when changing from AddedRow to RemovedRow
+    // map FormButton Actions
+    if (alertDefinition.AlertForm && typeof alertDefinition.AlertForm !== 'string') {
+        const alertButtons = (_a = alertDefinition.AlertForm) === null || _a === void 0 ? void 0 : _a.Buttons;
+        alertButtons === null || alertButtons === void 0 ? void 0 : alertButtons.forEach((alertButton) => {
+            const alertAction = alertButton.Action;
+            if (Array.isArray(alertAction)) {
+                alertButton.Action = alertAction
+                    .map(mapValidButtonActions)
+                    .filter(Boolean);
+            }
+            else {
+                alertButton.Action = mapValidButtonActions(alertAction);
+            }
+        });
+    }
+    // behaviours
+    if (isRemovedRowChangeAlert) {
+        delete alertDefinition.AlertProperties.HighlightRow;
+        delete alertDefinition.AlertProperties.JumpToRow;
+    }
+    return alertDefinition;
+};
+exports.mapAlertDefinition = mapAlertDefinition;

package/src/View/Alert/Wizard/AlertBehaviourWizardSection.d.ts

@@ -1,10 +1,12 @@
 /// <reference types="react" />
 import { AlertDefinition } from '../../../PredefinedConfig/AlertState';
 import { AdaptableApi } from '../../../types';
+import { AlertType } from '../Utilities/getAlertType';
+export declare const renderAlertBehaviourWizardSummary: (alertDefinition: AlertDefinition) => JSX.Element;
+export declare const renderAlertBehaviourSummary: (alert: AlertDefinition, api: AdaptableApi, allowWrap?: boolean) => JSX.Element;
 declare type AlertBehaviourWizardSectionProps = {
     onChange: (data: AlertDefinition) => void;
+    alertType: AlertType;
 };
-export declare const renderAlertBehaviourWizardSummary: (alertDefinition: AlertDefinition) => JSX.Element;
-export declare const renderAlertBehaviourSummary: (alert: AlertDefinition, api: AdaptableApi, allowWrap?: boolean) => JSX.Element;
 export declare const AlertBehaviourWizardSection: (props: AlertBehaviourWizardSectionProps) => JSX.Element;
 export {};

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

@@ -89,14 +89,21 @@ exports.renderAlertBehaviourSummary = renderAlertBehaviourSummary;
 const AlertBehaviourWizardSection = (props) => {
     const { data, api } = (0, OnePageAdaptableWizard_1.useOnePageAdaptableWizardContext)();
     const { AlertProperties = {} } = data;
-    const rowAddedAlert = api.alertApi.internalApi.isAlertDefinitionForAddedRowChangeEvent(data);
     const rowRemovedAlert = api.alertApi.internalApi.isAlertDefinitionForRemovedRowChangeEvent(data);
-    const cellChangedAlert = !rowAddedAlert && !rowRemovedAlert;
-    const hasPreventCellEdit = cellChangedAlert;
-    const hasHighlightCell = cellChangedAlert;
-    const hasHighlightRow = cellChangedAlert || rowAddedAlert;
-    const hasJumpToCell = cellChangedAlert;
-    const hasJumpToRow = cellChangedAlert || rowAddedAlert;
+    // data change only
+    const hasPreventCellEdit = props.alertType === 'DataChange';
+    // except row change
+    const hasHighlightCell = props.alertType !== 'RowChange';
+    // except row removed
+    const hasHighlightRow = !rowRemovedAlert;
+    // except row changed
+    const hasJumpToCell = props.alertType !== 'RowChange';
+    // for all
+    const showInSeparateDiv = true;
+    // for all
+    const logToConsole = true;
+    // except row removed
+    const hasJumpToRow = !rowRemovedAlert;
     const onChange = (AlertProperties) => {
         props.onChange(Object.assign(Object.assign({}, data), { AlertProperties: Object.assign(Object.assign({}, data.AlertProperties), AlertProperties) }));
     };
@@ -122,14 +129,14 @@ const AlertBehaviourWizardSection = (props) => {
             hasJumpToRow && (React.createElement(CheckBox_1.CheckBox, { "data-name": "jump-to-row", checked: AlertProperties.JumpToRow, onChange: (JumpToRow) => {
                     onChange({ JumpToRow });
                 } }, "Jump To Row")),
-            React.createElement(CheckBox_1.CheckBox, { "data-name": "show-in-div", checked: AlertProperties.ShowInDiv, onChange: (ShowInDiv) => {
+            showInSeparateDiv && (React.createElement(CheckBox_1.CheckBox, { "data-name": "show-in-div", checked: AlertProperties.ShowInDiv, onChange: (ShowInDiv) => {
                     onChange({ ShowInDiv });
                 } },
                 "Show in separate ",
                 React.createElement(CodeBlock_1.CodeBlock, null, `<div />`),
-                " element"),
-            React.createElement(CheckBox_1.CheckBox, { "data-name": "log-to-console", checked: AlertProperties.LogToConsole, onChange: (LogToConsole) => {
+                " element")),
+            logToConsole && (React.createElement(CheckBox_1.CheckBox, { "data-name": "log-to-console", checked: AlertProperties.LogToConsole, onChange: (LogToConsole) => {
                     onChange({ LogToConsole });
-                } }, "Log To Console"))));
+                } }, "Log To Console")))));
 };
 exports.AlertBehaviourWizardSection = AlertBehaviourWizardSection;

package/src/View/Alert/Wizard/AlertButtonsEditor.d.ts

@@ -3,11 +3,13 @@ import { AlertButton } from '../../../PredefinedConfig/AlertState';
 import { AdaptableAlert } from '../../../PredefinedConfig/Common/AdaptableAlert';
 import { AdaptableApi } from '../../../Api/AdaptableApi';
 import { AlertFormContext } from '../../../types';
+import { AlertType } from '../Utilities/getAlertType';
 declare type AlertButtonsEditorProps = {
     AlertButtons: AlertButton<AlertFormContext>[];
     onChange: (buttons: AlertButton<AlertFormContext>[]) => void;
     api: AdaptableApi;
     adaptableAlert: AdaptableAlert;
+    alertType: AlertType;
 };
 export declare const AlertButtonsEditor: (props: AlertButtonsEditorProps) => JSX.Element;
 export {};

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

@@ -21,11 +21,18 @@ const AlertButtonsEditor = (props) => {
     const rowAddedAlert = api.alertApi.internalApi.isAlertDefinitionForAddedRowChangeEvent(alertDefinition);
     const rowRemovedAlert = api.alertApi.internalApi.isAlertDefinitionForRemovedRowChangeEvent(alertDefinition);
     const cellChangedAlert = !rowAddedAlert && !rowRemovedAlert;
-    const hasHighlightCell = cellChangedAlert;
-    const hasHighlightRow = cellChangedAlert || rowAddedAlert;
-    const hasJumpToCell = cellChangedAlert;
-    const hasJumpToRow = cellChangedAlert || rowAddedAlert;
-    const hasUndo = cellChangedAlert;
+    // except row change
+    const hasHighlightCell = props.alertType !== 'RowChange';
+    // all, except row removed
+    const hasHighlightRow = !rowRemovedAlert;
+    // except row removed
+    const hasJumpToCell = props.alertType !== 'RowChange';
+    // all
+    const hasJumpToRow = !rowRemovedAlert;
+    // all
+    const hasSuspend = true;
+    // only data change
+    const hasUndo = props.alertType === 'DataChange';
     const AlertButtons = (0, Helper_1.cloneObject)(props.AlertButtons || []) || [];
     const buttonActions = [];
     if (hasHighlightRow) {
@@ -43,7 +50,9 @@ const AlertButtonsEditor = (props) => {
     if (hasUndo) {
         buttonActions.push('undo');
     }
-    buttonActions.push('suspend');
+    if (hasSuspend) {
+        buttonActions.push('suspend');
+    }
     return (React.createElement(React.Fragment, null,
         React.createElement(rebass_1.Flex, { flexDirection: "row", alignItems: "center", justifyContent: "space-between" },
             React.createElement(rebass_1.Text, { fontSize: 2, mt: 3, mb: 2 }, "Add buttons to Alert, and Actions to perform when button is clicked"),

package/src/View/Alert/Wizard/AlertMessageWizardSection.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+import { AlertDefinition } from '../../../PredefinedConfig/AlertState';
+import { AlertType } from '../Utilities/getAlertType';
+export declare const renderAlertMessageSummary: () => JSX.Element;
+declare type AlertDisplayWizardSectionProps = {
+    onChange: (data: AlertDefinition) => void;
+    alertType: AlertType;
+};
+export declare const AlertMessageWizardSection: (props: AlertDisplayWizardSectionProps) => JSX.Element;
+export {};

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

@@ -0,0 +1,57 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AlertMessageWizardSection = exports.renderAlertMessageSummary = void 0;
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const Tabs_1 = require("../../../components/Tabs");
+const Radio_1 = tslib_1.__importStar(require("../../../components/Radio"));
+const OnePageAdaptableWizard_1 = require("../../Wizard/OnePageAdaptableWizard");
+const rebass_1 = require("rebass");
+const CodeBlock_1 = require("../../../components/CodeBlock");
+const AdaptableInput_1 = tslib_1.__importDefault(require("../../Components/AdaptableInput"));
+const FormLayout_1 = tslib_1.__importStar(require("../../../components/FormLayout"));
+const renderAlertMessageSummary = () => {
+    const { data } = (0, OnePageAdaptableWizard_1.useOnePageAdaptableWizardContext)();
+    return (React.createElement(rebass_1.Text, { fontSize: 2 },
+        "Message Type ",
+        React.createElement(CodeBlock_1.CodeBlock, null, data.MessageType)));
+};
+exports.renderAlertMessageSummary = renderAlertMessageSummary;
+const AlertMessageWizardSection = (props) => {
+    const { data, api } = (0, OnePageAdaptableWizard_1.useOnePageAdaptableWizardContext)();
+    const messageType = data.MessageType;
+    const messageText = api.alertApi.internalApi.getAlertDescription(data);
+    const messageHeader = data.MessageHeader;
+    const onMessageTextChange = (e) => {
+        const { value } = e.target;
+        props.onChange(Object.assign(Object.assign({}, data), { MessageText: value }));
+    };
+    const onMessageHeaderChange = (e) => {
+        const { value } = e.target;
+        props.onChange(Object.assign(Object.assign({}, data), { MessageHeader: value }));
+    };
+    return (React.createElement(React.Fragment, null,
+        React.createElement(Tabs_1.Tabs, { "data-name": "message-type" },
+            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: "horizontal", onRadioChange: (MessageType) => {
+                        props.onChange(Object.assign(Object.assign({}, data), { MessageType }));
+                    } },
+                    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, { "data-name": "message-text", 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 Alert Type)"),
+                ' ',
+                React.createElement(FormLayout_1.default, null,
+                    React.createElement(FormLayout_1.FormRow, { label: "Header" },
+                        React.createElement(AdaptableInput_1.default, { placeholder: "use defaults", marginTop: 2, type: 'text', autoFocus: false, value: messageHeader, 
+                            // placeholder="defaults to column name"
+                            onChange: (e) => onMessageHeaderChange(e) })),
+                    React.createElement(FormLayout_1.FormRow, { label: "Message" },
+                        React.createElement(AdaptableInput_1.default, { marginTop: 2, type: 'text', autoFocus: false, value: messageText, onChange: (e) => onMessageTextChange(e) })))))));
+};
+exports.AlertMessageWizardSection = AlertMessageWizardSection;

package/src/View/Alert/Wizard/{AlertDisplayWizardSection.d.ts → AlertNotificationWizardSection.d.ts}

@@ -2,15 +2,17 @@ import * as React from 'react';
 import { AlertDefinition } from '../../../PredefinedConfig/AlertState';
 import { AdaptableApi } from '../../../types';
 import { BoxProps } from 'rebass';
-declare type AlertDisplayWizardSectionProps = {
-    onChange: (data: AlertDefinition) => void;
-};
-export declare const renderAlertDisplaySummary: () => JSX.Element;
+import { AlertType } from '../Utilities/getAlertType';
+export declare const renderAlertNotificationSummary: () => JSX.Element;
 interface AlertPreviewProps extends BoxProps {
     api: AdaptableApi;
     alertDefinition: AlertDefinition;
     focusFirstButton?: boolean;
 }
 export declare const AlertPreview: React.FunctionComponent<AlertPreviewProps>;
-export declare const AlertDisplayWizardSection: (props: AlertDisplayWizardSectionProps) => JSX.Element;
+declare type AlertNotificationWizardSectionProps = {
+    onChange: (data: AlertDefinition) => void;
+    alertType: AlertType;
+};
+export declare const AlertNotificationWizardSection: (props: AlertNotificationWizardSectionProps) => JSX.Element;
 export {};

package/src/View/Alert/Wizard/{AlertDisplayWizardSection.js → AlertNotificationWizardSection.js}

@@ -1,19 +1,15 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.AlertDisplayWizardSection = exports.AlertPreview = exports.renderAlertDisplaySummary = void 0;
+exports.AlertNotificationWizardSection = exports.AlertPreview = exports.renderAlertNotificationSummary = void 0;
 const tslib_1 = require("tslib");
 const React = tslib_1.__importStar(require("react"));
 const Tabs_1 = require("../../../components/Tabs");
-const Radio_1 = tslib_1.__importStar(require("../../../components/Radio"));
 const OnePageAdaptableWizard_1 = require("../../Wizard/OnePageAdaptableWizard");
 const CheckBox_1 = require("../../../components/CheckBox");
 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 join_1 = tslib_1.__importDefault(require("../../../components/utils/join"));
-const FormLayout_1 = tslib_1.__importStar(require("../../../components/FormLayout"));
 const DEFAULT_BUTTONS = [
     {
         Label: 'OK',
@@ -22,18 +18,15 @@ const DEFAULT_BUTTONS = [
         },
     },
 ];
-const renderAlertDisplaySummary = () => {
+const renderAlertNotificationSummary = () => {
     var _a;
     const { data, api } = (0, OnePageAdaptableWizard_1.useOnePageAdaptableWizardContext)();
     if (!((_a = data.AlertProperties) === null || _a === void 0 ? void 0 : _a.DisplayNotification)) {
-        return (React.createElement(rebass_1.Text, { fontSize: 2 },
-            "Alert type ",
-            React.createElement(CodeBlock_1.CodeBlock, null, data.MessageType),
-            ". No alert popup will be displayed"));
+        return React.createElement(rebass_1.Text, { fontSize: 2 }, "No Alert Notification will be displayed");
     }
     return React.createElement(exports.AlertPreview, { api: api, alertDefinition: data });
 };
-exports.renderAlertDisplaySummary = renderAlertDisplaySummary;
+exports.renderAlertNotificationSummary = renderAlertNotificationSummary;
 const AlertPreview = (_a) => {
     var { alertDefinition, api, focusFirstButton } = _a, boxProps = tslib_1.__rest(_a, ["alertDefinition", "api", "focusFirstButton"]);
     const mapButtons = React.useCallback((button) => {
@@ -59,62 +52,31 @@ const AlertPreview = (_a) => {
         React.createElement(AdaptablePopupAlert_1.AdaptablePopupAlert, { headless: true, focusFirstButton: focusFirstButton, adaptableAlert: alertToPreview, onClose: () => { } })));
 };
 exports.AlertPreview = AlertPreview;
-const AlertDisplayWizardSection = (props) => {
-    var _a, _b, _c, _d, _e;
+const AlertNotificationWizardSection = (props) => {
+    var _a, _b, _c, _d;
     const { data, api } = (0, OnePageAdaptableWizard_1.useOnePageAdaptableWizardContext)();
-    const messageType = data.MessageType;
-    const messageText = api.alertApi.internalApi.getAlertDescription(data);
-    const messageHeader = (_a = data.MessageHeader) !== null && _a !== void 0 ? _a : '';
     const adaptableAlert = {
         alertType: 'generic',
         header: data.MessageType,
         message: '',
         alertDefinition: data,
     };
-    const onMessageTextChange = (e) => {
-        const { value } = e.target;
-        props.onChange(Object.assign(Object.assign({}, data), { MessageText: value }));
-    };
-    const onMessageHeaderChange = (e) => {
-        const { value } = e.target;
-        props.onChange(Object.assign(Object.assign({}, data), { MessageHeader: value }));
-    };
     return (React.createElement(React.Fragment, null,
-        React.createElement(Tabs_1.Tabs, { "data-name": "message-type" },
-            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: "horizontal", onRadioChange: (MessageType) => {
-                        props.onChange(Object.assign(Object.assign({}, data), { MessageType }));
-                    } },
-                    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, { "data-name": "message-text", 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(FormLayout_1.default, null,
-                    React.createElement(FormLayout_1.FormRow, { label: "Header" },
-                        React.createElement(AdaptableInput_1.default, { marginTop: 2, type: 'text', autoFocus: false, value: messageHeader, onChange: (e) => onMessageHeaderChange(e) })),
-                    React.createElement(FormLayout_1.FormRow, { label: "Message" },
-                        React.createElement(AdaptableInput_1.default, { marginTop: 2, type: 'text', autoFocus: false, value: messageText, onChange: (e) => onMessageTextChange(e) }))))),
         React.createElement(Tabs_1.Tabs, { "data-name": "display-options", mt: 2, mb: 3, autoFocus: false },
-            React.createElement(Tabs_1.Tabs.Tab, null, "Display options"),
+            React.createElement(Tabs_1.Tabs.Tab, null, "Notification Options"),
             React.createElement(Tabs_1.Tabs.Content, null,
-                React.createElement(CheckBox_1.CheckBox, { checked: (_b = data.AlertProperties) === null || _b === void 0 ? void 0 : _b.DisplayNotification, onChange: (DisplayNotification) => {
+                React.createElement(CheckBox_1.CheckBox, { checked: (_a = data.AlertProperties) === null || _a === void 0 ? void 0 : _a.DisplayNotification, onChange: (DisplayNotification) => {
                         const newAlertDefinition = Object.assign(Object.assign({}, data), { AlertProperties: Object.assign(Object.assign({}, data.AlertProperties), { DisplayNotification }) });
                         if (!DisplayNotification && typeof newAlertDefinition.AlertForm === 'object') {
                             delete newAlertDefinition.AlertForm.Buttons;
                         }
                         props.onChange(newAlertDefinition);
                     } }, "Show a Notification when Alert is triggered (with action buttons)"),
-                ((_c = data.AlertProperties) === null || _c === void 0 ? void 0 : _c.DisplayNotification) ? (typeof data.AlertForm === 'string' ? (React.createElement(rebass_1.Text, { fontSize: 2 }, "Alert buttons cannot be customized because form is dynamically driven")) : (React.createElement(AlertButtonsEditor_1.AlertButtonsEditor, { AlertButtons: ((_d = data.AlertForm) === null || _d === void 0 ? void 0 : _d.Buttons) || DEFAULT_BUTTONS, api: api, adaptableAlert: adaptableAlert, onChange: (buttons) => {
+                ((_b = data.AlertProperties) === null || _b === void 0 ? void 0 : _b.DisplayNotification) ? (typeof data.AlertForm === 'string' ? (React.createElement(rebass_1.Text, { fontSize: 2 }, "Alert buttons cannot be customized because form is dynamically driven")) : (React.createElement(AlertButtonsEditor_1.AlertButtonsEditor, { alertType: props.alertType, AlertButtons: ((_c = data.AlertForm) === null || _c === void 0 ? void 0 : _c.Buttons) || DEFAULT_BUTTONS, api: api, adaptableAlert: adaptableAlert, onChange: (buttons) => {
                         props.onChange(Object.assign(Object.assign({}, data), { AlertForm: Object.assign(Object.assign({}, data.AlertForm), { Buttons: buttons }) }));
                     } }))) : null)),
-        ((_e = data.AlertProperties) === null || _e === void 0 ? void 0 : _e.DisplayNotification) ? (React.createElement(Tabs_1.Tabs, { "data-name": "alert-preview", autoFocus: false },
-            React.createElement(Tabs_1.Tabs.Tab, null, "Alert preview"),
+        ((_d = data.AlertProperties) === null || _d === void 0 ? void 0 : _d.DisplayNotification) ? (React.createElement(Tabs_1.Tabs, { "data-name": "alert-preview", autoFocus: false },
+            React.createElement(Tabs_1.Tabs.Tab, null, "Alert Preview"),
             React.createElement(Tabs_1.Tabs.Content, null, typeof data.AlertForm === 'string' ? (React.createElement(rebass_1.Text, { fontSize: 2 }, "Preview not available because form is dynamically driven")) : (React.createElement(exports.AlertPreview, { alertDefinition: data, api: api }))))) : null));
 };
-exports.AlertDisplayWizardSection = AlertDisplayWizardSection;
+exports.AlertNotificationWizardSection = AlertNotificationWizardSection;

package/src/View/Alert/Wizard/AlertRulesWizardSection.d.ts

@@ -1,9 +1,12 @@
 /// <reference types="react" />
 import { AlertDefinition } from '../../../PredefinedConfig/AlertState';
-declare type AlertRulesWizardSectionProps = {
+import { AlertType } from '../Utilities/getAlertType';
+export declare const getRuleStepDescription: (alertType: AlertType) => "" | JSX.Element;
+export declare const renderAlertRulesSummary: (alertDefinition: AlertDefinition) => JSX.Element;
+export interface AlertRulesWizardSectionProps {
     onChange: (data: AlertDefinition) => void;
     module: 'alert';
-};
+    wholeRowScope?: boolean;
+    alertType: AlertType | null;
+}
 export declare const AlertRulesWizardSection: (props: AlertRulesWizardSectionProps) => JSX.Element;
-export declare const renderAlertRulesSummary: (alertDefinition: AlertDefinition) => JSX.Element;
-export {};

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

@@ -1,19 +1,36 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.renderAlertRulesSummary = exports.AlertRulesWizardSection = void 0;
+exports.AlertRulesWizardSection = exports.renderAlertRulesSummary = exports.getRuleStepDescription = void 0;
 const tslib_1 = require("tslib");
 const React = tslib_1.__importStar(require("react"));
-const BaseAlertRulesWizardSection_1 = require("./BaseAlertRulesWizardSection");
 const EntityRulesEditor_1 = require("../../Components/EntityRulesEditor");
 const Tag_1 = require("../../../components/Tag");
-const AlertRulesWizardSection = (props) => {
-    return React.createElement(BaseAlertRulesWizardSection_1.BaseAlertRulesWizardSection, Object.assign({}, props));
+const OnePageAdaptableWizard_1 = require("../../Wizard/OnePageAdaptableWizard");
+const getAvailablePredicates_1 = require("../Utilities/getAvailablePredicates");
+const Tabs_1 = require("../../../components/Tabs");
+const Radio_1 = tslib_1.__importDefault(require("../../../components/Radio"));
+const rebass_1 = require("rebass");
+const getRuleStepDescription = (alertType) => {
+    switch (alertType) {
+        case 'DataChange':
+            return (React.createElement(React.Fragment, null,
+                "Build the Rule ",
+                React.createElement("b", null, "when"),
+                " the Alert should trigger, using a Predicate or a Query"));
+        case 'RowChange':
+            return React.createElement(React.Fragment, null, "Specify which type of Row Change will trigger the Alert");
+        case 'Aggregation':
+            return React.createElement(React.Fragment, null, "Build an Aggregation Boolean Rule to specify when the Alert should trigger");
+        case 'Observable':
+            return React.createElement(React.Fragment, null, "Build an Observable Rule to specify when the Alert should trigger");
+    }
+    return '';
 };
-exports.AlertRulesWizardSection = AlertRulesWizardSection;
+exports.getRuleStepDescription = getRuleStepDescription;
 const renderAlertRulesSummary = (alertDefinition) => {
     return (React.createElement(EntityRulesEditor_1.EntityRulesSummary, { data: alertDefinition, renderPredicate: (contents) => {
             return (React.createElement(React.Fragment, null,
-                "Alert condition ",
+                "Alert Rule ",
                 React.createElement(Tag_1.Tag, null, contents)));
         }, renderQueryExpression: (contents) => {
             return (React.createElement(React.Fragment, null,
@@ -22,3 +39,46 @@ const renderAlertRulesSummary = (alertDefinition) => {
         } }));
 };
 exports.renderAlertRulesSummary = renderAlertRulesSummary;
+const RowChangeEditor = (props) => {
+    var _a, _b, _c;
+    const predicate = (_c = (_b = (_a = props.alert.Rule) === null || _a === void 0 ? void 0 : _a.Predicates) === null || _b === void 0 ? void 0 : _b[0]) !== null && _c !== void 0 ? _c : { PredicateId: null };
+    const handleChange = (predicateId) => {
+        props.onChange(Object.assign(Object.assign({}, props.alert), { Rule: {
+                Predicates: [{ PredicateId: predicateId }],
+            } }));
+    };
+    return (React.createElement(rebass_1.Box, { p: 2 },
+        React.createElement(Tabs_1.Tabs, null,
+            React.createElement(Tabs_1.Tabs.Tab, null, "Row Change"),
+            React.createElement(Tabs_1.Tabs.Content, null,
+                React.createElement(Radio_1.default, { onClick: () => handleChange('AddedRow'), checked: predicate.PredicateId === 'AddedRow' }, "Row Added"),
+                React.createElement(Radio_1.default, { onClick: () => handleChange('RemovedRow'), checked: predicate.PredicateId === 'RemovedRow' }, "Row Removed")))));
+};
+const AlertRulesWizardSection = (props) => {
+    const { data, api, moduleInfo } = (0, OnePageAdaptableWizard_1.useOnePageAdaptableWizardContext)();
+    const predicateDefs = (0, getAvailablePredicates_1.getAvailablePredicateDefinitions)(api, data.Scope, props.alertType);
+    const showObservable = props.alertType === 'Observable';
+    const showAggregation = props.alertType === 'Aggregation';
+    const showBoolean = props.alertType === 'DataChange';
+    const showPredicate = props.alertType === 'DataChange' || props.alertType === 'RowChange';
+    const enablePredicateColumnId = props.alertType === 'DataChange';
+    if (props.alertType === 'RowChange') {
+        return React.createElement(RowChangeEditor, { alert: data, onChange: props.onChange });
+    }
+    return (React.createElement(EntityRulesEditor_1.EntityRulesEditor, { module: moduleInfo.ModuleName, defaultPredicateId: "Any", data: data, predicateDefs: predicateDefs, enablePredicateColumnId: enablePredicateColumnId, getPredicateDefsForColId: (colId) => (0, getAvailablePredicates_1.getAvailablePredicateDefinitions)(api, { ColumnIds: [colId] }, props.alertType), onChange: props.onChange, showAggregation: showAggregation, showObservable: showObservable, showBoolean: showBoolean, showPredicate: showPredicate, descriptions: {
+            selectPredicate: 'Create an Alert Rule - to be applied when data changes',
+            useBooleanQuery: (React.createElement(React.Fragment, null,
+                "Use an BooleanQuery if ",
+                React.createElement("i", null, "Scope"),
+                " is 'All Columns' - so any data change may be evaluated in a complex BooleanExpression")),
+            useObservableQuery: (React.createElement(React.Fragment, null,
+                "Use an ObservableQuery if ",
+                React.createElement("i", null, "Scope"),
+                " is 'All Columns' - so any data change may be evaluated in a complex ObservableExpression")),
+            useAggregationQuery: (React.createElement(React.Fragment, null,
+                "Use an AggregatedBooleanQuery if ",
+                React.createElement("i", null, "Scope"),
+                " is 'All Columns' - so any data change may be evaluated in a complex AggregatedBooleanExpression")),
+        } }));
+};
+exports.AlertRulesWizardSection = AlertRulesWizardSection;