feat(explore): default aggregate for string/numeric columns when creating metric (#15798)

* feat(explore): default aggregate for string/numeric columns when creating metric

* Fix for editing items with the same label

* Replace componentDidUpdate with getDerivedStateFromProps

* Wrap changes in feature flag

superset-frontend/src/explore/components/controls/DndColumnSelectControl/DndMetricSelect.tsx

@@ -18,7 +18,14 @@
  */
 
 import React, { useCallback, useEffect, useMemo, useState } from 'react';
-import { ensureIsArray, Metric, tn } from '@superset-ui/core';
+import {
+  ensureIsArray,
+  FeatureFlag,
+  GenericDataType,
+  isFeatureEnabled,
+  Metric,
+  tn,
+} from '@superset-ui/core';
 import { ColumnMeta } from '@superset-ui/chart-controls';
 import { isEqual } from 'lodash';
 import { usePrevious } from 'src/common/hooks/usePrevious';
@@ -30,6 +37,7 @@ import { DatasourcePanelDndItem } from 'src/explore/components/DatasourcePanel/t
 import { DndItemType } from 'src/explore/components/DndItemType';
 import DndSelectLabel from 'src/explore/components/controls/DndColumnSelectControl/DndSelectLabel';
 import { savedMetricType } from 'src/explore/components/controls/MetricControl/types';
+import { AGGREGATES } from 'src/explore/constants';
 
 const isDictionaryForAdhocMetric = (value: any) =>
   value && !(value instanceof AdhocMetric) && value.expressionType;
@@ -254,12 +262,24 @@ export const DndMetricSelect = (props: any) => {
   const adhocMetric = useMemo(() => {
     if (droppedItem?.type === DndItemType.Column) {
       const itemValue = droppedItem?.value as ColumnMeta;
-      return new AdhocMetric({
+      const config: Partial<AdhocMetric> = {
         column: { column_name: itemValue?.column_name },
-      });
+      };
+      if (isFeatureEnabled(FeatureFlag.UX_BETA)) {
+        if (itemValue.type_generic === GenericDataType.NUMERIC) {
+          config.aggregate = AGGREGATES.SUM;
+        } else if (
+          itemValue.type_generic === GenericDataType.STRING ||
+          itemValue.type_generic === GenericDataType.BOOLEAN ||
+          itemValue.type_generic === GenericDataType.TEMPORAL
+        ) {
+          config.aggregate = AGGREGATES.COUNT_DISTINCT;
+        }
+      }
+      return new AdhocMetric(config);
     }
     return new AdhocMetric({ isNew: true });
-  }, [droppedItem?.type, droppedItem?.value]);
+  }, [droppedItem]);
 
   return (
     <div className="metrics-select">

superset-frontend/src/explore/components/controls/MetricControl/AdhocMetricPopoverTrigger.tsx

@@ -43,6 +43,7 @@ export type AdhocMetricPopoverTriggerProps = {
 };
 
 export type AdhocMetricPopoverTriggerState = {
+  adhocMetric: AdhocMetric;
   popoverVisible: boolean;
   title: { label: string; hasCustomLabel: boolean };
   currentLabel: string;
@@ -65,6 +66,7 @@ class AdhocMetricPopoverTrigger extends React.PureComponent<
     this.onChange = this.onChange.bind(this);
 
     this.state = {
+      adhocMetric: props.adhocMetric,
       popoverVisible: false,
       title: {
         label: props.adhocMetric.label,
@@ -76,6 +78,26 @@ class AdhocMetricPopoverTrigger extends React.PureComponent<
     };
   }
 
+  static getDerivedStateFromProps(
+    nextProps: AdhocMetricPopoverTriggerProps,
+    prevState: AdhocMetricPopoverTriggerState,
+  ) {
+    if (prevState.adhocMetric.optionName !== nextProps.adhocMetric.optionName) {
+      return {
+        adhocMetric: nextProps.adhocMetric,
+        title: {
+          label: nextProps.adhocMetric.label,
+          hasCustomLabel: nextProps.adhocMetric.hasCustomLabel,
+        },
+        currentLabel: '',
+        labelModified: false,
+      };
+    }
+    return {
+      adhocMetric: nextProps.adhocMetric,
+    };
+  }
+
   onLabelChange(e: any) {
     const { verbose_name, metric_name } = this.props.savedMetric;
     const defaultMetricLabel = this.props.adhocMetric?.getDefaultLabel();

superset/config.py

@@ -399,6 +399,7 @@ DEFAULT_FEATURE_FLAGS: Dict[str, bool] = {
     # Allow users to export full CSV of table viz type.
     # This could cause the server to run out of memory or compute.
     "ALLOW_FULL_CSV_EXPORT": False,
+    "UX_BETA": False,
 }
 
 # Feature flags may also be set via 'SUPERSET_FEATURE_' prefixed environment vars.