@adaptabletools/adaptable 14.0.0-canary.0 → 14.0.0-canary.1

package/src/PredefinedConfig/FormatColumnState.d.ts

@@ -3,6 +3,9 @@ import { AdaptableStyle } from './Common/AdaptableStyle';
 import { AdaptableFormat } from './Common/AdaptableFormat';
 import { AdaptableScope } from './Common/AdaptableScope';
 import { SuspendableObject } from './Common/SuspendableObject';
+import { XOR } from '../Utilities/Extensions/TypeExtensions';
+import { TypeHint } from './Common/Types';
+import { AdaptableBooleanQuery, AdaptablePredicate, GradientStyle, PercentBarStyle } from '../types';
 /**
  * Predefined Configuration for Format Column Module
  */
@@ -20,12 +23,17 @@ export interface FormatColumn extends SuspendableObject {
      * Where Format will be applied - whole Row, some Columns or all Columns of given DataType
      */
     Scope: AdaptableScope;
+    /**
+     * Predicate-based Rule to use for deciding if a format column needs to be applied.
+     * When not defined the format column is always applied.
+     */
+    Rule?: FormatColumnRule;
     /**
      * Style to apply
      */
     Style?: AdaptableStyle;
     /**
-     * Applies Gradient, Percent Bar or CheckBox style to a Column
+     * @deprecated now in StyledColumn Module
      */
     ColumnStyle?: ColumnStyle;
     /**
@@ -36,20 +44,33 @@ export interface FormatColumn extends SuspendableObject {
      * Aligns cells 'Left' or 'Right' or 'Center'
      */
     CellAlignment?: 'Left' | 'Right' | 'Center';
-    /**
-     * Text to display in Column Header (doesn't change ColumnId)
-     *
-     * @deprecated use `Layout.ColumnHeadersMap` instead
-     */
-    HeaderName?: string;
     /**
      * Whether to Format the Column in Grouped Rows
      * @defaultValue false
      */
     IncludeGroupedRows?: boolean;
 }
+/**
+ * The Format Column Rule - can be either a Predicate or a BooleanExpression
+ */
+export declare type FormatColumnRule = XOR<{
+    Predicates: FormatColumnPredicate[];
+}, AdaptableBooleanQuery>;
+export interface FormatColumnPredicate extends AdaptablePredicate {
+    PredicateId: TypeHint<string, SystemFormatColumnPredicateId>;
+}
+/**
+ * Array containing all System Format Column Predicates
+ */
+export declare type SystemFormatColumnPredicateIds = SystemFormatColumnPredicateId[];
+/**
+ * List of System Predicates available for Format Columns
+ */
+export declare type SystemFormatColumnPredicateId = 'Blanks' | 'NonBlanks' | 'Equals' | 'NotEquals' | 'GreaterThan' | 'LessThan' | 'Positive' | 'Negative' | 'Zero' | 'Between' | 'NotBetween' | 'Is' | 'IsNot' | 'Contains' | 'NotContains' | 'StartsWith' | 'EndsWith' | 'Regex' | 'Today' | 'Yesterday' | 'Tomorrow' | 'ThisWeek' | 'ThisMonth' | 'ThisQuarter' | 'ThisYear' | 'InPast' | 'InFuture' | 'Before' | 'After' | 'On' | 'NotOn' | 'NextWorkDay' | 'LastWorkDay' | 'WorkDay' | 'Holiday' | 'True' | 'False';
 /**
  * Special Style used when Formatting Columns: Gradient, PercentBar or CheckBox
+ *
+ * @deprecated use StyledColumn instead
  */
 export interface ColumnStyle {
     /**
@@ -65,88 +86,3 @@ export interface ColumnStyle {
      */
     CheckBoxStyle?: boolean;
 }
