Feature/cldn 1773 (#269)

* [CLDN-1773] Adding default group by * Updating DockerFile * Fixing Groupby * Updating base image * [CLDN-1773] Saving Group by order * Updating dockerfile * Update controlPanel.tsx * Update superset-frontend/src/cccs-viz/plugins/plugin-chart-cccs-grid/src/plugin/transformProps.ts Co-authored-by: cccs-tom <[email protected]> * Update superset-frontend/src/cccs-viz/plugins/plugin-chart-cccs-grid/src/plugin/transformProps.ts Co-authored-by: cccs-tom <[email protected]> * Update superset-frontend/src/cccs-viz/plugins/plugin-chart-cccs-grid/src/plugin/transformProps.ts Co-authored-by: cccs-RyanK <[email protected]> --------- Co-authored-by: cccs-tom <[email protected]> Co-authored-by: cccs-RyanK <[email protected]>
CybercentreCanada · Apr 20, 2023 · 97242ee · 97242ee
1 parent 1b5a1c4
commit 97242ee
Show file tree

Hide file tree

Showing 2 changed files with 84 additions and 2 deletions.
diff --git a/superset-frontend/src/cccs-viz/plugins/plugin-chart-cccs-grid/src/plugin/controlPanel.tsx b/superset-frontend/src/cccs-viz/plugins/plugin-chart-cccs-grid/src/plugin/controlPanel.tsx
@@ -227,7 +227,7 @@ const config: ControlPanelConfig = {
 
                 return newState;
               },
-              rerender: ['metrics', 'percent_metrics'],
+              rerender: ['metrics', 'percent_metrics', 'default_group_by'],
             },
           },
         ],
@@ -327,7 +327,7 @@ const config: ControlPanelConfig = {
                     : [];
                 return newState;
               },
-              rerender: ['principalColumns'],
+              rerender: ['principalColumns', 'default_group_by'],
               visibility: isRawMode,
               canCopy: true,
             },
@@ -593,6 +593,69 @@ config.controlPanelSections.push({
         },
       },
     ],
+    [
+      {
+        name: 'default_group_by',
+        config: {
+          type: 'SelectControl',
+          label: t('Default columns for row grouping'),
+          description: t(
+            'Preselect a set of columns for row grouping in the grid.',
+          ),
+          multi: true,
+          freeForm: true,
+          allowAll: true,
+          default: [],
+          canSelectAll: true,
+          renderTrigger: true,
+          optionRenderer: (c: ColumnMeta) => (
+            // eslint-disable-next-line react/react-in-jsx-scope
+            <StyledColumnOption showType column={c} />
+          ),
+          // eslint-disable-next-line react/react-in-jsx-scope
+          valueRenderer: (c: ColumnMeta) => (
+            // eslint-disable-next-line react/react-in-jsx-scope
+            <StyledColumnOption column={c} />
+          ),
+          valueKey: 'column_name',
+          mapStateToProps: (
+            state: ControlPanelState,
+            controlState: ControlState,
+          ) => {
+            const { controls } = state;
+            const originalMapStateToProps = isRawMode({ controls })
+              ? sharedControls?.columns?.mapStateToProps
+              : sharedControls?.groupby?.mapStateToProps;
+            const newState =
+              originalMapStateToProps?.(state, controlState) ?? {};
+            const choices = isRawMode({ controls })
+              ? controls?.columns?.value
+              : controls?.groupby?.value;
+            newState.options = newState.options.filter(
+              (o: { column_name: string }) =>
+                ensureIsArray(choices).includes(o.column_name),
+            );
+            const invalidOptions = ensureIsArray(controlState.value).filter(
+              c => !ensureIsArray(choices).includes(c),
+            );
+            newState.externalValidationErrors =
+              invalidOptions.length > 0
+                ? invalidOptions.length > 1
+                  ? [
+                      `'${invalidOptions.join(', ')}'${t(
+                        ' are not valid options',
+                      )}`,
+                    ]
+                  : [`'${invalidOptions}'${t(' is not a valid option')}`]
+                : [];
+            return newState;
+          },
+          visibility: ({ controls }) =>
+            Boolean(controls?.enable_grouping?.value),
+          canCopy: true,
+        },
+      },
+    ],
     [
       {
         name: 'enable_row_numbers',

diff --git a/superset-frontend/src/cccs-viz/plugins/plugin-chart-cccs-grid/src/plugin/transformProps.ts b/superset-frontend/src/cccs-viz/plugins/plugin-chart-cccs-grid/src/plugin/transformProps.ts
@@ -84,6 +84,7 @@ export default function transformProps(chartProps: CccsGridChartProps) {
     column_state,
     enable_row_numbers,
     jump_action_configs,
+    default_group_by,
   }: CccsGridQueryFormData = { ...DEFAULT_FORM_DATA, ...formData };
   const data = queriesData[0].data as TimeseriesDataRecord[];
   const agGridLicenseKey = queriesData[0].agGridLicenseKey as String;
@@ -232,6 +233,11 @@ export default function transformProps(chartProps: CccsGridChartProps) {
       const isSortable = true;
       const enableRowGroup = true;
       const columnDescription = columnDescriptionMap[column];
+      const rowGroupIndex = default_group_by.findIndex((element: any) => {
+        return element === column;
+      });
+      const rowGroup = rowGroupIndex >= 0;
+      const hide = rowGroup;
       return {
         field: column,
         headerName: columnHeader,
@@ -240,6 +246,9 @@ export default function transformProps(chartProps: CccsGridChartProps) {
         sort: sortDirection,
         sortIndex,
         enableRowGroup,
+        rowGroup,
+        hide,
+        rowGroupIndex,
         getQuickFilterText: (params: any) => valueFormatter(params),
         headerTooltip: columnDescription,
       };
@@ -261,12 +270,22 @@ export default function transformProps(chartProps: CccsGridChartProps) {
         const isSortable = true;
         const enableRowGroup = true;
         const columnDescription = columnDescriptionMap[column];
+        const rowGroupIndex = default_group_by.findIndex((element: any) => {
+          return element === column;
+        });
+        const initialRowGroupIndex = rowGroupIndex;
+        const rowGroup = rowGroupIndex >= 0;
+        const hide = rowGroup;
         return {
           field: column,
           headerName: columnHeader,
           cellRenderer,
           sortable: isSortable,
           enableRowGroup,
+          rowGroup,
+          rowGroupIndex,
+          initialRowGroupIndex,
+          hide,
           getQuickFilterText: (params: any) => valueFormatter(params),
           headerTooltip: columnDescription,
         };