[CLDN-1829] fixing principle filter logic with state (#234) (#244)

* [CLDN-1829] fixing principle filter logic with state

* [CLDN-1829] Fixing build error

superset-frontend/src/cccs-viz/plugins/plugin-chart-cccs-grid/src/plugin/controlPanel.tsx

@@ -101,17 +101,6 @@ const validateAggControlValues = (
  : [];
 };
 
-const validateAggColumnValues = (
- controls: ControlStateMapping,
- values: any[],
- state: ControlPanelState,
-) => {
- const result = validateAggControlValues(controls, values);
- if (result.length === 0 && isAggMode({ controls })) {
- return [];
- }
- return result;
-};
 
 // function isIP(v: unknown) {
 // if (typeof v === 'string' && v.trim().length > 0) {
@@ -212,20 +201,11 @@ const config: ControlPanelConfig = {
  [
  {
  name: 'groupby',
- config: {
- type: 'SelectControl',
- label: t('Group by'),
- description: sharedControls.groupby.description,
- multi: true,
- freeForm: true,
- allowAll: true,
- default: [],
- valueKey: 'column_name',
- includeTime: false,
- canSelectAll: true,
- optionRenderer: c => <StyledColumnOption showType column={c} />,
- valueRenderer: c => <StyledColumnOption column={c} />,
+ override: {
  visibility: isAggMode,
+ resetOnHide: false,
+ canCopy: true,
+ canSelectAll: true,
  mapStateToProps: (
  state: ControlPanelState,
  controlState: ControlState,
@@ -235,24 +215,19 @@ const config: ControlPanelConfig = {
  sharedControls?.groupby?.mapStateToProps;
  const newState =
  originalMapStateToProps?.(state, controlState) ?? {};
- newState.externalValidationErrors = validateAggColumnValues(
+ newState.externalValidationErrors = validateAggControlValues(
  controls,
  [
  controls.metrics?.value,
- controlState.value,
  controls.percent_metrics?.value,
+ controlState.value,
  ],
- state,
  );
+
  return newState;
  },
- rerender: [
- 'metrics',
- 'percent_metrics',
- 'principalEmitFilterColumn',
- ],
- canCopy: true,
- } as typeof sharedControls.groupby,
+ rerender: ['metrics', 'percent_metrics', ],
+ },
  },
  ],
  [
@@ -317,15 +292,22 @@ const config: ControlPanelConfig = {
  name: 'columns',
  config: {
  type: 'SelectControl',
- label: t('Columns'),
+ label: t('Dimensions'),
  description: t('Columns to display'),
  multi: true,
  freeForm: true,
  allowAll: true,
  default: [],
  canSelectAll: true,
- optionRenderer: c => <StyledColumnOption showType column={c} />,
- valueRenderer: c => <StyledColumnOption column={c} />,
+ 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,
@@ -347,7 +329,7 @@ const config: ControlPanelConfig = {
  rerender: ['principalColumns'],
  visibility: isRawMode,
  canCopy: true,
- } as typeof sharedControls.groupby,
+ } 
  },
  ],
  [
@@ -437,8 +419,9 @@ const config: ControlPanelConfig = {
  controlState: ControlState,
  ) => {
  const { controls } = state;
- const originalMapStateToProps =
- sharedControls?.columns?.mapStateToProps;
+ const originalMapStateToProps = isRawMode({ controls }) ?
+ sharedControls?.columns?.mapStateToProps :
+ sharedControls?.groupby?.mapStateToProps;
  const newState =
  originalMapStateToProps?.(state, controlState) ?? {};
  const choices = isRawMode({ controls })