diff --git a/src/assets/countries.json b/src/assets/countries.json index 4987938ec..91e69b3d6 100644 --- a/src/assets/countries.json +++ b/src/assets/countries.json @@ -1485,7 +1485,7 @@ "id": "en:world", "label": "World", "languageCode": "en", - "countryCode": "world" + "countryCode": "" }, { "id": "en:yemen", diff --git a/src/components/ResponsiveAppBar.jsx b/src/components/ResponsiveAppBar.jsx index d991f7385..07da99c1c 100644 --- a/src/components/ResponsiveAppBar.jsx +++ b/src/components/ResponsiveAppBar.jsx @@ -413,21 +413,22 @@ const ResponsiveAppBar = () => { }} > c.countryCode)); export function CountryProvider({ children }) { - const [country, setCountry] = useLocalStorageState("country", "world"); + const [country, setCountry] = useLocalStorageState("country", ""); const [searchParams, setSearchParams] = useSearchParams(); const searchParamsCountry = searchParams.get("country")?.toLowerCase(); @@ -26,9 +26,16 @@ export function CountryProvider({ children }) { ); const value = React.useMemo(() => { - const lowercasedCountry = ( - ValidCountryCodes.has(searchParamsCountry) ? searchParamsCountry : country - )?.toLocaleLowerCase(); + // Try from: + // - searchParams + // - localStorage + // - empty + + const lowercasedCountry = ValidCountryCodes.has(searchParamsCountry) + ? searchParamsCountry + : ValidCountryCodes.has(country?.toLocaleLowerCase()) + ? country?.toLocaleLowerCase() + : ""; return { country: lowercasedCountry, diff --git a/src/pages/nutrition/Instructions.tsx b/src/pages/nutrition/Instructions.tsx new file mode 100644 index 000000000..beec4202a --- /dev/null +++ b/src/pages/nutrition/Instructions.tsx @@ -0,0 +1,99 @@ +/* eslint-disable react/no-unescaped-entities */ +import * as React from "react"; +import Button from "@mui/material/Button"; +import Dialog from "@mui/material/Dialog"; +import DialogActions from "@mui/material/DialogActions"; +import DialogContent from "@mui/material/DialogContent"; +import DialogContentText from "@mui/material/DialogContentText"; +import DialogTitle from "@mui/material/DialogTitle"; +import Typography from "@mui/material/Typography"; + +export default function Instructions() { + const [open, setOpen] = React.useState(false); + + const handleClickOpen = () => { + setOpen(true); + }; + + const handleClose = () => { + setOpen(false); + }; + + return ( + + + + + Comment utiliser cette interface + + + + + Avec les checkbox du haut, vous pouvez choisir entre traiter des + tableux de produit sans tableau nutritionel. Ou traiter des + produits pour lequels robotoof à trouver des nutriments en plus. + + + La date de la photo est affichée au dessus de la photo. + + + Les nutriments déjà associé au produit sont affiché en petit sous + les inputs. +
    +
  1. + En vert pour ceux qui + matchent avec la valeur du champ +
  2. +
  3. + En orange si le champ + est vide +
  4. +
  5. + En rouge si le champ est + différent de la valeur connue. +
  6. +
+ La valeur "-" indique une valeur abscente du tableau nutritionel. + Particulierement utile pour les fibres qui sont souvent abscente. +
+ + Quand une colone a été vérifiée (celle pour 100g ou celle par + portion) il ne vous reste plus qu'à la valider pour passer à la + suite. Innutil de remplir les deux colones. Une seul des deux peut + être enregistrée par OFF. + + +
    +
  • + Le bouton "skip" passe à la suite. quelqu'un d'autre s'en + chargera. +
  • +
  • + Le bouton "invalid image" indique que la photo ne correspond pas + à un tableau nutritionel, et supprime la question pour tout le + monde. +
  • +
+
+
+ + + +
+
+ ); +} diff --git a/src/pages/nutrition/NutrimentCell.tsx b/src/pages/nutrition/NutrimentCell.tsx index 696a37261..2168d85ea 100644 --- a/src/pages/nutrition/NutrimentCell.tsx +++ b/src/pages/nutrition/NutrimentCell.tsx @@ -14,6 +14,35 @@ interface NutrimentCellProps { setValues: (object) => void; } +/** + * Returns the string value of the input without any space. + */ +function clean(input: undefined | string | null | number): string { + if (input == undefined) { + return ""; + } + return `${input}`.replaceAll(" ", ""); +} +function getLegendColor(product, prediction, nutrimentId) { + const cleanProduct = clean(product); + const cleanPrediction = clean(prediction); + + console.log({ nutrimentId, cleanProduct, cleanPrediction }); + + if (cleanProduct === cleanPrediction) { + return "green"; + } + + if (cleanProduct === "" || cleanPrediction === "") { + return "orange"; + } + + if (cleanProduct !== cleanPrediction) { + return "red"; + } + return undefined; +} + export const NutrimentCell = (props: NutrimentCellProps) => { const { nutrimentId, @@ -64,17 +93,33 @@ export const NutrimentCell = (props: NutrimentCellProps) => { />
{displayOFFValue && ( - - {productValue} - {productUnit} + + + {productValue} + + + {productUnit} + )} - {isValidUnit(unit) ? (