feat(explore): add automatic conditional formatter to pivot table v2 (#16045)

superset-frontend/src/explore/components/controls/ConditionalFormattingControl/ConditionalFormattingControl.tsx

@@ -125,6 +125,8 @@ const ConditionalFormattingControl = ({
   }: ConditionalFormattingConfig) => {
     const columnName = (column && verboseMap?.[column]) ?? column;
     switch (operator) {
+      case COMPARATOR.NONE:
+        return `${columnName}`;
       case COMPARATOR.BETWEEN:
         return `${targetValueLeft} ${COMPARATOR.LESS_THAN} ${columnName} ${COMPARATOR.LESS_THAN} ${targetValueRight}`;
       case COMPARATOR.BETWEEN_OR_EQUAL:

superset-frontend/src/explore/components/controls/ConditionalFormattingControl/FormattingPopoverContent.tsx

@@ -44,6 +44,7 @@ const colorSchemeOptions = [
 ];
 
 const operatorOptions = [
+  { value: COMPARATOR.NONE, label: 'None' },
   { value: COMPARATOR.GREATER_THAN, label: '>' },
   { value: COMPARATOR.LESS_THAN, label: '<' },
   { value: COMPARATOR.GREATER_OR_EQUAL, label: '≥' },
@@ -68,6 +69,9 @@ export const FormattingPopoverContent = ({
   const isOperatorMultiValue = (operator?: COMPARATOR) =>
     operator && MULTIPLE_VALUE_COMPARATORS.includes(operator);
 
+  const isOperatorNone = (operator?: COMPARATOR) =>
+    !operator || operator === COMPARATOR.NONE;
+
   const operatorField = useMemo(
     () => (
       <FormItem
@@ -146,12 +150,18 @@ export const FormattingPopoverContent = ({
           prevValues: ConditionalFormattingConfig,
           currentValues: ConditionalFormattingConfig,
         ) =>
+          isOperatorNone(prevValues.operator) !==
+            isOperatorNone(currentValues.operator) ||
           isOperatorMultiValue(prevValues.operator) !==
-          isOperatorMultiValue(currentValues.operator)
+            isOperatorMultiValue(currentValues.operator)
         }
       >
         {({ getFieldValue }) =>
-          isOperatorMultiValue(getFieldValue('operator')) ? (
+          isOperatorNone(getFieldValue('operator')) ? (
+            <Row gutter={12}>
+              <Col span={6}>{operatorField}</Col>
+            </Row>
+          ) : isOperatorMultiValue(getFieldValue('operator')) ? (
             <Row gutter={12}>
               <Col span={9}>
                 <FormItem

superset-frontend/src/explore/components/controls/ConditionalFormattingControl/types.ts

@@ -22,6 +22,7 @@ import { PopoverProps } from 'antd/lib/popover';
 import { ControlComponentProps } from '@superset-ui/chart-controls/lib/shared-controls/components/types';
 
 export enum COMPARATOR {
+  NONE = 'None',
   GREATER_THAN = '>',
   LESS_THAN = '<',
   GREATER_OR_EQUAL = '≥',