@adaptabletools/adaptable 10.0.3 → 10.0.4-canary.0

package/src/View/Layout/Wizard/LayoutEditor/index.js

@@ -88,7 +88,7 @@ exports.LayoutEditor = React.memo((props) => {
     const { layout } = state;
     const allColumnsMap = React.useMemo(() => {
         return allColumns.reduce((acc, col) => {
-            acc[col.ColumnId] = col;
+            acc[col.columnId] = col;
             return acc;
         }, {});
     }, [allColumns]);
@@ -99,7 +99,7 @@ exports.LayoutEditor = React.memo((props) => {
         return col;
     })
         .concat(allColumns.filter((col) => {
-        return !tmpMap[col.ColumnId];
+        return !tmpMap[col.columnId];
     }))
         .filter((c) => c));
     const setLayout = (layout) => {
@@ -118,7 +118,7 @@ exports.LayoutEditor = React.memo((props) => {
     }, [props.layout]);
     const visibleColumnsMap = React.useMemo(() => {
         return allColumns.reduce((acc, col) => {
-            acc[col.ColumnId] = layout.Columns.indexOf(col.ColumnId) != -1 ? col : null;
+            acc[col.columnId] = layout.Columns.indexOf(col.columnId) != -1 ? col : null;
             return acc;
         }, {});
     }, [layout, allColumns]);
@@ -126,7 +126,7 @@ exports.LayoutEditor = React.memo((props) => {
         return Object.keys(layout.AggregationColumns || {}).reduce((acc, colId) => {
             let fn = layout.AggregationColumns[colId];
             if (typeof fn === 'boolean') {
-                fn = allColumnsMap[colId].AggregationFunction;
+                fn = allColumnsMap[colId].aggregationFunction;
             }
             acc[colId] = fn;
             return acc;
@@ -145,8 +145,8 @@ exports.LayoutEditor = React.memo((props) => {
     const setColumnVisibility = (c, visible) => {
         const newLayout = visible
             ? Object.assign(Object.assign({}, layout), { Columns: columnList
-                    .filter((col) => visibleColumnsMap[col.ColumnId] || col.ColumnId === c.ColumnId)
-                    .map((c) => c.ColumnId) }) : Object.assign(Object.assign({}, layout), { Columns: layout.Columns.filter((colId) => colId !== c.ColumnId) });
+                    .filter((col) => visibleColumnsMap[col.columnId] || col.columnId === c.columnId)
+                    .map((c) => c.columnId) }) : Object.assign(Object.assign({}, layout), { Columns: layout.Columns.filter((colId) => colId !== c.columnId) });
         const previousGroupCols = getAgGridGroupAutoColumn(layout);
         const currentGroupCols = getAgGridGroupAutoColumn(newLayout);
         if (previousGroupCols.length !== currentGroupCols.length) {
@@ -172,7 +172,7 @@ exports.LayoutEditor = React.memo((props) => {
         }
         if (source.droppableId === droppableIds_1.LayoutEditorDroppableIds.ColumnList) {
             source.column = columnList[source.index];
-            source.columnId = source.column.ColumnId;
+            source.columnId = source.column.columnId;
         }
         if (destination.droppableId === droppableIds_1.LayoutEditorDroppableIds.ColumnList) {
             onDragEndRef.current.columnList(result);
@@ -192,7 +192,7 @@ exports.LayoutEditor = React.memo((props) => {
         const dragSource = source.droppableId;
         const column = dragSource === droppableIds_1.LayoutEditorDroppableIds.ColumnList ? allColumnsMap[draggableId] : null;
         const invalidSourceForColumns = source.droppableId !== droppableIds_1.LayoutEditorDroppableIds.ColumnList;
-        const dropDisabledOnColumns = !column || !column.Moveable || invalidSourceForColumns;
+        const dropDisabledOnColumns = !column || !column.moveable || invalidSourceForColumns;
         dispatch({
             type: reducer_1.LayoutEditorActions.SET_DROP_DISABLED_ON_COLUMNS,
             payload: dropDisabledOnColumns,
@@ -203,37 +203,37 @@ exports.LayoutEditor = React.memo((props) => {
         });
         const columnAlreadySorted = column &&
             layout.ColumnSorts &&
-            !!layout.ColumnSorts.filter((c) => c.ColumnId === column.ColumnId)[0];
+            !!layout.ColumnSorts.filter((c) => c.ColumnId === column.columnId)[0];
         const invalidSourceForSort = dragSource !== droppableIds_1.LayoutEditorDroppableIds.ColumnList &&
             dragSource !== droppableIds_1.LayoutEditorDroppableIds.ColumnSortList;
-        const disableDropOnSort = invalidSourceForSort || columnAlreadySorted || (column && !column.Sortable);
+        const disableDropOnSort = invalidSourceForSort || columnAlreadySorted || (column && !column.sortable);
         dispatch({
             type: reducer_1.LayoutEditorActions.SET_DROP_DISABLED_ON_SORT,
             payload: !!disableDropOnSort,
         });
         const columnAlreadyRowGrouped = column && layout.RowGroupedColumns
-            ? !!layout.RowGroupedColumns.filter((colId) => colId === column.ColumnId)[0]
+            ? !!layout.RowGroupedColumns.filter((colId) => colId === column.columnId)[0]
             : false;
         const invalidSourceForRowGroups = dragSource !== droppableIds_1.LayoutEditorDroppableIds.ColumnList &&
             dragSource !== droppableIds_1.LayoutEditorDroppableIds.RowGroupsList;
-        const disableDropOnRowGroups = invalidSourceForRowGroups || columnAlreadyRowGrouped || (column && !column.Groupable);
+        const disableDropOnRowGroups = invalidSourceForRowGroups || columnAlreadyRowGrouped || (column && !column.groupable);
         dispatch({
             type: reducer_1.LayoutEditorActions.SET_DROP_DISABLED_ON_ROW_GROUPS,
             payload: !!disableDropOnRowGroups,
         });
         const columnAlreadyPivoted = column && layout.PivotColumns
-            ? !!layout.PivotColumns.filter((colId) => colId === column.ColumnId)[0]
+            ? !!layout.PivotColumns.filter((colId) => colId === column.columnId)[0]
             : false;
         const invalidSourceForPivot = dragSource !== droppableIds_1.LayoutEditorDroppableIds.ColumnList &&
             dragSource !== droppableIds_1.LayoutEditorDroppableIds.PivotList;
-        const disableDropOnPivot = invalidSourceForPivot || columnAlreadyPivoted || (column && !column.Pivotable);
+        const disableDropOnPivot = invalidSourceForPivot || columnAlreadyPivoted || (column && !column.pivotable);
         dispatch({
             type: reducer_1.LayoutEditorActions.SET_DROP_DISABLED_ON_PIVOT,
             payload: !!disableDropOnPivot,
         });
     }, [state, layout]);
     const onColumnOrderChange = react_1.useCallback((columns) => {
-        setLayout(Object.assign(Object.assign({}, layout), { Columns: columns.filter((c) => visibleColumnsMap[c.ColumnId]).map((c) => c.ColumnId) }));
+        setLayout(Object.assign(Object.assign({}, layout), { Columns: columns.filter((c) => visibleColumnsMap[c.columnId]).map((c) => c.columnId) }));
         setColumnList(columns);
     }, [visibleColumnsMap, layout]);
     const onColumnSortsChange = react_1.useCallback((ColumnSorts) => {
@@ -257,16 +257,16 @@ exports.LayoutEditor = React.memo((props) => {
                     }, getItemStyle: (c, snapshot, draggableStyle) => {
                         return getItemStyle_1.getItemStyle(c, layout, state.dragSource, snapshot, draggableStyle);
                     }, columns: columnList, isDropDisabled: state.dropDisabledOnColumns, onColumnOrderChange: onColumnOrderChange, renderItem: (c) => {
-                        const visible = !!visibleColumnsMap[c.ColumnId];
-                        const aggregate = !!aggregationColumnsMap[c.ColumnId];
+                        const visible = !!visibleColumnsMap[c.columnId];
+                        const aggregate = !!aggregationColumnsMap[c.columnId];
                         // enable aggregation if there are row groups or pivoting is enabled
                         //  const aggregateEnabled =
                         //    (layout.RowGroupedColumns && layout.RowGroupedColumns.length) || layout.EnablePivot;
                         // JW: Not sure we do - why not just make it always visible as we ignore if if not required.
                         const aggregateEnabled = true;
-                        const customHeader = headerColumnsMap[c.ColumnId];
-                        const initialHeader = api.internalApi.getUserDefinedHeaderName(c.ColumnId);
-                        return (React.createElement(rebass_1.Flex, { flexDirection: "column", alignItems: "stretch", "data-name": "drag-item", "data-col-id": c.ColumnId },
+                        const customHeader = headerColumnsMap[c.columnId];
+                        const initialHeader = api.internalApi.getUserDefinedHeaderName(c.columnId);
+                        return (React.createElement(rebass_1.Flex, { flexDirection: "column", alignItems: "stretch", "data-name": "drag-item", "data-col-id": c.columnId },
                             React.createElement(rebass_1.Flex, { flexDirection: "row", alignItems: "center", backgroundColor: "secondary", color: "text-on-secondary" },
                                 React.createElement(rebass_1.Flex, { flex: 1, alignItems: "center" },
                                     React.createElement(rebass_1.Box, { ml: 2, mr: 2 },
@@ -279,18 +279,18 @@ exports.LayoutEditor = React.memo((props) => {
                                                 source: 'ContextMenu',
                                             });
                                         } }),
-                                    c.ColumnGroup && c.ColumnGroup.GroupCount > 1 ? (React.createElement(rebass_1.Box, { ml: 2, padding: 1, style: {
+                                    c.columnGroup && c.columnGroup.groupCount > 1 ? (React.createElement(rebass_1.Box, { ml: 2, padding: 1, style: {
                                             borderRadius: 'var(--ab__border-radius)',
                                             background: 'var(--ab-color-defaultbackground)',
                                             color: 'var(--ab-color-text-on-defaultbackground)',
                                         } },
                                         "Group: ",
-                                        c.ColumnGroup.FriendlyName)) : null),
-                                React.createElement(CheckBox_1.CheckBox, { title: "Visible", readOnly: !c.Hideable && visible, checked: visible, mx: 2, style: {
+                                        c.columnGroup.friendlyName)) : null),
+                                React.createElement(CheckBox_1.CheckBox, { title: "Visible", readOnly: !c.hideable && visible, checked: visible, mx: 2, style: {
                                         whiteSpace: 'nowrap',
                                     }, onChange: setColumnVisibility.bind(null, c) }, "Visible")),
                             React.createElement(rebass_1.Flex, { padding: 2, flexDirection: "column" },
-                                React.createElement(ColumnLabels, { showTitle: true, Sortable: c.Sortable, Filterable: c.Filterable, Moveable: c.Moveable, Pivotable: c.Pivotable, Groupable: c.Groupable, Aggregatable: c.Aggregatable }, ' '),
+                                React.createElement(ColumnLabels, { showTitle: true, sortable: c.sortable, filterable: c.filterable, moveable: c.moveable, pivotable: c.pivotable, groupable: c.groupable, aggregatable: c.aggregatable }, ' '),
                                 React.createElement(rebass_1.Flex, { flexDirection: "row", mt: 2 },
                                     React.createElement(rebass_1.Flex, { flex: 3, alignItems: "baseline" },
                                         React.createElement(rebass_1.Text, { fontSize: 3, mr: 2 }, "Header:"),
@@ -298,27 +298,27 @@ exports.LayoutEditor = React.memo((props) => {
                                                 const newTextValue = event.target.value;
                                                 const columnHeaders = Object.assign({}, layout.ColumnHeadersMap) || {};
                                                 if (StringExtensions_1.default.IsNullOrEmptyOrWhiteSpace(newTextValue)) {
-                                                    delete columnHeaders[c.ColumnId];
+                                                    delete columnHeaders[c.columnId];
                                                 }
                                                 else {
-                                                    columnHeaders[c.ColumnId] = newTextValue;
+                                                    columnHeaders[c.columnId] = newTextValue;
                                                 }
                                                 setLayout(Object.assign(Object.assign({}, layout), { ColumnHeadersMap: columnHeaders }));
                                             } })),
-                                    React.createElement(rebass_1.Flex, { flex: 2 }, c.Aggregatable &&
-                                        c.AvailableAggregationFunctions &&
-                                        c.AvailableAggregationFunctions.length ? (React.createElement(CheckBox_1.CheckBox, { key: "checkbox", ml: 3, my: 0, disabled: !aggregateEnabled, onChange: (checked) => {
+                                    React.createElement(rebass_1.Flex, { flex: 2 }, c.aggregatable &&
+                                        c.availableAggregationFunctions &&
+                                        c.availableAggregationFunctions.length ? (React.createElement(CheckBox_1.CheckBox, { key: "checkbox", ml: 3, my: 0, disabled: !aggregateEnabled, onChange: (checked) => {
                                             let aggCols = layout.AggregationColumns || {};
                                             // const aggCols = new Set(layout.AggregationColumns);
                                             if (checked) {
-                                                let aggFunc = c.AggregationFunction;
-                                                if (!aggFunc && c.AvailableAggregationFunctions) {
-                                                    aggFunc = c.AvailableAggregationFunctions[0];
+                                                let aggFunc = c.aggregationFunction;
+                                                if (!aggFunc && c.availableAggregationFunctions) {
+                                                    aggFunc = c.availableAggregationFunctions[0];
                                                 }
-                                                aggCols[c.ColumnId] = aggFunc;
+                                                aggCols[c.columnId] = aggFunc;
                                             }
                                             else {
-                                                delete aggCols[c.ColumnId];
+                                                delete aggCols[c.columnId];
                                                 if (!Object.keys(aggCols).length) {
                                                     aggCols = null;
                                                 }
@@ -328,7 +328,7 @@ exports.LayoutEditor = React.memo((props) => {
                                         "Aggregate",
                                         React.createElement(DropdownButton_1.default, { style: {
                                                 visibility: aggregate ? 'visible' : 'hidden',
-                                            }, ml: 2, padding: 0, columns: ['label'], variant: "text", items: c.AvailableAggregationFunctions.map((fnName) => {
+                                            }, ml: 2, padding: 0, columns: ['label'], variant: "text", items: c.availableAggregationFunctions.map((fnName) => {
                                                 return {
                                                     label: fnName,
                                                     onClick: () => {
@@ -336,11 +336,11 @@ exports.LayoutEditor = React.memo((props) => {
                                                         if (!aggCols) {
                                                             return;
                                                         }
-                                                        aggCols[c.ColumnId] = fnName;
+                                                        aggCols[c.columnId] = fnName;
                                                         setLayout(Object.assign(Object.assign({}, layout), { AggregationColumns: aggCols }));
                                                     },
                                                 };
-                                            }) }, aggregationColumnsMap[c.ColumnId]))) : null)))));
+                                            }) }, aggregationColumnsMap[c.columnId]))) : null)))));
                     } })),
             React.createElement(ListPanel, { header: "Sorting", className: "ab-LayoutEditor__ColumnSortListPanel" },
                 React.createElement(ColumnSortList_1.ColumnSortList, { columnSorts: layout.ColumnSorts, onColumnSortsChange: onColumnSortsChange, isDropDisabled: state.dropDisabledOnSort, onReady: (dragEnd) => {
@@ -356,7 +356,7 @@ exports.LayoutEditor = React.memo((props) => {
                             React.createElement(rebass_1.Box, { ml: 2, mr: 3 },
                                 React.createElement(icons_1.Icon, { name: "drag", size: 30 })),
                             React.createElement(rebass_1.Flex, { flex: "1", flexDirection: "row", alignItems: "center" },
-                                column.FriendlyName,
+                                column.friendlyName,
                                 " [",
                                 c.SortOrder,
                                 "]"),
@@ -381,7 +381,7 @@ exports.LayoutEditor = React.memo((props) => {
                         return (React.createElement(rebass_1.Flex, { flexDirection: "row", alignItems: "center", "data-name": "drag-item" },
                             React.createElement(rebass_1.Box, { ml: 2, mr: 3 },
                                 React.createElement(icons_1.Icon, { name: "drag", size: 30 })),
-                            React.createElement(rebass_1.Flex, { flexDirection: "row", alignItems: "center", flex: 1 }, column.FriendlyName),
+                            React.createElement(rebass_1.Flex, { flexDirection: "row", alignItems: "center", flex: 1 }, column.friendlyName),
                             React.createElement(SimpleButton_1.default, { variant: "text", onClick: (e) => {
                                     e.stopPropagation();
                                     clear();
@@ -400,7 +400,7 @@ exports.LayoutEditor = React.memo((props) => {
                         return (React.createElement(rebass_1.Flex, { flexDirection: "row", alignItems: "center", "data-name": "drag-item" },
                             React.createElement(rebass_1.Box, { ml: 2, mr: 3 },
                                 React.createElement(icons_1.Icon, { name: "drag", size: 30 })),
-                            React.createElement(rebass_1.Flex, { flexDirection: "row", alignItems: "center", flex: 1 }, column.FriendlyName),
+                            React.createElement(rebass_1.Flex, { flexDirection: "row", alignItems: "center", flex: 1 }, column.friendlyName),
                             React.createElement(SimpleButton_1.default, { variant: "text", onClick: (e) => {
                                     e.stopPropagation();
                                     clear();
@@ -424,5 +424,5 @@ exports.LayoutEditor = React.memo((props) => {
                         Groupable: 'Can form a row group',
                         Moveable: 'Is draggable and movable',
                         Pivotable: 'Eligible for pivoting',
-                    }, Sortable: true, Filterable: true, Moveable: true, Pivotable: true, Groupable: true, Aggregatable: true })))));
+                    }, sortable: true, filterable: true, moveable: true, pivotable: true, groupable: true, aggregatable: true })))));
 }, areEqual);

package/src/View/PlusMinus/PlusMinusPopup.js

@@ -45,7 +45,7 @@ class PlusMinusPopupComponent extends React.Component {
                     let column = this.props.popupParams.column;
                     let plusMinus = ObjectFactory_1.ObjectFactory.CreateEmptyPlusMinusNudge();
                     plusMinus.Scope = {
-                        ColumnIds: [column.ColumnId],
+                        ColumnIds: [column.columnId],
                     };
                     this.setState({
                         editedAdaptableObject: plusMinus,

package/src/View/PlusMinus/PlusMinusSummary.js

@@ -40,7 +40,7 @@ class PlusMinusSummaryComponent extends React.Component {
     onNew() {
         let configEntity = ObjectFactory_1.ObjectFactory.CreateEmptyPlusMinusNudge();
         configEntity.Scope = {
-            ColumnIds: [this.props.summarisedColumn.ColumnId],
+            ColumnIds: [this.props.summarisedColumn.columnId],
         };
         this.setState({
             editedAdaptableObject: configEntity,

package/src/View/Query/QueryViewPanel.js

@@ -73,8 +73,8 @@ class QueryViewPanelComponent extends React.Component {
         ];
         let availableColumns = this.props.api.columnApi.getColumns().map((col) => {
             return {
-                label: col.FriendlyName,
-                onClick: () => this.setState({ expression: this.state.expression + `[${col.ColumnId}]` }),
+                label: col.friendlyName,
+                onClick: () => this.setState({ expression: this.state.expression + `[${col.columnId}]` }),
             };
         });
         const elementType = this.props.viewType === 'Toolbar' ? 'DashboardToolbar' : 'ToolPanel';