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 16:28:04 UTC
(superset) 03/04: update type
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 e352871a996bbb4258914e846eac75daa215f47d
Author: lilykuang <ji...@gmail.com>
AuthorDate: Tue Mar 26 09:38:12 2024 -0700
update type
---
.../plugin-chart-table/src/controlPanel.tsx | 5 +-
.../plugin-chart-table/src/transformProps.ts | 74 +++++++++++-----------
.../plugins/plugin-chart-table/src/types.ts | 7 ++
3 files changed, 45 insertions(+), 41 deletions(-)
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..924357653f 100644
--- a/superset-frontend/plugins/plugin-chart-table/src/transformProps.ts
+++ b/superset-frontend/plugins/plugin-chart-table/src/transformProps.ts
@@ -379,12 +379,12 @@ 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)',
+ backgroundColor: '#FFBFA133',
};
}
const isPositive = percentDifferenceNum > 0;
@@ -397,51 +397,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: 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 { 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: arrowColor,
+ backgroundColor: backgroundColor,
+ };
+ }
});
- },
- );
+ return item;
+ });
+ });
const canUseTimeComparison =
enableTimeComparison &&
diff --git a/superset-frontend/plugins/plugin-chart-table/src/types.ts b/superset-frontend/plugins/plugin-chart-table/src/types.ts
index f4ca8473f1..8393bb23cc 100644
--- a/superset-frontend/plugins/plugin-chart-table/src/types.ts
+++ b/superset-frontend/plugins/plugin-chart-table/src/types.ts
@@ -145,4 +145,11 @@ export enum ColorSchemeEnum {
'Red' = 'Red',
}
+export type BasicColorFormatterType {
+ backgroundColor: string;
+ arrowColor: string;
+ mainArrow: string;
+}
+
+
export default {};