refactor: modify return type of getRGBFromHex

majority-elite · Aug 16, 2024 · e843cba · e843cba
1 parent 552f5b4
commit e843cba
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 6 deletions.
diff --git a/app/styles/theme.css.ts b/app/styles/theme.css.ts
@@ -1,10 +1,18 @@
 import { createGlobalTheme } from '@vanilla-extract/css';
 import { getRGBFromHex } from '@/utils/style';
 
-const getColorVarsFromHex = (hex: string) => ({
-  hex,
-  rgb: getRGBFromHex(hex).join(', '),
-});
+type ColorVars = {
+  hex: string;
+  rgb: string;
+};
+
+const getColorVarsFromHex = (hex: string): ColorVars => {
+  const { r, g, b } = getRGBFromHex(hex);
+  return {
+    hex,
+    rgb: `${r}, ${g}, ${b}`,
+  };
+};
 
 export const themeVars = createGlobalTheme(':root', {
   color: {

diff --git a/app/utils/style.ts b/app/utils/style.ts
@@ -25,10 +25,16 @@ export const getMediaQuery = (
 export const getRGBFromHex = (hex: string) => {
   const hexToConvert = hex.replace('#', '');
   const aRgbHex = hexToConvert.match(/.{1,2}/g);
+
   if (aRgbHex === null) {
-    return [0, 0, 0];
+    return { r: 0, g: 0, b: 0 };
   }
-  return [aRgbHex[0], aRgbHex[1], aRgbHex[2]].map((item) => parseInt(item, 16));
+
+  return {
+    r: parseInt(aRgbHex[0], 16),
+    g: parseInt(aRgbHex[1], 16),
+    b: parseInt(aRgbHex[2], 16),
+  };
 };
 
 export const rgba = (cssVar: string, alpha: number) =>