-/**
- * Style used to display Percent Bars in Format Column
- */
-export interface PercentBarStyle {
-    /**
-     * Ranges (e.g. to allow a traffic light effect)
-     */
-    CellRanges?: CellColorRange[];
-    /**
-     * Compares cell values to another Column
-     */
-    ColumnComparison?: ColumnComparison;
-    /**
-     * Whether Cell shows Cell Value, Percent Value, both or none
-     */
-    CellText?: CellTextOptions;
-    /**
-     * Whether Tooltip shows Cell Value, Percent Value, both or none
-     */
-    ToolTipText?: CellTextOptions;
-    /**
-     * Back colour - only used for 'Percent Bar' Numeric style; leave unset if none required
-     * @defaultValue Gray
-     */
-    BackColor?: string;
-}
-/**
- * Used to display Gradient Styles in Format Column
- */
-export interface GradientStyle {
-    /**
-     * Ranges (e.g. to allow a traffic light effect)
-     */
-    CellRanges?: CellColorRange[];
-    /**
-     * Compares cell values to another Column
-     */
-    ColumnComparison?: ColumnComparison;
-}
-/**
- * Defines which Colours to show in Gradient and Percent Bar Styles
- */
-export interface CellColorRange {
-    /**
-     * Start number of Range
-     */
-    Min: number | 'Col-Min';
-    /**
-     * End number of Range
-     */
-    Max: number | 'Col-Max';
-    /**
-     * Cell colour to use for values that fall inside Range
-     */
-    Color: string;
-    /**
-     * Reverses the Gradient so the lower the cell value the darker the colour
-     */
-    ReverseGradient?: boolean;
-}
-/**
- * Enables a Percent Bar or Gradient Style to use another column in its calculations
- */
-export interface ColumnComparison {
-    /**
-     * Start value - either numeric or Column name
-     */
-    MinValue: number | string;
-    /**
-     * End value - either numeric or Column name
-     */
-    MaxValue: number | string;
-    /**
-     * Colour to use for the Comparison
-     */
-    Color: string;
-}
-/**
- * Array of CellTextOption available in Format Columns
- */
-export declare type CellTextOptions = CellTextOption[];
-/**
- * Text optionally to show in a Format Column special style: 'CellValue' or 'PercentageValue'
- */
-export declare type CellTextOption = 'CellValue' | 'PercentageValue';

package/src/PredefinedConfig/GridState.d.ts

@@ -1,7 +1,7 @@
 import { AdaptableColumn } from './Common/AdaptableColumn';
 import { SelectedCellInfo } from './Selection/SelectedCellInfo';
-import { InternalState } from './InternalState';
 import { SelectedRowInfo } from './Selection/SelectedRowInfo';
+import { InternalState } from './InternalState';
 import { AdaptableMenuItem } from './Common/Menu';
 import { ColumnSort } from './Common/ColumnSort';
 import { Layout } from './LayoutState';

package/src/PredefinedConfig/LayoutState.d.ts

