feat: Support 2 letters code four countries (#938)

* feat: Support 2 letters code four countries

* fix

src/pages/eco-score/index.tsx

@@ -15,6 +15,7 @@ import Loader from "../loader";
 import { useSearchParams } from "react-router-dom";
 import { localSettings } from "../../localeStorageManager";
 import countryNames from "../../assets/countries.json";
+import { getCountryId } from "../../utils/getCountryId";
 
 const ecoScoreCards = [
   {
@@ -154,7 +155,7 @@ export default function EcoScore() {
   const localData = localSettings.fetch();
   const [searchParams, setSearchParams] = useSearchParams();
   const [selectedCountry, setSelectedCountry] = React.useState(
-    searchParams.get("cc") || localData["country"] || "en:france",
+    getCountryId(searchParams.get("cc")) || localData["country"] || "en:france",
   );
 
   React.useEffect(() => {

src/pages/ingredients/index.tsx

@@ -22,6 +22,7 @@ import ImageAnnotation from "./ImageAnnotation";
 import { useSearchParams } from "react-router-dom";
 import { localSettings } from "../../localeStorageManager";
 import countryNames from "../../assets/countries.json";
+import { getCountryId } from "../../utils/getCountryId";
 
 function ProductInterface(props) {
   const { product, next } = props;
@@ -143,7 +144,7 @@ export default function IngredientsPage() {
   const localData = localSettings.fetch();
   const [searchParams, setSearchParams] = useSearchParams();
   const [selectedCountry, setSelectedCountry] = React.useState(
-    searchParams.get("cc") || localData["country"] || "en:france",
+    getCountryId(searchParams.get("cc")) || localData["country"] || "en:france",
   );
 
   React.useEffect(() => {

src/utils/getCountryId.ts

@@ -0,0 +1,20 @@
+import countries from "../assets/countries.json";
+
+/**
+ * Get the country id base on the two letter id
+ */
+export function getCountryId(country: string | null) {
+  if (!country || country.length !== 2) {
+    return country;
+  }
+
+  const upperCountry = country.toUpperCase();
+  const countryObject = countries.find(
+    ({ countryCode }) => countryCode === upperCountry,
+  );
+
+  if (!countryObject || !countryObject.id) {
+    return country;
+  }
+  return countryObject.id;
+}