rusackas commented on code in PR #42053:
URL: https://github.com/apache/superset/pull/42053#discussion_r3732203445


##########
superset-frontend/plugins/plugin-chart-table/src/TableChart.tsx:
##########
@@ -1094,7 +1095,7 @@ export default function TableChart<D extends DataRecord = 
DataRecord>(
                 formatter.objectFormatting === ObjectFormattingEnum.CELL_BAR
               ) {
                 if (generalShowCellBars)
-                  backgroundColorCellBar = formatterResult.slice(0, -2);
+                  backgroundColorCellBar = forceHexAlpha(formatterResult);

Review Comment:
   This doesn't actually reach `forceHexAlpha`. `columnColorFormatters` filters 
out Green/Red configs in `transformProps.ts` before `getColorFormatters` ever 
sees them, and those get routed through the basic color formatter path instead.



##########
superset-frontend/packages/superset-ui-core/src/color/utils.ts:
##########
@@ -120,3 +121,30 @@ export function rgbToHex(red: number, green: number, blue: 
number) {
 
   return `#${r}${g}${b}`;
 }
+
+export function rgbaToHex(rgb: RGBColor): string {
+  const { r, g, b, a = 1 } = rgb;
+  const toHex = (value: number) => {
+    const hex = Math.round(value).toString(16);
+    return hex.length === 1 ? `0${hex}` : hex;
+  };
+  const hexColor = `#${toHex(r)}${toHex(g)}${toHex(b)}`;
+  if (a !== 1) {
+    return `${hexColor}${toHex(Math.round(a * 255))}`;
+  }

Review Comment:
   Valid catch, added clamping for the RGB channels and alpha in `rgbaToHex` so 
out-of-range persisted values can't produce a malformed hex string.



##########
superset-frontend/packages/superset-ui-core/src/color/utils.ts:
##########
@@ -120,3 +121,30 @@ export function rgbToHex(red: number, green: number, blue: 
number) {
 
   return `#${r}${g}${b}`;
 }
+
+export function rgbaToHex(rgb: RGBColor): string {
+  const { r, g, b, a = 1 } = rgb;
+  const toHex = (value: number) => {
+    const hex = Math.round(value).toString(16);
+    return hex.length === 1 ? `0${hex}` : hex;
+  };
+  const hexColor = `#${toHex(r)}${toHex(g)}${toHex(b)}`;
+  if (a !== 1) {
+    return `${hexColor}${toHex(Math.round(a * 255))}`;
+  }
+  return hexColor;
+}
+
+export const forceHexAlpha = (color: string | RGBColor): string => {
+  if (typeof color === 'object' && color !== null) {
+    return rgbaToHex({ ...color, a: 0.6 });
+  }
+
+  const hex = color.startsWith('#') ? color : `#${color}`;
+
+  if (hex.length === 9) {
+    return `${hex.slice(0, -2)}99`;
+  }
+
+  return `${hex}99`;

Review Comment:
   Good catch, `forceHexAlpha` now expands shorthand hex (#rgb/#rgba) before 
appending the alpha byte, so we don't end up with an invalid 5-digit color like 
#fff99.



-- 
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

To unsubscribe, e-mail: [email protected]

For queries about this service, please contact Infrastructure at:
[email protected]


---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]

Reply via email to