You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@superset.apache.org by li...@apache.org on 2024/03/27 19:21:31 UTC

(superset) branch table-time-comparison-color updated (e352871a99 -> 1540e3f3e6)

This is an automated email from the ASF dual-hosted git repository.

lilykuang pushed a change to branch table-time-comparison-color
in repository https://gitbox.apache.org/repos/asf/superset.git


 discard e352871a99 update type
     new 1540e3f3e6 update type

This update added new revisions after undoing existing revisions.
That is to say, some revisions that were in the old version of the
branch are not in the new version.  This situation occurs
when a user --force pushes a change and generates a repository
containing something like this:

 * -- * -- B -- O -- O -- O   (e352871a99)
            \
             N -- N -- N   refs/heads/table-time-comparison-color (1540e3f3e6)

You should already have received notification emails for all of the O
revisions, and so the following emails describe only the N revisions
from the common base, B.

Any revisions marked "omit" are not gone; other references still
refer to them.  Any revisions marked "discard" are gone forever.

The 1 revisions listed above as "new" are entirely new to this
repository and will be described in separate emails.  The revisions
listed as "add" were already present in the repository and have only
been added to this reference.


Summary of changes:
 .../plugins/plugin-chart-table/src/TableChart.tsx      | 18 +++++++++---------
 .../plugins/plugin-chart-table/src/transformProps.ts   | 12 +++++++-----
 .../plugins/plugin-chart-table/src/types.ts            | 14 ++++++--------
 3 files changed, 22 insertions(+), 22 deletions(-)


(superset) 01/01: update type

Posted by li...@apache.org.
This is an automated email from the ASF dual-hosted git repository.

lilykuang pushed a commit to branch table-time-comparison-color
in repository https://gitbox.apache.org/repos/asf/superset.git

commit 1540e3f3e693d3df75abbb0cf3f2be4eaf3c5b2c
Author: lilykuang <ji...@gmail.com>
AuthorDate: Tue Mar 26 09:38:12 2024 -0700

    update type
---
 .../plugins/plugin-chart-table/src/TableChart.tsx  | 18 ++---
 .../plugin-chart-table/src/controlPanel.tsx        |  5 +-
 .../plugin-chart-table/src/transformProps.ts       | 80 +++++++++++-----------
 .../plugins/plugin-chart-table/src/types.ts        |  7 +-
 4 files changed, 57 insertions(+), 53 deletions(-)

