@adaptabletools/adaptable 22.0.0-canary.1 → 22.0.0-canary.3

package/src/View/Components/Buttons/EntityListActionButtons.js

@@ -10,6 +10,24 @@ const stopPropagation = (e) => {
     e.stopPropagation();
 };
 export class EntityListActionButtons extends React.Component {
+    static defaultProps = {
+        // Adaptable: null,
+        suspendableObject: null,
+        showEdit: true,
+        showDelete: true,
+        showShare: false,
+        showSuspend: false,
+        overrideDisableEdit: false,
+        overrideDisableDelete: false,
+        overrideDisableClone: false,
+        overrideDisableShare: false,
+        confirmDeleteAction: null,
+        entityType: '',
+        accessLevel: 'Full',
+        editSize: 'xsmall',
+        deleteSize: 'xsmall',
+        shareSize: 'xsmall',
+    };
     render() {
         const { justifyContent } = this.props;
         const justifyContentClassName = clsx({
@@ -25,21 +43,3 @@ export class EntityListActionButtons extends React.Component {
             this.props.showSuspend && this.props.suspendableObject && (React.createElement(SuspendToggleButton, { className: `twa:ml-[2px] twa:align-self-center`, onSuspend: this.props.onSuspend, onUnSuspend: this.props.onUnSuspend, suspendableObject: this.props.suspendableObject, disabled: this.props.accessLevel == 'ReadOnly' }))));
     }
 }
-EntityListActionButtons.defaultProps = {
-    // Adaptable: null,
-    suspendableObject: null,
-    showEdit: true,
-    showDelete: true,
-    showShare: false,
-    showSuspend: false,
-    overrideDisableEdit: false,
-    overrideDisableDelete: false,
-    overrideDisableClone: false,
-    overrideDisableShare: false,
-    confirmDeleteAction: null,
-    entityType: '',
-    accessLevel: 'Full',
-    editSize: 'xsmall',
-    deleteSize: 'xsmall',
-    shareSize: 'xsmall',
-};

package/src/View/Components/ColumnFilter/components/FloatingFilterValues.js

@@ -204,7 +204,7 @@ export const FloatingFilterValues = (props) => {
                     ...(props.value?.length
                         ? {
                             valueContainer: {
-                                fontWeight: 'var(--ab-cmp-quickfilter-selected-options-text__font-weight)',
+                                fontWeight: 'var(--ab-cmp-floatingfilter-selected-options-text__font-weight)',
                             },
                         }
                         : {}),

package/src/View/Components/ExpressionWizard.js

@@ -9,11 +9,6 @@ import { Flex } from '../../components/Flex';
 export class ExpressionWizard extends React.Component {
     constructor(props) {
         super(props);
-        this.handleCustomExpressionChange = (expression) => {
-            this.setState({
-                expression,
-            }, () => this.props.updateGoBackState());
-        };
         this.state = {
             // this is realy horrible but its only way to use the Expression Wizard for both Report (that has Query) and Format Column (that has Rule)
             // once we move to the new Wizard we can remove this monstrosity
@@ -43,6 +38,11 @@ export class ExpressionWizard extends React.Component {
                 .getQueryLanguageService()
                 .validateBoolean(this.state.expression, NamedQueryModuleId).isValid);
     }
+    handleCustomExpressionChange = (expression) => {
+        this.setState({
+            expression,
+        }, () => this.props.updateGoBackState());
+    };
     canNext() {
         if (this.isValidExpression() == false) {
             return false;

package/src/View/Components/Panels/PanelDashboard/index.js

@@ -1,16 +1,16 @@
 import * as React from 'react';
 import { DashboardToolbar as DashboardToolbarUI } from '../../../../components/Dashboard';
 export class PanelDashboard extends React.Component {
+    static defaultProps = {
+        showConfigureActionButton: true,
+        showCloseActionButton: true,
+        headerText: 'Module',
+        onClose: null,
+        onConfigure: null,
+        accessLevel: 'Full',
+    };
     render() {
         const { headerText, showConfigureActionButton, showCloseActionButton, onConfigure, onClose, accessLevel, children, } = this.props;
         return (React.createElement(DashboardToolbarUI, { title: headerText, onConfigure: onConfigure, showConfigure: showConfigureActionButton, showClose: showCloseActionButton, onClose: onClose, accessLevel: accessLevel }, children));
     }
 }
-PanelDashboard.defaultProps = {
-    showConfigureActionButton: true,
-    showCloseActionButton: true,
-    headerText: 'Module',
-    onClose: null,
-    onConfigure: null,
-    accessLevel: 'Full',
-};

package/src/View/Components/Panels/PanelToolPanel/index.js

@@ -7,6 +7,13 @@ import { ButtonMaximise } from '../../Buttons/ButtonMaximise';
 import { twMerge } from '../../../../twMerge';
 import { Flex } from '../../../../components/Flex';
 export class PanelToolPanel extends React.Component {
+    static defaultProps = {
+        headerText: '',
+        onClose: null,
+        onConfigure: null,
+        onMinimiseChanged: null,
+        isMinimised: true,
+    };
     render() {
         const { useDefaultPanelStyle, isMinimised, onMinimiseChanged, headerText, onClose, onConfigure, ...props } = this.props;
         let header = (React.createElement(React.Fragment, null,
@@ -38,10 +45,3 @@ export class PanelToolPanel extends React.Component {
             } }));
     }
 }
-PanelToolPanel.defaultProps = {
-    headerText: '',
-    onClose: null,
-    onConfigure: null,
-    onMinimiseChanged: null,
-    isMinimised: true,
-};

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

@@ -1,13 +1,14 @@
 import * as React from 'react';
-import FieldWrap from '../../../components/FieldWrap';
+import { useCallback } from 'react';
+import DropdownButton from '../../../components/DropdownButton';
 import UIHelper from '../../UIHelper';
 import AdaptableInput from '../AdaptableInput';
 import { PermittedValuesSelector } from './PermittedValuesSelector';
-import { Select } from '../../../components/Select';
 import { useAdaptable } from '../../AdaptableContext';
-import { useCallback } from 'react';
 import clsx from 'clsx';
-import { Box } from '../../../components/Flex';
+import { Box, Flex } from '../../../components/Flex';
+import { Icon } from '../../../components/icons';
+import { InputGroup } from '../../../components/InputGroup';
 export const BulkUpdateValueSelector = (props) => {
     const [valueType, setValueType] = React.useState('existing');
     const adaptable = useAdaptable();
@@ -17,8 +18,8 @@ export const BulkUpdateValueSelector = (props) => {
     // TODO = this seems to be called whenever we edit a cell
     // which is then triggering a get all values
     // not sure that we need to
-    const permittedValueSelector = (React.createElement(Box, null,
-        React.createElement(PermittedValuesSelector, { allowNewValues: true, searchable: 'inline', disabled: props.disabled || !props.selectedColumn, value: props.selectedColumnValue === '' ? null : props.selectedColumnValue, columnId: columnId, placeholder: isDateType ? 'Select' : 'Select or type new value', loadValues: useCallback(({ currentSearchValue }) => {
+    const permittedValueSelector = (React.createElement(Box, { className: 'twa:flex-1' },
+        React.createElement(PermittedValuesSelector, { allowNewValues: true, searchable: 'inline', disabled: props.disabled || !props.selectedColumn, value: props.selectedColumnValue === '' ? null : props.selectedColumnValue, columnId: columnId, placeholder: 'Select value', loadValues: useCallback(({ currentSearchValue }) => {
                 if (!columnId || !props.selectedGridCells.length) {
                     return Promise.resolve([]);
                 }
@@ -41,16 +42,16 @@ export const BulkUpdateValueSelector = (props) => {
             : 'Enter Value', autoFocus: true, disabled: props.disabled, className: "twa:w-full", value: props.selectedColumnValue, onChange: (e) => {
             props.onColumnValueChange(e.target.value);
         } }));
-    let valueTypeSelector = null;
-    if (isDateType) {
-        valueTypeSelector = (React.createElement(Select, { "aria-label": "Bulk Update Value Selector", options: [
-                { label: 'New', value: 'new' },
-                { label: 'Existing', value: 'existing' },
-            ], value: valueType, onChange: (value) => {
-                setValueType(value);
-            } }));
-    }
-    return (React.createElement(FieldWrap, { className: clsx('twa:overflow-visible twa:max-w-full', props.className), style: props.style }, isDateType ? (React.createElement(React.Fragment, null,
-        valueType === 'new' ? input : permittedValueSelector,
-        valueTypeSelector)) : (permittedValueSelector)));
+    return (React.createElement(Flex, { className: clsx('twa:overflow-visible twa:max-w-full', props.className), style: props.style }, isDateType ? (React.createElement(React.Fragment, null,
+        React.createElement(InputGroup, { Component: Flex, "data-id": "bulk-update-input-wrapper", className: "twa:w-full" },
+            React.createElement(DropdownButton, { "aria-label": "Bulk Update Value Selector", "data-id": "bulk-update-value-type-selector", "data-value": valueType, columns: ['label'], variant: "outlined", tone: "neutral", items: [
+                    { label: 'New', icon: React.createElement(Icon, { name: "edit" }), onClick: () => setValueType('new') },
+                    {
+                        label: 'Existing',
+                        icon: React.createElement(Icon, { name: "grid" }),
+                        onClick: () => setValueType('existing'),
+                    },
+                ] },
+                React.createElement(React.Fragment, null, valueType === 'existing' ? React.createElement(Icon, { name: "grid" }) : React.createElement(Icon, { name: "edit" }))),
+            valueType === 'new' ? input : permittedValueSelector))) : (permittedValueSelector)));
 };

package/src/View/Components/StyleComponent.js

@@ -129,6 +129,14 @@ export const StyleComponent = (props) => {
         }
         setComponentStyle(newStyle);
     };
+    const onAlignmentChange = (alignment) => {
+        const newStyle = { ...componentStyle };
+        newStyle.Alignment = alignment;
+        if (alignment == 'Default') {
+            delete newStyle.Alignment;
+        }
+        setComponentStyle(newStyle);
+    };
     const Cmp = props.headless ? Box : Panel;
     const headerText = props.headerText ?? 'Style';
     const cmpProps = props.headless
@@ -216,7 +224,18 @@ export const StyleComponent = (props) => {
                             ], value: componentStyle.FontSize?.toString() ?? '', onChange: (value) => onFontSizeChange(value) }))) : (React.createElement(Flex, { flexDirection: "row", alignItems: "center", className: "twa:gap-2 twa:flex-wrap" }, fontSizes.map((enumName) => {
                         return (React.createElement(Radio, { onClick: () => onFontSizeChange(enumName), checked: (enumName == 'Default' && !componentStyle.FontSize) ||
                                 componentStyle.FontSize === enumName, key: enumName }, enumName));
-                    }))))))),
+                    }))),
+                    React.createElement("span", null, "Alignment"),
+                    React.createElement(ToggleGroup, null,
+                        React.createElement(Toggle, { icon: "align-left", pressed: componentStyle.Alignment === 'Left', onPressedChange: (pressed) => pressed
+                                ? onAlignmentChange('Left')
+                                : onAlignmentChange('Default') }),
+                        React.createElement(Toggle, { icon: "align-center", pressed: componentStyle.Alignment === 'Center', onPressedChange: (pressed) => pressed
+                                ? onAlignmentChange('Center')
+                                : onAlignmentChange('Default') }),
+                        React.createElement(Toggle, { icon: "align-right", pressed: componentStyle.Alignment === 'Right', onPressedChange: (pressed) => pressed
+                                ? onAlignmentChange('Right')
+                                : onAlignmentChange('Default') })))))),
         !props.hidePreview && (React.createElement(Card, { shadow: false },
             React.createElement(Card.Title, null, "Preview"),
             React.createElement(Card.Body, { className: "twa:grid twa:place-items-center" },

package/src/View/Components/ToolPanel/AdaptableToolPanel.js

@@ -222,6 +222,8 @@ export const getAdaptableToolPanelAgGridComponent = (adaptable) => {
         };
     }
     return class AdaptableToolPanelAgGridComponent {
+        gui;
+        unmountReactRoot;
         init(params) {
             const api = adaptable.api;
             this.gui = document.createElement('div');

package/src/View/CustomSort/CustomSortSummary.js

@@ -16,19 +16,6 @@ import { CustomSortWizard } from './Wizard/CustomSortWizard';
 export class CustomSortSummaryComponent extends React.Component {
     constructor(props) {
         super(props);
-        this.onFinishWizard = (customSort) => {
-            if (this.props.CustomSorts.find((x) => x.ColumnId == customSort.ColumnId)) {
-                this.props.onEditCustomSort(customSort);
-            }
-            else {
-                this.props.onAddCustomSort(customSort);
-            }
-            this.setState({
-                editedAdaptableObject: null,
-                wizardStartIndex: 0,
-                wizardStatus: WizardStatus.None,
-            });
-        };
         this.state = UIHelper.getEmptyConfigState();
     }
     render() {
@@ -76,6 +63,19 @@ export class CustomSortSummaryComponent extends React.Component {
             wizardStatus: WizardStatus.None,
         });
     }
+    onFinishWizard = (customSort) => {
+        if (this.props.CustomSorts.find((x) => x.ColumnId == customSort.ColumnId)) {
+            this.props.onEditCustomSort(customSort);
+        }
+        else {
+            this.props.onAddCustomSort(customSort);
+        }
+        this.setState({
+            editedAdaptableObject: null,
+            wizardStartIndex: 0,
+            wizardStatus: WizardStatus.None,
+        });
+    };
     canFinishWizard() {
         let customSort = this.state.editedAdaptableObject;
         return (StringExtensions.IsNotNullOrEmpty(customSort.ColumnId) &&

package/src/View/Dashboard/DashboardPopup.js

@@ -69,18 +69,17 @@ class DashboardPopupComponent extends React.Component {
             React.createElement(Flex, { flexDirection: "column", className: "twa:h-full twa:gap-4" },
                 areDashboardSettingsVisible && (React.createElement(React.Fragment, null,
                     React.createElement(Card, null,
-                        React.createElement(Card.Title, { gap: 8 },
-                            "Display Settings",
-                            React.createElement(ToggleButton, { className: "twa:self-end", onChange: (visible) => this.props.onSetDashboardHidden(!visible), checked: !this.props.IsHidden, "data-name": "dashboard-visibility" }, this.props.IsHidden ? 'Hidden' : 'Visible')),
+                        React.createElement(Card.Title, { gap: 8 }, "Display Settings"),
                         React.createElement(Card.Body, { gap: 2, className: "twa:p-2" },
-                            React.createElement(ToggleButton, { disabled: this.props.IsFloating, className: "twa:w-24", onChange: (expanded) => this.props.onSetDashboardCollapsed(!expanded), checked: !this.props.IsCollapsed, "data-name": "expand-state" }, this.props.IsCollapsed ? 'Collapsed' : 'Expanded'),
+                            React.createElement(ToggleButton, { className: "twa:w-24", onChange: (visible) => this.props.onSetDashboardHidden(!visible), checked: !this.props.IsHidden, "data-name": "dashboard-visibility" }, this.props.IsHidden ? 'Hidden' : 'Visible'),
+                            this.props.DashboardState.Tabs?.length > 0 ? (React.createElement(ToggleButton, { disabled: this.props.IsFloating, className: "twa:w-24", onChange: (expanded) => this.props.onSetDashboardCollapsed(!expanded), checked: !this.props.IsCollapsed, "data-name": "expand-state" }, this.props.IsCollapsed ? 'Collapsed' : 'Expanded')) : null,
                             this.props.api.optionsApi.getDashboardOptions().canFloat ? (React.createElement(ToggleButton, { className: "twa:w-24", onChange: (pinned) => this.props.onSetDashboardFloating(!pinned), checked: !this.props.IsFloating, "data-name": "floating" }, this.props.IsFloating ? 'Floating' : 'Pinned')) : null)))),
                 React.createElement(Card, { className: "twa:flex-1 twa:overflow-hidden", gap: 0 },
                     React.createElement(Card.Title, null, "Contents"),
                     React.createElement(Card.Body, { className: "twa:p-2" },
                         React.createElement(Tabs, { className: "twa:flex-1 twa:min-h-0" },
                             React.createElement(Tabs.Tab, { value: "pinned-toolbars" }, "Pinned Toolbars"),
-                            React.createElement(Tabs.Tab, { value: "tabbed-toolbars" }, "Tabbed Toolbars"),
+                            React.createElement(Tabs.Tab, { value: "tabbed-toolbars" }, "Tabs & Toolbars"),
                             React.createElement(Tabs.Tab, { value: "buttons" }, "Buttons"),
                             React.createElement(Tabs.Content, { value: "pinned-toolbars", className: contentCls },
                                 React.createElement(PinnedToolbarsSelector, null)),

package/src/View/Export/ExportDestinationPicker.js

@@ -12,7 +12,7 @@ export const ExportDestinationPicker = ({ reportName, reportFormat, viewType, })
     };
     const supportedDestinations = exportApi.getSupportedExportDestinations(reportFormat);
     if (supportedDestinations.length === 0 || supportedDestinations.length === 1) {
-        return (React.createElement(ButtonExport, { className: clsx(viewType !== 'StatusBar' ? 'twa:mr-[20px]' : undefined, 'twa:pr-0'), onClick: () => handleExport(supportedDestinations[0]), tooltip: "Export Report", disabled: reportName == undefined || reportFormat == undefined }));
+        return (React.createElement(ButtonExport, { className: clsx(viewType !== 'StatusBar' ? '' : undefined, ''), onClick: () => handleExport(supportedDestinations[0]), tooltip: "Export Report", disabled: reportName == undefined || reportFormat == undefined }));
     }
     const destinationItems = supportedDestinations.map((destination) => ({
         label: destination,

package/src/View/Export/ExportStatusBar.js

@@ -4,13 +4,15 @@ import { ReportNameSelector } from './ReportNameSelector';
 import { ReportFormatSelector } from './ReportFormatSelector';
 import { ExportDestinationPicker } from './ExportDestinationPicker';
 import { useAdaptable } from '../AdaptableContext';
+import { Flex } from '../../components/Flex';
 export const ExportStatusBar = () => {
     const adaptable = useAdaptable();
     const exportApi = adaptable.api.exportApi;
     const currentReportName = useSelector((state) => state.Export.CurrentReport);
     const currentFormat = useSelector((state) => state.Export.CurrentFormat);
     return (React.createElement(React.Fragment, null,
-        React.createElement(ReportNameSelector, { viewType: "StatusBar", size: 'small', reportName: currentReportName, onReportNameSelected: (reportName) => exportApi.selectReport(reportName) }),
-        React.createElement(ReportFormatSelector, { viewType: "StatusBar", size: 'small', reportName: currentReportName, reportFormat: currentFormat, onReportFormatSelected: (reportFormat) => exportApi.selectFormat(reportFormat) }),
+        React.createElement(Flex, { className: "twa:gap-1" },
+            React.createElement(ReportNameSelector, { viewType: "StatusBar", reportName: currentReportName, onReportNameSelected: (reportName) => exportApi.selectReport(reportName) }),
+            React.createElement(ReportFormatSelector, { viewType: "StatusBar", reportName: currentReportName, reportFormat: currentFormat, onReportFormatSelected: (reportFormat) => exportApi.selectFormat(reportFormat) })),
         React.createElement(ExportDestinationPicker, { viewType: "StatusBar", reportName: currentReportName, reportFormat: currentFormat })));
 };

package/src/View/Export/ExportViewPanel.js

@@ -15,6 +15,7 @@ import { ReportNameSelector } from './ReportNameSelector';
 import { ReportFormatSelector } from './ReportFormatSelector';
 import { ExportDestinationPicker } from './ExportDestinationPicker';
 import { Flex } from '../../components/Flex';
+import clsx from 'clsx';
 export const ExportViewPanel = (props) => {
     const dispatch = useDispatch();
     const exportApi = props.api.exportApi;
@@ -26,27 +27,33 @@ export const ExportViewPanel = (props) => {
     const deleteMessage = currentReport
         ? `Are you sure you want to delete '${currentReport.Name}'?`
         : 'Are you sure you want to delete this report?';
-    const elementType = props.viewType === 'Toolbar' ? 'DashboardToolbar' : 'ToolPanel';
-    return (React.createElement(Flex, { flexDirection: "row", className: `ab-${elementType}__Export__panel twa:gap-2`, flexWrap: props.viewType === 'ToolPanel' ? 'wrap' : 'nowrap' },
+    const isToolbar = props.viewType === 'Toolbar';
+    const elementType = isToolbar ? 'DashboardToolbar' : 'ToolPanel';
+    return (React.createElement(Flex, { flexDirection: "row", className: clsx(`ab-${elementType}__CellSummary__wrap twa:gap-2 twa:flex-row`, {
+            'twa:min-w-[486px] twa:flex-nowrap': isToolbar,
+            'twa:flex-1 twa:flex-wrap': !isToolbar,
+        }) },
         React.createElement(ReportNameSelector, { viewType: props.viewType, reportName: currentReportName, userReports: userReports, onReportNameSelected: (reportName) => exportApi.selectReport(reportName) }),
         React.createElement(ReportFormatSelector, { viewType: props.viewType, reportName: currentReportName, reportFormat: currentFormat, onReportFormatSelected: (reportFormat) => exportApi.selectFormat(reportFormat) }),
         React.createElement(Flex, { className: join(accessLevel == 'ReadOnly' ? GeneralConstants.READ_ONLY_STYLE : '', `ab-${elementType}__Export__controls twa:w-full`) },
-            React.createElement(ExportDestinationPicker, { viewType: props.viewType, reportName: currentReportName, reportFormat: currentFormat }),
-            React.createElement(ButtonEdit, { onClick: () => dispatch(PopupRedux.PopupShowScreen(ModuleConstants.ExportModuleId, props.moduleInfo.Popup, {
-                    action: 'Edit',
-                    source: 'Toolbar',
-                })), tooltip: "Edit Report", className: `ab-${elementType}__Export__edit`, disabled: currentReport == null, accessLevel: accessLevel }),
-            React.createElement(ButtonNew, { variant: "text", className: `ab-${elementType}__Export__new`, tone: "neutral", children: null, onClick: () => dispatch(PopupRedux.PopupShowScreen(ModuleConstants.ExportModuleId, props.moduleInfo.Popup, {
-                    action: 'New',
-                    source: 'Toolbar',
-                })), tooltip: "Create New Report", accessLevel: props.accessLevel }),
-            React.createElement(ButtonDelete, { tooltip: "Delete Report", className: `ab-${elementType}__Export__delete`, disabled: currentReport == null, ConfirmAction: ExportRedux.ReportDelete(currentReport), ConfirmationMsg: deleteMessage, ConfirmationTitle: 'Delete Report', accessLevel: accessLevel }),
-            props.api.entitlementApi.isModuleFullEntitlement('Schedule') && (React.createElement(ButtonSchedule, { className: `ab-${elementType}__Export__schedule twa:ml-1`, onClick: () => {
-                    const reportSchedule = ObjectFactory.CreateReportSchedule(currentReportName, currentFormat);
-                    dispatch(PopupRedux.PopupShowScreen(ModuleConstants.ScheduleModuleId, 'SchedulePopup', {
+            React.createElement(Flex, { className: "twa:min-w-[44px]" },
+                React.createElement(ExportDestinationPicker, { viewType: props.viewType, reportName: currentReportName, reportFormat: currentFormat })),
+            React.createElement(Flex, null,
+                React.createElement(ButtonEdit, { onClick: () => dispatch(PopupRedux.PopupShowScreen(ModuleConstants.ExportModuleId, props.moduleInfo.Popup, {
+                        action: 'Edit',
+                        source: 'Toolbar',
+                    })), tooltip: "Edit Report", className: `ab-${elementType}__Export__edit`, disabled: currentReport == null, accessLevel: accessLevel }),
+                React.createElement(ButtonNew, { variant: "text", className: `ab-${elementType}__Export__new`, tone: "neutral", children: null, onClick: () => dispatch(PopupRedux.PopupShowScreen(ModuleConstants.ExportModuleId, props.moduleInfo.Popup, {
                         action: 'New',
                         source: 'Toolbar',
-                        value: reportSchedule,
-                    }));
-                }, tooltip: "Schedule", disabled: currentReport == null, accessLevel: props.accessLevel })))));
+                    })), tooltip: "Create New Report", accessLevel: props.accessLevel }),
+                React.createElement(ButtonDelete, { tooltip: "Delete Report", className: `ab-${elementType}__Export__delete`, disabled: currentReport == null, ConfirmAction: ExportRedux.ReportDelete(currentReport), ConfirmationMsg: deleteMessage, ConfirmationTitle: 'Delete Report', accessLevel: accessLevel }),
+                props.api.entitlementApi.isModuleFullEntitlement('Schedule') && (React.createElement(ButtonSchedule, { className: `ab-${elementType}__Export__schedule`, onClick: () => {
+                        const reportSchedule = ObjectFactory.CreateReportSchedule(currentReportName, currentFormat);
+                        dispatch(PopupRedux.PopupShowScreen(ModuleConstants.ScheduleModuleId, 'SchedulePopup', {
+                            action: 'New',
+                            source: 'Toolbar',
+                            value: reportSchedule,
+                        }));
+                    }, tooltip: "Schedule", disabled: currentReport == null, accessLevel: props.accessLevel }))))));
 };

package/src/View/FormatColumn/FormatColumnSummary.js

@@ -15,19 +15,6 @@ import { FormatColumnWizard } from './Wizard/FormatColumnWizard';
 export class FormatColumnSummaryComponent extends React.Component {
     constructor(props) {
         super(props);
-        this.onFinishWizard = (formatColumn) => {
-            if (this.props.FormatColumns.find((x) => x.Uuid == formatColumn.Uuid)) {
-                this.props.onEditFormatColumn(formatColumn);
-            }
-            else {
-                this.props.onAddFormatColumn(formatColumn);
-            }
-            this.setState({
-                editedAdaptableObject: null,
-                wizardStartIndex: 0,
-                wizardStatus: WizardStatus.None,
-            });
-        };
         this.state = UIHelper.getEmptyConfigState();
     }
     render() {
@@ -70,6 +57,19 @@ export class FormatColumnSummaryComponent extends React.Component {
             wizardStatus: WizardStatus.None,
         });
     }
+    onFinishWizard = (formatColumn) => {
+        if (this.props.FormatColumns.find((x) => x.Uuid == formatColumn.Uuid)) {
+            this.props.onEditFormatColumn(formatColumn);
+        }
+        else {
+            this.props.onAddFormatColumn(formatColumn);
+        }
+        this.setState({
+            editedAdaptableObject: null,
+            wizardStartIndex: 0,
+            wizardStatus: WizardStatus.None,
+        });
+    };
     canFinishWizard() {
         let formatColumn = this.state.editedAdaptableObject;
         return formatColumn.Scope != undefined && UIHelper.IsNotEmptyStyle(formatColumn.Style);

package/src/View/FormatColumn/Wizard/FormatColumnSettingsWizardSection.js

@@ -3,16 +3,11 @@ import FormLayout, { FormRow } from '../../../components/FormLayout';
 import { CheckBox } from '../../../components/CheckBox';
 import { useOnePageAdaptableWizardContext } from '../../Wizard/OnePageAdaptableWizard';
 import { Tag } from '../../../components/Tag';
-import { ToggleGroup } from '../../../components/Toggle/ToggleGroup';
-import { Toggle } from '../../../components/Toggle/Toggle';
 import Radio, { RadioGroup } from '../../../components/Radio';
 import { Box, Flex } from '../../../components/Flex';
 import { Card } from '../../../components/Card';
 export const renderFormatColumnSettingsSummary = (data) => {
     return (React.createElement(Box, { className: "twa:p-2" },
-        React.createElement(Box, null,
-            "Cell alignment ",
-            React.createElement(Tag, null, data.CellAlignment ?? 'default')),
         React.createElement(Box, { className: "twa:mt-3" },
             "Data Rows ",
             React.createElement(Tag, null, data.RowScope?.ExcludeDataRows ? 'no' : 'yes')),
@@ -35,13 +30,6 @@ export const renderFormatColumnSettingsSummary = (data) => {
 };
 export const FormatColumnSettingsWizardSection = (props) => {
     const { data } = useOnePageAdaptableWizardContext();
-    const onCellAlignmentSelectChanged = (CellAlignment) => {
-        const newData = { ...data, CellAlignment };
-        if (CellAlignment === null) {
-            delete newData.CellAlignment;
-        }
-        props.onChange(newData);
-    };
     const onExcludeDataRowsChanged = (ExcludeDataRows) => {
         props.onChange({
             ...data,
@@ -83,17 +71,6 @@ export const FormatColumnSettingsWizardSection = (props) => {
         React.createElement(Card.Body, null,
             React.createElement(Flex, { flexDirection: "row" },
                 React.createElement(FormLayout, null,
-                    React.createElement(FormRow, { label: "Cell Alignment" },
-                        React.createElement(ToggleGroup, null,
-                            React.createElement(Toggle, { icon: "align-left", pressed: data.CellAlignment === 'Left', onPressedChange: (pressed) => pressed
-                                    ? onCellAlignmentSelectChanged('Left')
-                                    : onCellAlignmentSelectChanged(null) }),
-                            React.createElement(Toggle, { icon: "align-center", pressed: data.CellAlignment === 'Center', onPressedChange: (pressed) => pressed
-                                    ? onCellAlignmentSelectChanged('Center')
-                                    : onCellAlignmentSelectChanged(null) }),
-                            React.createElement(Toggle, { icon: "align-right", pressed: data.CellAlignment === 'Right', onPressedChange: (pressed) => pressed
-                                    ? onCellAlignmentSelectChanged('Right')
-                                    : onCellAlignmentSelectChanged(null) }))),
                     data.Target === 'cell' && (React.createElement(React.Fragment, null,
                         React.createElement(FormRow, { label: "Exclude Data Rows:" },
                             React.createElement(Flex, { alignItems: "center", className: "twa:ml-2" },

package/src/View/FormatColumn/Wizard/FormatColumnStyleWizardSection.js

@@ -8,7 +8,6 @@ export const isFormatColumnStyleValid = (data, api) => {
     if (data.Style &&
         UIHelper.IsEmptyStyle(data.Style) &&
         data.DisplayFormat === undefined &&
-        data.CellAlignment === undefined &&
         !api.columnScopeApi.isSingleBooleanColumnScope(data.Scope)) {
         return 'No format applied';
     }
@@ -19,7 +18,8 @@ const toStyle = (data) => {
         ...convertAdaptableStyleToCSS(data.Style ?? {}),
         borderWidth: data.Style?.BorderColor ? 2 : 0,
         borderStyle: 'solid',
-        textAlign: data.CellAlignment ? data.CellAlignment.toLowerCase() : undefined,
+        // ToDO abcdefg
+        textAlign: data.Style?.Alignment ? data.Style.Alignment.toLowerCase() : undefined,
     };
 };
 export const renderFormatColumnStyleWizardSummary = (data) => {

package/src/View/FreeTextColumn/FreeTextColumnSummary.js

@@ -15,19 +15,6 @@ import { FreeTextColumnWizard } from './Wizard/FreeTextColumnWizard';
 export class FreeTextColumnSummaryComponent extends React.Component {
     constructor(props) {
         super(props);
-        this.onFinishWizard = (FreeTextColumn) => {
-            if (this.props.FreeTextColumns.find((x) => x.ColumnId == FreeTextColumn.ColumnId)) {
-                this.props.onEditFreeTextColumn(FreeTextColumn);
-            }
-            else {
-                this.props.onAddFreeTextColumn(FreeTextColumn);
-            }
-            this.setState({
-                editedAdaptableObject: null,
-                wizardStartIndex: 0,
-                wizardStatus: WizardStatus.None,
-            });
-        };
         this.state = UIHelper.getEmptyConfigState();
     }
     render() {
@@ -68,6 +55,19 @@ export class FreeTextColumnSummaryComponent extends React.Component {
             wizardStatus: WizardStatus.None,
         });
     }
+    onFinishWizard = (FreeTextColumn) => {
+        if (this.props.FreeTextColumns.find((x) => x.ColumnId == FreeTextColumn.ColumnId)) {
+            this.props.onEditFreeTextColumn(FreeTextColumn);
+        }
+        else {
+            this.props.onAddFreeTextColumn(FreeTextColumn);
+        }
+        this.setState({
+            editedAdaptableObject: null,
+            wizardStartIndex: 0,
+            wizardStatus: WizardStatus.None,
+        });
+    };
     canFinishWizard() {
         let FreeTextColumn = this.state.editedAdaptableObject;
         return StringExtensions.IsNotNullOrEmpty(FreeTextColumn.ColumnId);