@@ -51,7 +51,7 @@ export interface Layout extends AdaptableObject {
      */
     ExpandedRowGroupValues?: any[];
     /**
-     * Columns showing aggregated values in grouped rows; first value in record is Column name and second is either the agg func (e.g. sum, avg etc.) or 'true' (to use default aggfunc)
+     * Columns showing aggregated values in grouped rows; 1st value in record is Column name, 2nd is either aggfunc (e.g. sum, avg etc.) or 'true' (to use default aggfunc)
      */
     AggregationColumns?: AggregationColumns;
     /**

package/src/PredefinedConfig/PredefinedConfig.d.ts

@@ -18,6 +18,7 @@ import { ToolPanelState } from './ToolPanelState';
 import { QueryState } from './QueryState';
 import { StatusBarState } from './StatusBarState';
 import { ChartingState } from './ChartingState';
+import { StyledColumnState } from './StyledColumnState';
 /**
  * This is the main Predefined Config interface which developers will populate at design-time
  */
@@ -35,7 +36,7 @@ export interface PredefinedConfig {
      */
     CalculatedColumn?: CalculatedColumnState;
     /**
-     * Supplies a collection of *ConditionalStyle* objects to provides columns and rows with a particular style when the data matches a given rule
+     * @deprecated use `FormatColumn` instead
      */
     ConditionalStyle?: ConditionalStyleState;
     /**
@@ -55,7 +56,7 @@ export interface PredefinedConfig {
      */
     FlashingCell?: FlashingCellState;
     /**
-     * Supplies a collection of *FormatColumn* objects that will style an entire column in a single way (and not subject to a rule like with Conditional Style).
+     * Supplies a collection of *FormatColumn* objects that will style an entire column either fully or using a Condition
      */
     FormatColumn?: FormatColumnState;
     /**
@@ -86,6 +87,10 @@ export interface PredefinedConfig {
      * Supplies a collection of *Shortcut* objects to aid data entry and prevent 'fat finger' issues
      */
     Shortcut?: ShortcutState;
+    /**
+     * Supplies a collection of Special Column Styles
+     */
+    StyledColumn?: StyledColumnState;
     /**
      * Configures the Adaptable Status Bar
      */

package/src/PredefinedConfig/StyledColumnState.d.ts

@@ -0,0 +1,139 @@
+import { ConfigState } from './ConfigState';
+import { SuspendableObject } from './Common/SuspendableObject';
+import { SparklineOptions } from '@ag-grid-community/core';
+/**
+ * Predefined Configuration for Styled Column Module
+ */
+export interface StyledColumnState extends ConfigState {
+    /**
+     * Collection of Special Column Styles
+     */
+    StyledColumns?: StyledColumn[];
+}
+/**
+ * Object used in Special Column Style function
+ */
+export interface StyledColumn extends SuspendableObject {
+    /**
+     * Column being styled
+     */
+    ColumnId: string;
+    /**
+     * Styles a numeric column with a Gradient
+     */
+    GradientStyle?: GradientStyle;
+    /**
+     * Styles a numeric column so each cell displays a 'bar'
+     */
+    PercentBarStyle?: PercentBarStyle;
+    /**
+     * Renders a Checkbox in a boolean column
+     */
+    CheckBoxStyle?: boolean;
+    /**
+     * Displays a Sparkline Chart in the column
+     */
+    SparkLineStyle?: SparkLineStyle;
+    /**
+     * Includes the Styled Column in Grouped Rows
+     * @defaultValue false
+     */
+    IncludeGroupedRows?: boolean;
+}
+/**
+ * Style used to display Percent Bars in Special Column Style
+ */
+export interface PercentBarStyle extends NumericStyledColumn {
+    /**
+     * Whether Cell shows Cell Value, Percent Value, both or none
+     */
+    CellText?: CellTextOptions;
+    /**
+     * Whether Tooltip shows Cell Value, Percent Value, both or none
+     */
+    ToolTipText?: CellTextOptions;
+    /**
+     * Background colour for 'Percent Bar'; leave unset if none required
+     * @defaultValue Gray
+     */
+    BackColor?: string;
+}
+export interface NumericStyledColumn {
+    /**
+     * Ranges (e.g. to allow a traffic light effect)
+     */
+    CellRanges?: CellColorRange[];
+    /**
+     * Compares Cell values to another Column
+     */
+    ColumnComparison?: ColumnComparison;
+    /**
+     * Range can represent 'Number' (any number or Col-Min/Col-Max) or 'Percentage' (values 0-100)
+     * @defaultValue Number
+     */
+    RangeValueType?: RangeValueType;
+}
+/**
+ * Used to display Gradient Styles in Special Column Style
+ */
+export interface GradientStyle extends NumericStyledColumn {
+}
+/**
+ * Defines which Colours to show in Gradient and Percent Bar Styles
+ */
+export interface CellColorRange {
+    /**
+     * Start number of Range
+     */
+    Min: number | 'Col-Min';
+    /**
+     * End number of Range
+     */
+    Max: number | 'Col-Max';
+    /**
+     * Cell colour to use for values that fall inside Range
+     */
+    Color: string;
+    /**
+     * Reverses the Gradient so the lower the cell value the darker the colour
+     */
+    ReverseGradient?: boolean;
+}
+/**
+ * Enables a Percent Bar or Gradient Style to use another column in its calculations
+ */
+export interface ColumnComparison {
+    /**
+     * Start value - either numeric or Column name
+     */
+    MinValue: number | string;
+    /**
+     * End value - either numeric or Column name
+     */
+    MaxValue: number | string;
+    /**
+     * Colour to use for the Comparison
+     */
+    Color: string;
+}
+/**
+ * Array of CellTextOption available in Special Column Styles
+ */
+export declare type CellTextOptions = CellTextOption[];
+/**
+ * Text optionally to show in a Special Column Style special style: 'CellValue' or 'PercentageValue'
+ */
+export declare type CellTextOption = 'CellValue' | 'PercentageValue';
+/**
+ * Whether the Range is Number or Percent based
+ */
+export declare type RangeValueType = 'Number' | 'Percentage';
+/**
+ * Style to show for a Sparkline Column
+ */
+export declare type SparkLineStyle = {
+    /**
+     * AG Grid Sparkline Options
+     */
+    options?: SparklineOptions;
+};

package/src/PredefinedConfig/StyledColumnState.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/src/PredefinedConfig/SystemState.d.ts

@@ -13,6 +13,7 @@ import { CachedQuery } from './QueryState';
 import { AdaptableFlashingCell } from './Common/AdaptableFlashingCell';
 import { TypeUuid } from './Uuid';
 import { SummaryOperation } from './Common/Enums';
+import { ChartModel } from '@ag-grid-community/core';
 export type { IPushPullReport, IPushPullDomain };
 export type { Glue42Report };
 export type { OpenFinReport };
@@ -71,6 +72,26 @@ export interface SystemState extends InternalState, IPushPullState, Glue42State,
     DashboardRevision: number;
     IsQuickFilterVisible: boolean;
     CurrentDataSet: string;
+    /**
+     * Chart modes are saved here for every chart event.
+     * This way any part of the application can listen to chart-model changes without
+     * directly listening to ag-grid events.
+     */
+    Charting: {
+        currentChartModels: ChartModel[];
+    };
+    /**
+     * Keeps session relevant information
+     * currently it holds the previous location of a grouped column.
+     */
+    Layout: {
+        previousGroupedColumns: Record<string, Record<string, number>>;
+    };
+    /**
+     * Equivalent of `GeneralOptions.disableDeleteConfirmation`
+     * It will suppress the deletion confirmation dialog in the current session.
+     */
+    DisableDeleteConfirmation: boolean;
 }
 export interface ProgressIndicator {
     active: boolean;

package/src/Redux/ActionsReducers/ChartingRedux.d.ts

@@ -1,7 +1,6 @@
-import { ChartModel } from '@ag-grid-community/core';
 import * as Redux from 'redux';
 import { AdaptableState } from '../../../types';
-import { ChartingState } from '../../PredefinedConfig/ChartingState';
+import { ChartDefinition, ChartingState } from '../../PredefinedConfig/ChartingState';
 /**
  * @ReduxAction Set AG Grid Charting Models
  */
@@ -10,14 +9,38 @@ export declare const SET_CHARTING_CHARTS = "SET_CHARTING_CHARTS";
  * @ReduxAction Charting Module is ready
  */
 export declare const CHARTING_READY = "CHARTING_READY";
+/**
+ * @ReduxAction Edit chart definition
+ */
+export declare const CHARTING_EDIT_CHART = "CHARTING_EDIT_CHART";
+/**
+ * @ReduxAction Add chart definition
+ */
+export declare const CHARTING_ADD_CHART = "CHARTING_ADD_CHART";
+/**
+ * @ReduxAction Deelte chart definition
+ */
+export declare const CHARTING_DELETE_CHART = "CHARTING_DELETE_CHART";
 export interface ChartingSetChartModelsAction extends Redux.Action {
-    charts: ChartModel[];
+    charts: ChartDefinition[];
 }
 export interface ChartingReadyAction extends Redux.Action {
     chartingState: ChartingState;
 }
-export declare const ChartingSetChartModels: (charts: ChartModel[]) => ChartingSetChartModelsAction;
+export interface ChartingEditChartAction extends Redux.Action {
+    chartDefinition: ChartDefinition;
+}
+export interface ChartingAddChartAction extends Redux.Action {
+    chartDefinition: ChartDefinition;
+}
+export interface ChartingDeleteChartAction extends Redux.Action {
+    chartName: ChartDefinition['Name'];
+}
+export declare const ChartingSetChartModels: (charts: ChartDefinition[]) => ChartingSetChartModelsAction;
 export declare const ChartingReady: (chartingState: ChartingState) => ChartingReadyAction;
+export declare const ChartingEditChart: (chartDefinition: ChartDefinition) => ChartingEditChartAction;
+export declare const ChartingAddChart: (chartDefinition: ChartDefinition) => ChartingAddChartAction;
+export declare const ChartingDeleteChart: (chartName: ChartDefinition['Name']) => ChartingDeleteChartAction;
 export declare const initialState: ChartingState;
-export declare const ChartingGetChartModels: (state: AdaptableState) => ChartingState['ChartDefinitions'];
+export declare const ChartingGetChartModels: (state: AdaptableState) => ChartDefinition[];
 export declare const ChartingReducer: Redux.Reducer<ChartingState>;

package/src/Redux/ActionsReducers/ChartingRedux.js

@@ -1,6 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.ChartingReducer = exports.ChartingGetChartModels = exports.initialState = exports.ChartingReady = exports.ChartingSetChartModels = exports.CHARTING_READY = exports.SET_CHARTING_CHARTS = void 0;
+exports.ChartingReducer = exports.ChartingGetChartModels = exports.initialState = exports.ChartingDeleteChart = exports.ChartingAddChart = exports.ChartingEditChart = exports.ChartingReady = exports.ChartingSetChartModels = exports.CHARTING_DELETE_CHART = exports.CHARTING_ADD_CHART = exports.CHARTING_EDIT_CHART = exports.CHARTING_READY = exports.SET_CHARTING_CHARTS = void 0;
+const Uuid_1 = require("../../PredefinedConfig/Uuid");
 const GeneralConstants_1 = require("../../Utilities/Constants/GeneralConstants");
 /**
  * @ReduxAction Set AG Grid Charting Models
@@ -10,6 +11,18 @@ exports.SET_CHARTING_CHARTS = 'SET_CHARTING_CHARTS';
  * @ReduxAction Charting Module is ready
  */
 exports.CHARTING_READY = 'CHARTING_READY';
+/**
+ * @ReduxAction Edit chart definition
+ */
+exports.CHARTING_EDIT_CHART = 'CHARTING_EDIT_CHART';
+/**
+ * @ReduxAction Add chart definition
+ */
+exports.CHARTING_ADD_CHART = 'CHARTING_ADD_CHART';
+/**
+ * @ReduxAction Deelte chart definition
+ */
+exports.CHARTING_DELETE_CHART = 'CHARTING_DELETE_CHART';
 const ChartingSetChartModels = (charts) => ({
     charts,
     type: exports.SET_CHARTING_CHARTS,
@@ -20,6 +33,21 @@ const ChartingReady = (chartingState) => ({
     chartingState,
 });
 exports.ChartingReady = ChartingReady;
+const ChartingEditChart = (chartDefinition) => ({
+    type: exports.CHARTING_EDIT_CHART,
+    chartDefinition,
+});
+exports.ChartingEditChart = ChartingEditChart;
+const ChartingAddChart = (chartDefinition) => ({
+    type: exports.CHARTING_ADD_CHART,
+    chartDefinition,
+});
+exports.ChartingAddChart = ChartingAddChart;
+const ChartingDeleteChart = (chartName) => ({
+    type: exports.CHARTING_DELETE_CHART,
+    chartName,
+});
+exports.ChartingDeleteChart = ChartingDeleteChart;
 exports.initialState = {
     ChartDefinitions: GeneralConstants_1.EMPTY_ARRAY,
 };
@@ -28,10 +56,22 @@ exports.ChartingGetChartModels = ChartingGetChartModels;
 const ChartingReducer = (state = exports.initialState, action) => {
     switch (action.type) {
         case exports.SET_CHARTING_CHARTS:
-            const newCharts = action.charts.map((chartModel) => ({
-                model: chartModel,
-            }));
-            return Object.assign(Object.assign({}, state), { ChartDefinitions: newCharts });
+            return Object.assign(Object.assign({}, state), { ChartDefinitions: action.charts });
+        case exports.CHARTING_EDIT_CHART:
+            return Object.assign(Object.assign({}, state), { ChartDefinitions: state.ChartDefinitions.map((chartDefinition) => {
+                    if (chartDefinition.Uuid === action.chartDefinition.Uuid) {
+                        return action.chartDefinition;
+                    }
+                    return chartDefinition;
+                }) });
+        case exports.CHARTING_ADD_CHART:
+            let chartDefinition = action.chartDefinition;
+            if (!('Uuid' in chartDefinition)) {
+                chartDefinition = Object.assign(Object.assign({}, chartDefinition), { Uuid: (0, Uuid_1.createUuid)() });
+            }
+            return Object.assign(Object.assign({}, state), { ChartDefinitions: [...state.ChartDefinitions, chartDefinition] });
+        case exports.CHARTING_DELETE_CHART:
+            return Object.assign(Object.assign({}, state), { ChartDefinitions: state.ChartDefinitions.filter((chartDefinition) => chartDefinition.Name !== action.chartName) });
     }
     return state;
 };

package/src/Redux/ActionsReducers/FormatColumnRedux.d.ts

@@ -4,6 +4,14 @@ import * as Redux from 'redux';
  * @ReduxAction A Format Column has been added
  */
 export declare const FORMAT_COLUMN_ADD = "FORMAT_COLUMN_ADD";
+/**
+ * @ReduxAction Format column was moved up
+ */
+export declare const FORMAT_COLUMN_MOVE_UP = "FORMAT_COLUMN_MOVE_UP";
+/**
+ * @ReduxAction Format column was moved down
+ */
+export declare const FORMAT_COLUMN_MOVE_DOWN = "FORMAT_COLUMN_MOVE_DOWN";
 /**
  * @ReduxAction A Format Column has been edited
  */
@@ -31,6 +39,10 @@ export interface FormatColumnAddAction extends FormatColumnAction {
 }
 export interface FormatColumnEditAction extends FormatColumnAction {
 }
+export interface FormatColumnMoveUpAction extends FormatColumnAction {
+}
+export interface FormatColumnMoveDownAction extends FormatColumnAction {
+}
 export interface FormatColumnDeleteAction extends FormatColumnAction {
 }
 export interface FormatColumnSuspendAction extends FormatColumnAction {
@@ -43,6 +55,8 @@ export interface FormatColumnReadyAction extends Redux.Action {
 export declare const FormatColumnAdd: (formatColumn: FormatColumn) => FormatColumnAddAction;
 export declare const FormatColumnEdit: (formatColumn: FormatColumn) => FormatColumnEditAction;
 export declare const FormatColumnDelete: (formatColumn: FormatColumn) => FormatColumnDeleteAction;
+export declare const FormatColumnMoveUp: (formatColumn: FormatColumn) => FormatColumnAddAction;
+export declare const FormatColumnMoveDown: (formatColumn: FormatColumn) => FormatColumnAddAction;
 export declare const FormatColumnSuspend: (formatColumn: FormatColumn) => FormatColumnSuspendAction;
 export declare const FormatColumnUnSuspend: (formatColumn: FormatColumn) => FormatColumnSuspendAction;
 export declare const FormatColumnReady: (formatColumnState: FormatColumnState) => FormatColumnReadyAction;

package/src/Redux/ActionsReducers/FormatColumnRedux.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.FormatColumnReducer = exports.FormatColumnReady = exports.FormatColumnUnSuspend = exports.FormatColumnSuspend = exports.FormatColumnDelete = exports.FormatColumnEdit = exports.FormatColumnAdd = exports.FORMAT_COLUMN_UNSUSPEND = exports.FORMAT_COLUMN_SUSPEND = exports.FORMAT_COLUMN_READY = exports.FORMAT_COLUMN_DELETE = exports.FORMAT_COLUMN_EDIT = exports.FORMAT_COLUMN_ADD = void 0;
+exports.FormatColumnReducer = exports.FormatColumnReady = exports.FormatColumnUnSuspend = exports.FormatColumnSuspend = exports.FormatColumnMoveDown = exports.FormatColumnMoveUp = exports.FormatColumnDelete = exports.FormatColumnEdit = exports.FormatColumnAdd = exports.FORMAT_COLUMN_UNSUSPEND = exports.FORMAT_COLUMN_SUSPEND = exports.FORMAT_COLUMN_READY = exports.FORMAT_COLUMN_DELETE = exports.FORMAT_COLUMN_EDIT = exports.FORMAT_COLUMN_MOVE_DOWN = exports.FORMAT_COLUMN_MOVE_UP = exports.FORMAT_COLUMN_ADD = void 0;
 const tslib_1 = require("tslib");
 const GeneralConstants_1 = require("../../Utilities/Constants/GeneralConstants");
 const AdaptableHelper_1 = tslib_1.__importDefault(require("../../Utilities/Helpers/AdaptableHelper"));
@@ -9,6 +9,14 @@ const utils_1 = require("./utils");
  * @ReduxAction A Format Column has been added
  */
 exports.FORMAT_COLUMN_ADD = 'FORMAT_COLUMN_ADD';
+/**
+ * @ReduxAction Format column was moved up
+ */
+exports.FORMAT_COLUMN_MOVE_UP = 'FORMAT_COLUMN_MOVE_UP';
+/**
+ * @ReduxAction Format column was moved down
+ */
+exports.FORMAT_COLUMN_MOVE_DOWN = 'FORMAT_COLUMN_MOVE_DOWN';
 /**
  * @ReduxAction A Format Column has been edited
  */
@@ -44,6 +52,16 @@ const FormatColumnDelete = (formatColumn) => ({
     formatColumn,
 });
 exports.FormatColumnDelete = FormatColumnDelete;
+const FormatColumnMoveUp = (formatColumn) => ({
+    type: exports.FORMAT_COLUMN_MOVE_UP,
+    formatColumn,
+});
+exports.FormatColumnMoveUp = FormatColumnMoveUp;
+const FormatColumnMoveDown = (formatColumn) => ({
+    type: exports.FORMAT_COLUMN_MOVE_DOWN,
+    formatColumn,
+});
+exports.FormatColumnMoveDown = FormatColumnMoveDown;
 const FormatColumnSuspend = (formatColumn) => ({
     type: exports.FORMAT_COLUMN_SUSPEND,
     formatColumn,
@@ -85,6 +103,30 @@ const FormatColumnReducer = (state = initialState, action) => {
         case exports.FORMAT_COLUMN_UNSUSPEND: {
             return Object.assign(Object.assign({}, state), { FormatColumns: (0, utils_1.changeIsSuspendInList)(action.formatColumn, state.FormatColumns, false) });
         }
+        case exports.FORMAT_COLUMN_MOVE_UP: {
+            const index = state.FormatColumns.findIndex((formatColumn) => formatColumn.Uuid === action.formatColumn.Uuid);
+            let swapIndex = index - 1;
+            if (swapIndex < 0) {
+                swapIndex = state.FormatColumns.length - 1;
+            }
+            const formatColumnToSwap = state.FormatColumns[swapIndex];
+            const newFormatColumns = [...state.FormatColumns];
+            newFormatColumns[swapIndex] = state.FormatColumns[index];
+            newFormatColumns[index] = formatColumnToSwap;
+            return Object.assign(Object.assign({}, state), { FormatColumns: newFormatColumns });
+        }
+        case exports.FORMAT_COLUMN_MOVE_DOWN: {
+            const index = state.FormatColumns.findIndex((formatColumn) => formatColumn.Uuid === action.formatColumn.Uuid);
+            let swapIndex = index + 1;
+            if (swapIndex > state.FormatColumns.length - 1) {
+                swapIndex = 0;
+            }
+            const formatColumnToSwap = state.FormatColumns[swapIndex];
+            const newFormatColumns = [...state.FormatColumns];
+            newFormatColumns[swapIndex] = state.FormatColumns[index];
+            newFormatColumns[index] = formatColumnToSwap;
+            return Object.assign(Object.assign({}, state), { FormatColumns: newFormatColumns });
+        }
         default:
             return state;
     }

package/src/Redux/ActionsReducers/FreeTextColumnRedux.d.ts

@@ -1,5 +1,5 @@
-import { FreeTextColumnState, FreeTextColumn, FreeTextStoredValue } from '../../PredefinedConfig/FreeTextColumnState';
 import * as Redux from 'redux';
+import { FreeTextColumn, FreeTextColumnState, FreeTextStoredValue } from '../../PredefinedConfig/FreeTextColumnState';
 /**
  * @ReduxAction A Free Text Column has been added
  */

package/src/Redux/ActionsReducers/FreeTextColumnRedux.js

@@ -54,13 +54,13 @@ const initialState = {
     FreeTextColumns: GeneralConstants_1.EMPTY_ARRAY,
 };
 const FreeTextColumnReducer = (state = initialState, action) => {
+    // let freeTextColumns: FreeTextColumn[];
     var _a;
-    let freeTextColumns;
     switch (action.type) {
         case exports.FREE_TEXT_COLUMN_ADD: {
             const actionFreeTextColumn = action.freeTextColumn;
             AdaptableHelper_1.default.addUuidAndSource(actionFreeTextColumn);
-            freeTextColumns = [].concat(state.FreeTextColumns);
+            const freeTextColumns = [...state.FreeTextColumns];
             freeTextColumns.push(actionFreeTextColumn);
             return Object.assign(Object.assign({}, state), { FreeTextColumns: freeTextColumns });
         }
@@ -89,7 +89,7 @@ const FreeTextColumnReducer = (state = initialState, action) => {
             else {
                 actionTypedAddEditStoredValue.FreeTextColumn.FreeTextStoredValues.push(actionTypedAddEditStoredValue.FreeTextStoredValue);
             }
-            freeTextColumns = [].concat(state.FreeTextColumns);
+            const freeTextColumns = [...state.FreeTextColumns];
             let index = freeTextColumns.findIndex((x) => x.ColumnId == actionTypedAddEditStoredValue.FreeTextColumn.ColumnId);
             freeTextColumns[index] = actionTypedAddEditStoredValue.FreeTextColumn;
             return Object.assign({}, state, { FreeTextColumns: freeTextColumns });