Upgrade deps (#137)

kitsteam · Nov 25, 2024 · 28c5103 · 28c5103
1 parent 2ec6aac
commit 28c5103
Show file tree

Hide file tree

Showing 4 changed files with 4,047 additions and 3,716 deletions.
diff --git a/package.json b/package.json
@@ -25,8 +25,8 @@
     "clipboardy": "^2.3.0",
     "dequal": "^2.0.2",
     "file-saver": "^2.0.5",
-    "i18next": "^22.4.9",
-    "i18next-browser-languagedetector": "^6.1.2",
+    "i18next": "^22.5.1",
+    "i18next-browser-languagedetector": "^6.1.8",
     "jspdf": "^2.5.1",
     "jszip": "^3.7.1",
     "konva": "^8.4.3",
@@ -43,6 +43,9 @@
     "uuid": "^9.0.0",
     "web-vitals": "^1.0.1"
   },
+  "resolutions": {
+    "cheerio": "1.0.0-rc.12"
+  },
   "scripts": {
     "start": "react-scripts start",
     "build": "LAYOUT=element craco build",

diff --git a/src/data/colors.ts b/src/data/colors.ts
@@ -25,19 +25,33 @@ export const borderColors = ["#f44336", "#e91e63", "#9c27b0", "#673ab7", "#3f51b
 export const backgroundColors = ["transparent", "#ffffff", "#f44336", "#e91e63", "#9c27b0", "#673ab7", "#3f51b5", "#2196f3", "#03a9f4", "#00bcd4", "#009688", "#4caf50", "#8bc34a", "#cddc39", "#ffeb3b", "#ffc107", "#ff9800", "#ff5722", "#795548", "#607d8b"];
 
 export enum SkinColor {
-    white = '#F5E5DE' as any,
-    black = '#A65C17' as any,
-    assian = '#F4ECAD' as any,
-    mulatto = '#E3AB72' as any,
-    aztec = '#CF9D7C' as any,
+    white = '#F5E5DE',
+    black = '#A65C17',
+    assian = '#F4ECAD',
+    mulatto = '#E3AB72',
+    aztec = '#CF9D7C',
 };
 
+export type SkinColorKeys = keyof typeof SkinColor;
+
+export const skinColorReverseMapping = (color: SkinColor): SkinColorKeys | undefined => {
+  const result = (Object.keys(SkinColor) as SkinColorKeys[]).find(key => SkinColor[key] === color);
+  return result;
+}
+
 export enum HairColor {
-    brown = '#A65E26' as any,
-    blonde = '#FDD700' as any,
-    red = '#ED4120' as any,
-    black = '#020100' as any,
-    gray = '#E1E1E1' as any,
-    darkGray = '#AAABAB' as any,
-    darkBrown = '#6A2703' as any,
+    brown = '#A65E26',
+    blonde = '#FDD700',
+    red = '#ED4120',
+    black = '#020100',
+    gray = '#E1E1E1',
+    darkGray = '#AAABAB',
+    darkBrown = '#6A2703',
+}
+
+export type HairColorKeys = keyof typeof HairColor;
+
+export const hairColorReverseMapping = (color: HairColor): HairColorKeys | undefined => {
+  const result = (Object.keys(HairColor) as HairColorKeys[]).find(key => HairColor[key] === color);
+  return result;
 }
diff --git a/src/hooks/network.ts b/src/hooks/network.ts
@@ -1,7 +1,7 @@
 import { useMemo } from "react";
 import useSWR from 'swr';
 import { Resolution } from "../components/PictogramConfigurator/state";
-import { HairColor, SkinColor } from "../data/colors";
+import { HairColor, hairColorReverseMapping, SkinColor, skinColorReverseMapping } from "../data/colors";
 
 export const apiBaseUrl = process.env.REACT_APP_API || 'https://api.arasaac.org/api';
 export const apiIdentifierBaseUrl = process.env.REACT_APP_API_IMAGES || 'https://static.arasaac.org/images';
@@ -134,8 +134,10 @@ export function getPictogramUrl(pictogramId: number, colorized: boolean, resolut
     url.searchParams.append('download', 'false');
     url.searchParams.append('color', colorized.toString());
     url.searchParams.append('resolution', resolution.toString());
-    url.searchParams.append('skin', SkinColor[skinColor]);
-    url.searchParams.append('hair', HairColor[hairColor]);
+    const skinColorMapped = skinColorReverseMapping(skinColor);
+    if(skinColorMapped) url.searchParams.append('skin', skinColorMapped);
+    const hairColorMapped = hairColorReverseMapping(hairColor);
+    if(hairColorMapped) url.searchParams.append('hair', hairColorMapped);
 
     return url;
 }