fix(plugin-chart-table): Resetting controls when switching query mode (#19792)

superset-frontend/plugins/plugin-chart-table/src/controlPanel.tsx

@@ -117,6 +117,7 @@ const all_columns: typeof sharedControls.groupby = {
         : [],
   }),
   visibility: isRawMode,
+  resetOnHide: false,
 };
 
 const dnd_all_columns: typeof sharedControls.groupby = {
@@ -140,6 +141,7 @@ const dnd_all_columns: typeof sharedControls.groupby = {
     return newState;
   },
   visibility: isRawMode,
+  resetOnHide: false,
 };
 
 const percent_metrics: typeof sharedControls.metrics = {
@@ -150,6 +152,7 @@ const percent_metrics: typeof sharedControls.metrics = {
   ),
   multi: true,
   visibility: isAggMode,
+  resetOnHide: false,
   mapStateToProps: ({ datasource, controls }, controlState) => ({
     columns: datasource?.columns || [],
     savedMetrics: datasource?.metrics || [],
@@ -190,6 +193,7 @@ const config: ControlPanelConfig = {
             name: 'groupby',
             override: {
               visibility: isAggMode,
+              resetOnHide: false,
               mapStateToProps: (
                 state: ControlPanelState,
                 controlState: ControlState,
@@ -220,6 +224,7 @@ const config: ControlPanelConfig = {
             override: {
               validators: [],
               visibility: isAggMode,
+              resetOnHide: false,
               mapStateToProps: (
                 { controls, datasource, form_data }: ControlPanelState,
                 controlState: ControlState,
@@ -263,6 +268,7 @@ const config: ControlPanelConfig = {
             name: 'timeseries_limit_metric',
             override: {
               visibility: isAggMode,
+              resetOnHide: false,
             },
           },
           {
@@ -277,6 +283,7 @@ const config: ControlPanelConfig = {
                 choices: datasource?.order_by_choices || [],
               }),
               visibility: isRawMode,
+              resetOnHide: false,
             },
           },
         ],
@@ -329,6 +336,7 @@ const config: ControlPanelConfig = {
               ),
               default: false,
               visibility: isAggMode,
+              resetOnHide: false,
             },
           },
           {
@@ -339,6 +347,7 @@ const config: ControlPanelConfig = {
               default: true,
               description: t('Whether to sort descending or ascending'),
               visibility: isAggMode,
+              resetOnHide: false,
             },
           },
         ],
@@ -353,6 +362,7 @@ const config: ControlPanelConfig = {
                 'Show total aggregations of selected metrics. Note that row limit does not apply to the result.',
               ),
               visibility: isAggMode,
+              resetOnHide: false,
             },
           },
         ],

superset-frontend/src/explore/components/Control.tsx

@@ -46,6 +46,7 @@ export type ControlProps = {
   renderTrigger?: boolean;
   default?: JsonValue;
   isVisible?: boolean;
+  resetOnHide?: boolean;
 };
 
 /**
@@ -65,6 +66,7 @@ export default function Control(props: ControlProps) {
     type,
     hidden,
     isVisible,
+    resetOnHide = true,
   } = props;
 
   const [hovered, setHovered] = useState(false);
@@ -79,7 +81,8 @@ export default function Control(props: ControlProps) {
       wasVisible === true &&
       isVisible === false &&
       props.default !== undefined &&
-      !isEqual(props.value, props.default)
+      !isEqual(props.value, props.default) &&
+      resetOnHide
     ) {
       // reset control value if setting to invisible
       setControlValue?.(name, props.default);