fix: Display Nutriscore again

.gitignore

@@ -19,6 +19,8 @@
 .DS_Store
 *.pem
 .icloud
+*.icloud
+*/*.icloud
 
 # debug
 npm-debug.log*

package-lock.json

@@ -15,7 +15,7 @@
         "@types/react-dom": "18.2.7",
         "eslint-config-sznm": "^2.0.2",
         "jest-worker": "^29.6.2",
-        "million": "^2.5.13",
+        "million": "^2.6.4",
         "next": "13.4.16",
         "next-intl": "^2.19.1",
         "next-pwa": "^5.6.0",
@@ -3450,18 +3450,6 @@
         "@babel/core": "^7.0.0-0"
       }
     },
-    "node_modules/babel-plugin-transform-react-createelement-to-jsx": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/babel-plugin-transform-react-createelement-to-jsx/-/babel-plugin-transform-react-createelement-to-jsx-1.1.0.tgz",
-      "integrity": "sha512-43xMHy06ARCmF8UKte/9OJ+gp5bh51UoUe5SYTSBh3zFtcjxzCTzwKyGv8uOWGQNYrrPAl6iyynxARSXDCXoNA==",
-      "dependencies": {
-        "@babel/plugin-syntax-jsx": "^7.0.0",
-        "@babel/polyfill": "^7.0.0"
-      },
-      "engines": {
-        "node": ">=0.12"
-      }
-    },
     "node_modules/balanced-match": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
@@ -6452,23 +6440,41 @@
       }
     },
     "node_modules/million": {
-      "version": "2.5.13",
-      "resolved": "https://registry.npmjs.org/million/-/million-2.5.13.tgz",
-      "integrity": "sha512-6PiH6D9zPOi7Ba2NMtxZJHL7LBoIy11iM7sNeqNpqiHq44Rzu+yYyvIjYIrOL5QVdxBif+FrUTpeWWPIAsYuXg==",
+      "version": "2.6.4",
+      "resolved": "https://registry.npmjs.org/million/-/million-2.6.4.tgz",
+      "integrity": "sha512-voUkdd/jHWrG+7NS+mX49Pat+POKdgGW78V7pYMSrTaOjUitR6ySEcAci8hn17Rsx1IMI3+5w41dkADM1J1ZEg==",
       "dependencies": {
         "@babel/core": "^7.21.0",
         "@babel/generator": "^7.22.7",
         "@babel/plugin-syntax-jsx": "^7.21.4",
         "@babel/plugin-syntax-typescript": "^7.21.4",
         "@babel/types": "^7.21.3",
-        "babel-plugin-transform-react-createelement-to-jsx": "^1.1.0",
         "kleur": "^4.1.5",
+        "rollup": "^3.28.0",
         "unplugin": "^1.3.1"
       },
+      "bin": {
+        "million": "packages/cli/dist/index.js"
+      },
       "funding": {
         "url": "https://github.com/sponsors/aidenybai"
       }
     },
+    "node_modules/million/node_modules/rollup": {
+      "version": "3.29.4",
+      "resolved": "https://registry.npmjs.org/rollup/-/rollup-3.29.4.tgz",
+      "integrity": "sha512-oWzmBZwvYrU0iJHtDmhsm662rC15FRXmcjCk1xD771dFDx5jJ02ufAQQTn0etB2emNk4J9EZg/yWKpsn9BWGRw==",
+      "bin": {
+        "rollup": "dist/bin/rollup"
+      },
+      "engines": {
+        "node": ">=14.18.0",
+        "npm": ">=8.0.0"
+      },
+      "optionalDependencies": {
+        "fsevents": "~2.3.2"
+      }
+    },
     "node_modules/mime-db": {
       "version": "1.52.0",
       "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.52.0.tgz",

package.json

@@ -18,7 +18,7 @@
     "@types/react-dom": "18.2.7",
     "eslint-config-sznm": "^2.0.2",
     "jest-worker": "^29.6.2",
-    "million": "^2.5.13",
+    "million": "^2.6.4",
     "next": "13.4.16",
     "next-intl": "^2.19.1",
     "next-pwa": "^5.6.0",

src/components/check.tsx

@@ -1,4 +1,3 @@
-
 import VeganCheck from "@frontendnetwork/vegancheck";
 import Image from "next/image";
 import { useTranslations } from "next-intl";
@@ -6,34 +5,24 @@ import React, { useState, useEffect, useRef } from "react";
 
 import ModalWrapper from "@/components/elements/modalwrapper";
 import ShareButton from "@/components/elements/share";
+import { ErrorResponse } from "@/models/ErrorRepsonse";
+import { ProductResult } from "@/models/ProductResults";
+import { Sources } from "@/models/Sources";
 
 import Scan from "./Scanner/scanner";
 
-interface ProductResult {
-  productname?: string;
-  vegan?: string;
-  vegetarian?: string;
-  animaltestfree?: string;
-  palmoil?: string;
-  nutriscore?: string;
-  grade?: string;
-}
-
-interface Sources {
-  api?: string;
-  baseuri?: string;
-}
-
-interface ErrorResponse {
-  response: {
-    status: number;
-  };
-}
-
-const ProductSearch: React.FC = () => {
+const ProductSearch = () => {
   const t = useTranslations("Check");
   const formRef = useRef<HTMLFormElement>(null);
-  const [result, setResult] = useState<ProductResult>({});
+  const [result, setResult] = useState<ProductResult>({
+    productname: "",
+    vegan: "n/a",
+    vegetarian: "n/a",
+    animaltestfree: "n/a",
+    palmoil: "n/a",
+    nutriscore: "",
+    grade: "",
+  });
   const [sources, setSources] = useState<Sources>({});
   const [barcode, setBarcode] = useState<string>("");
   const [showFound, setShowFound] = useState<boolean>(false);
@@ -61,12 +50,17 @@ const ProductSearch: React.FC = () => {
     setShowFound(false);
     setShowNotFound(false);
     setShowInvalid(false);
-  
+
     setLoading(true);
+
     try {
-      const data = await VeganCheck.getProductByBarcode(barcode, process.env.NEXT_PUBLIC_STAGING === "true" ? true : false);
+      const data = await VeganCheck.getProductByBarcode(
+        barcode,
+        process.env.NEXT_PUBLIC_STAGING === "true"
+      );
       setLoading(false);
       if (data.status === 200) {
+        console.log(data.product);
         setResult(data.product);
         setSources(data.sources);
         setShowFound(true);
@@ -80,16 +74,15 @@ const ProductSearch: React.FC = () => {
       }
     } catch (error) {
       if (
-        typeof error === 'object' &&
+        typeof error === "object" &&
         error !== null &&
-        'response' in error &&
-        'status' in (error as ErrorResponse).response
+        "response" in error &&
+        "status" in (error as ErrorResponse).response
       ) {
         if ((error as ErrorResponse).response.status == 400) {
           setShowInvalid(true);
           setShowTimeout(false);
-        }
-        else if ((error as ErrorResponse).response.status == 404) {
+        } else if ((error as ErrorResponse).response.status == 404) {
           setShowNotFound(true);
           setShowTimeout(false);
         }
@@ -108,30 +101,30 @@ const ProductSearch: React.FC = () => {
 
   const productname = result.productname === "n/a" ? "?" : result.productname;
   let vegan = "unknown icon-help";
-  if (result.vegan === "true") {
+  if (result.vegan === true) {
     vegan = "vegan icon-ok";
-  } else if (result.vegan === "false") {
+  } else if (result.vegan === false) {
     vegan = "non-vegan icon-cancel";
   }
 
   let vegetarian = "unknown icon-help";
-  if (result.vegetarian === "true") {
+  if (result.vegetarian === true) {
     vegetarian = "vegan icon-ok";
-  } else if (result.vegetarian === "false") {
+  } else if (result.vegetarian === false) {
     vegetarian = "non-vegan icon-cancel";
   }
 
   let animaltestfree = "unknown icon-help";
-  if (result.animaltestfree === "true") {
+  if (result.animaltestfree === true) {
     animaltestfree = "vegan icon-ok";
-  } else if (result.animaltestfree === "false") {
+  } else if (result.animaltestfree === false) {
     animaltestfree = "non-vegan icon-cancel";
   }
 
   let palmoil = "unknown icon-help";
-  if (result.palmoil === "true") {
+  if (result.palmoil === true) {
     palmoil = "non-vegan icon-cancel";
-  } else if (result.palmoil === "false") {
+  } else if (result.palmoil === false) {
     palmoil = "vegan icon-ok";
   }
 
@@ -142,15 +135,15 @@ const ProductSearch: React.FC = () => {
 
   if (nutriscore === "n/a") {
     nutriscore = "unknown icon-help";
-  } else if (nutriscore === "a") {
+  } else if (nutriscore === "a" || nutriscore === "A") {
     nutriscore = "nutri_a icon-a";
-  } else if (nutriscore === "b") {
+  } else if (nutriscore === "b" || nutriscore === "B") {
     nutriscore = "nutri_b icon-b";
-  } else if (nutriscore === "c") {
+  } else if (nutriscore === "c" || nutriscore === "C") {
     nutriscore = "nutri_c icon-c";
-  } else if (nutriscore === "d") {
+  } else if (nutriscore === "d" || nutriscore === "D") {
     nutriscore = "nutri_d icon-d";
-  } else if (nutriscore === "e") {
+  } else if (nutriscore === "e" || nutriscore === "E") {
     nutriscore = "nutri_e icon-e";
   }
 
@@ -486,9 +479,7 @@ const ProductSearch: React.FC = () => {
                 </div>
               </div>
               <div className="Grid">
-                <div className="Grid-cell description skeleton">
-                  Grade
-                </div>
+                <div className="Grid-cell description skeleton">Grade</div>
                 <div className="Grid-cell icons skeleton">
                   <span className="icon-help"></span>
                 </div>

src/models/ErrorRepsonse.ts

@@ -0,0 +1,5 @@
+export type ErrorResponse = {
+  response: {
+    status: number;
+  };
+};

src/models/ProductResults.ts

@@ -0,0 +1,9 @@
+export type ProductResult = {
+  productname: string;
+  vegan: boolean | "n/a" | undefined;
+  vegetarian: boolean | "n/a" | undefined;
+  animaltestfree: boolean | "n/a" | undefined;
+  palmoil: boolean | "n/a" | undefined;
+  nutriscore?: string;
+  grade?: string;
+};

src/models/Sources.ts

@@ -0,0 +1,4 @@
+export type Sources = {
+  api?: string;
+  baseuri?: string;
+};