update contact recipe headline to display "meal of name"

client/src/components/Meals/MealDetailView.jsx

@@ -12,6 +12,7 @@ import { useAuth0 } from "@auth0/auth0-react";
 import MealImportButton from "./MealImportButton";
 import { useLocation, useNavigate, useParams } from "react-router-dom";
 import PlanMealButton from "../util/PlanMealButton";
+import { getUserById } from "../Settings/settings.util";
 
 const useStyles = makeStyles((theme) => ({
   content: {
@@ -40,8 +41,8 @@ const MealDetailView = () => {
 
   const [own, setOwn] = useState(false);
   const [meal, setMeal] = useState();
+  const [nameOfOtherUser, setNameOfOtherUser] = useState(null);
   const [comingFromPlans, setComingFromPlans] = useState(false);
-  // const [/*mealUser*/, setMealUser] = useState(null);
 
   /*  useEffect(() => {
       if (meal) {
@@ -55,6 +56,12 @@ const MealDetailView = () => {
     } else {
       setOwn(false);
     }
+    if (!own && meal && meal.userId) {
+      getUserById(meal.userId, (user) => {
+        console.log(user);
+        setNameOfOtherUser(user && user.user_metadata && user.user_metadata.username ? user.user_metadata.username : user.given_name);
+      });
+    }
   }, [user, meal]);
 
   // set the meal that is given in state as a temporary option while the one from the server is loaded
@@ -96,7 +103,10 @@ const MealDetailView = () => {
     <>
       {meal ?
         <>
-          <Navbar secondary={!own} pageTitle={t('Meal')} rightSideComponent={rightSideComponent()} leftSideComponent={isAuthenticated && <BackButton onClick={goBack} />} />
+          <Navbar secondary={!own}
+                  pageTitle={own || !nameOfOtherUser ? t('Meal') : t('Meal of {{name}}', { name: nameOfOtherUser })}
+                  rightSideComponent={rightSideComponent()}
+                  leftSideComponent={isAuthenticated && <BackButton onClick={goBack} />} />
           <Box className={classes.content}>
             <Grid container spacing={0} justifyContent="space-between" alignItems="flex-start" wrap="nowrap">
               <Grid item xs className={classes.mealTitle}>

client/src/translations/_example.translation.json

@@ -111,5 +111,6 @@
   "LOADING_IMAGES_TAKES_LONG": "",
   "Add without images": "",
   "Save without new images": "",
+  "Meal of {{name}}": "",
   "": ""
 }

client/src/translations/de.translation.json

@@ -112,5 +112,6 @@
   "OK": "OK",
   "LOADING_IMAGES_TAKES_LONG": "Es scheint etwas zu dauern, die Bilder zu laden. Sie können warten oder das Gericht ohne diese Bilder hinzufügen.",
   "Add without images": "Ohne Bilder hinzufügen",
-  "Save without new images": "Ohne neue Bilder speichern"
+  "Save without new images": "Ohne neue Bilder speichern",
+  "Meal of {{name}}": "Gericht von {{name}}"
 }

client/src/translations/en-GB.translation.json

@@ -111,5 +111,6 @@
   "OK": "OK",
   "LOADING_IMAGES_TAKES_LONG": "It seems to take a while to load the images. You can wait or add the dish without these images.",
   "Add without images": "Add without images",
-  "Save without new images": "Save without new images"
+  "Save without new images": "Save without new images",
+  "Meal of {{name}}": "{{name}}'s Meal"
 }

client/src/translations/en-US.translation.json

@@ -111,5 +111,6 @@
   "OK": "OK",
   "LOADING_IMAGES_TAKES_LONG": "It seems to take a while to load the images. You can wait or add the dish without these images.",
   "Add without images": "Add without images",
-  "Save without new images": "Save without new images"
+  "Save without new images": "Save without new images",
+  "Meal of {{name}}": "{{name}}'s Meal"
 }

client/src/translations/es.translation.json

@@ -111,5 +111,6 @@
   "OK": "OK",
   "LOADING_IMAGES_TAKES_LONG": "Parece que tarda un poco en cargar las fotos. Puedes esperar o añadir la comida sin estas fotos.",
   "Add without images": "Añadir sin imágenes",
-  "Save without new images": "Guardar sin imágenes nuevas"
+  "Save without new images": "Guardar sin imágenes nuevas",
+  "Meal of {{name}}": "Comida de {{name}}"
 }

client/src/translations/fr-FR.translation.json

@@ -111,5 +111,6 @@
   "OK": "OK",
   "LOADING_IMAGES_TAKES_LONG": "Il semble que le chargement des images prenne un peu de temps. Vous pouvez attendre ou ajouter le repas sans ces images.",
   "Add without images": "Ajouter sans images",
-  "Save without new images": "Sauvegarder sans nouvelles images"
+  "Save without new images": "Sauvegarder sans nouvelles images",
+  "Meal of {{name}}": "Repas de {{name}}"
 }

client/src/translations/it.translation.json

@@ -111,5 +111,6 @@
   "OK": "OK",
   "LOADING_IMAGES_TAKES_LONG": "Sembra che ci voglia un po' di tempo per caricare le immagini. Puoi aspettare o aggiungere il piatto senza queste immagini.",
   "Add without images": "Aggiungi senza immagini",
-  "Save without new images": "Salva senza nuove immagini"
+  "Save without new images": "Salva senza nuove immagini",
+  "Meal of {{name}}": "Piatto di {{name}}"
 }

client/src/translations/jp.translation.json

@@ -111,5 +111,6 @@
   "OK": "OK",
   "LOADING_IMAGES_TAKES_LONG": "写真を読み込むのに時間がかかるようです。お待ちいただくか、写真なしでお料理を追加してください。",
   "Add without images": "写真なしで追加",
-  "Save without new images": "新規画像なしで保存する"
+  "Save without new images": "新規画像なしで保存する",
+  "Meal of {{name}}": "{{name}}のレシピ"
 }