diff --git a/superset-frontend/plugins/plugin-chart-table/src/TableChart.tsx b/superset-frontend/plugins/plugin-chart-table/src/TableChart.tsx
index ef564fdf27..06fa6139e2 100644
--- a/superset-frontend/plugins/plugin-chart-table/src/TableChart.tsx
+++ b/superset-frontend/plugins/plugin-chart-table/src/TableChart.tsx
@@ -252,7 +252,7 @@ export default function TableChart<D extends DataRecord = DataRecord>(
     onContextMenu,
     emitCrossFilters,
     enableTimeComparison,
-    basicColorFormatter,
+    basicColorFormatters,
   } = props;
   const comparisonColumns = [
     { key: 'all', label: t('Display all') },
@@ -697,11 +697,11 @@ export default function TableChart<D extends DataRecord = DataRecord>(
         Array.isArray(columnColorFormatters) &&
         columnColorFormatters.length > 0;
 
-      const hasBasicColorFormatter =
-        Array.isArray(basicColorFormatter) && basicColorFormatter.length > 0;
+      const hasBasicColorFormatters =
+        Array.isArray(basicColorFormatters) && basicColorFormatters.length > 0;
 
       const valueRange =
-        !hasBasicColorFormatter &&
+        !hasBasicColorFormatters &&
         !hasColumnColorFormatters &&
         (config.showCellBars === undefined
           ? showCellBars
@@ -739,12 +739,12 @@ export default function TableChart<D extends DataRecord = DataRecord>(
           let backgroundColor;
           let arrow = '';
           const originKey = column.key.substring(column.label.length).trim();
-          if (!hasColumnColorFormatters && hasBasicColorFormatter) {
+          if (!hasColumnColorFormatters && hasBasicColorFormatters) {
             backgroundColor =
-              basicColorFormatter[row.index][originKey]?.backgroundColor;
+              basicColorFormatters[row.index][originKey]?.backgroundColor;
             arrow =
               column.label === comparisonLabels[0]
-                ? basicColorFormatter[row.index][originKey]?.mainArrow
+                ? basicColorFormatters[row.index][originKey]?.mainArrow
                 : '';
           }
 
@@ -794,8 +794,8 @@ export default function TableChart<D extends DataRecord = DataRecord>(
           `;
 
           const arrowStyles = css`
-            color: ${basicColorFormatter &&
-            basicColorFormatter[row.index][originKey]?.arrowColor ===
+            color: ${basicColorFormatters &&
+            basicColorFormatters[row.index][originKey]?.arrowColor ===
               ColorSchemeEnum.Green
               ? theme.colors.success.base
               : theme.colors.error.base};
diff --git a/superset-frontend/plugins/plugin-chart-table/src/controlPanel.tsx b/superset-frontend/plugins/plugin-chart-table/src/controlPanel.tsx
index 6fcdcd825d..641445913b 100644
--- a/superset-frontend/plugins/plugin-chart-table/src/controlPanel.tsx
+++ b/superset-frontend/plugins/plugin-chart-table/src/controlPanel.tsx
@@ -665,9 +665,8 @@ const config: ControlPanelConfig = {
                         }))
                     : [];
 
-                const columnOptions = Boolean(
-                  explore?.controls?.enable_time_comparison?.value,
-                )
+                const columnOptions = explore?.controls?.enable_time_comparison
+                  ?.value
                   ? processComparisonColumns(numericColumns || [])
                   : numericColumns;
 
diff --git a/superset-frontend/plugins/plugin-chart-table/src/transformProps.ts b/superset-frontend/plugins/plugin-chart-table/src/transformProps.ts
index 8a39f4b4dd..3edec0c9ef 100644
--- a/superset-frontend/plugins/plugin-chart-table/src/transformProps.ts
+++ b/superset-frontend/plugins/plugin-chart-table/src/transformProps.ts
@@ -43,6 +43,7 @@ import {
 import isEqualColumns from './utils/isEqualColumns';
 import DateWithFormatter from './utils/DateWithFormatter';
 import {
+  BasicColorFormatterType,
   ColorSchemeEnum,
   DataColumnMeta,
   TableChartProps,
@@ -379,12 +380,13 @@ const transformProps = (
     comparison_color_scheme: comparisonColorScheme = ColorSchemeEnum.Green,
   } = formData;
 
-  const calculateColorAndArrow = (percentDifferenceNum: number) => {
+  const calculateBasicStyle = (percentDifferenceNum: number) => {
     if (percentDifferenceNum === 0) {
       return {
         arrow: '',
         arrowColor: '',
-        basicBackgroundColor: 'rgba(255, 191, 161, 0.2)',
+        // eslint-disable-next-line theme-colors/no-literal-colors
+        backgroundColor: '#FFBFA133',
       };
     }
     const isPositive = percentDifferenceNum > 0;
@@ -397,51 +399,49 @@ const transformProps = (
         : isPositive
           ? ColorSchemeEnum.Red
           : ColorSchemeEnum.Green;
-    const basicBackgroundColor =
+    const backgroundColor =
       comparisonColorScheme === ColorSchemeEnum.Green
         ? `rgba(${isPositive ? '0,150,0' : '150,0,0'},0.2)`
         : `rgba(${isPositive ? '150,0,0' : '0,150,0'},0.2)`;
 
-    return { arrow, arrowColor, basicBackgroundColor };
+    return { arrow, arrowColor, backgroundColor };
   };
 
-  const getBasicColorFormatter = memoizeOne(
-    function processComparisonDataRecords(
-      originalData: DataRecord[] | undefined,
-      originalColumns: DataColumnMeta[],
-    ) {
-      // Transform data
-      return originalData?.map(originalItem => {
-        const item: any = {};
-        originalColumns.forEach(origCol => {
-          if (
-            (origCol.isMetric || origCol.isPercentMetric) &&
-            !origCol.key.includes(COMPARISON_PREFIX) &&
-            origCol.isNumeric
-          ) {
-            const originalValue = originalItem[origCol.key] || 0;
-            const comparisonValue = origCol.isMetric
-              ? originalItem?.[`${COMPARISON_PREFIX}${origCol.key}`] || 0
-              : originalItem[`%${COMPARISON_PREFIX}${origCol.key.slice(1)}`] ||
-                0;
-            const { percentDifferenceNum } = calculateDifferences(
-              originalValue as number,
-              comparisonValue as number,
-            );
+  const getBasicColorFormatter = memoizeOne(function getBasicColorFormatter(
+    originalData: DataRecord[] | undefined,
+    originalColumns: DataColumnMeta[],
+  ) {
+    // Transform data
+    return originalData?.map(originalItem => {
+      const item: { [key: string]: BasicColorFormatterType } = {};
+      originalColumns.forEach(origCol => {
+        if (
+          (origCol.isMetric || origCol.isPercentMetric) &&
+          !origCol.key.includes(COMPARISON_PREFIX) &&
+          origCol.isNumeric
+        ) {
+          const originalValue = originalItem[origCol.key] || 0;
+          const comparisonValue = origCol.isMetric
+            ? originalItem?.[`${COMPARISON_PREFIX}${origCol.key}`] || 0
+            : originalItem[`%${COMPARISON_PREFIX}${origCol.key.slice(1)}`] || 0;
+          const { percentDifferenceNum } = calculateDifferences(
+            originalValue as number,
+            comparisonValue as number,
+          );
 
-            const { arrow, arrowColor, basicBackgroundColor } =
-              calculateColorAndArrow(percentDifferenceNum);
+          const { arrow, arrowColor, backgroundColor } =
+            calculateBasicStyle(percentDifferenceNum);
 
-            item[`${origCol.key}`] = {};
-            item[`${origCol.key}`].mainArrow = arrow;
-            item[`${origCol.key}`].arrowColor = arrowColor;
-            item[`${origCol.key}`].backgroundColor = basicBackgroundColor;
-          }
-        });
-        return item;
+          item[`${origCol.key}`] = {
+            mainArrow: arrow,
+            arrowColor,
+            backgroundColor,
+          };
+        }
       });
-    },
-  );
+      return item;
+    });
+  });
 
   const canUseTimeComparison =
     enableTimeComparison &&
@@ -481,7 +481,7 @@ const transformProps = (
   const passedTotals = canUseTimeComparison ? comparisonTotals : totals;
   const passedColumns = canUseTimeComparison ? comparisonColumns : columns;
 
-  const basicColorFormatter =
+  const basicColorFormatters =
     comparisonColorEnabled && getBasicColorFormatter(baseQuery?.data, columns);
   const columnColorFormatters =
     getColorFormatters(conditionalFormatting, passedData) ??
@@ -518,7 +518,7 @@ const transformProps = (
     allowRearrangeColumns,
     onContextMenu,
     enableTimeComparison: canUseTimeComparison,
-    basicColorFormatter,
+    basicColorFormatters,
   };
 };
 
diff --git a/superset-frontend/plugins/plugin-chart-table/src/types.ts b/superset-frontend/plugins/plugin-chart-table/src/types.ts
index f4ca8473f1..e8f2ae3f0a 100644
--- a/superset-frontend/plugins/plugin-chart-table/src/types.ts
+++ b/superset-frontend/plugins/plugin-chart-table/src/types.ts
@@ -103,6 +103,11 @@ export interface TableChartProps extends ChartProps {
   queriesData: ChartDataResponseResult[];
 }
 
+export type BasicColorFormatterType = {
+  backgroundColor: string;
+  arrowColor: string;
+  mainArrow: string;
+};
 export interface TableChartTransformedProps<D extends DataRecord = DataRecord> {
   timeGrain?: TimeGranularity;
   height: number;
@@ -137,7 +142,7 @@ export interface TableChartTransformedProps<D extends DataRecord = DataRecord> {
     filters?: ContextMenuFilters,
   ) => void;
   enableTimeComparison?: boolean;
-  basicColorFormatter?: any;
+  basicColorFormatters?: { [Key: string]: BasicColorFormatterType }[];
 }
 
 export enum ColorSchemeEnum {