add delete account option

add images loading to add and edit meal
minor fixes

client/docs/asset-manifest.json

@@ -1,6 +1,6 @@
 {
   "files": {
-    "main.js": "/build/main.7eb53e3c.js",
+    "main.js": "/build/main.bc19a037.js",
     "runtime-main.js": "/build/bundle.f0f5edae.js",
     "build/2.80735149.js": "/build/2.80735149.js",
     "build/2.80735149.js.LICENSE.txt": "/build/2.80735149.js.LICENSE.txt",
@@ -10,6 +10,6 @@
   "entrypoints": [
     "build/bundle.f0f5edae.js",
     "build/2.80735149.js",
-    "build/main.7eb53e3c.js"
+    "build/main.bc19a037.js"
   ]
 }

client/docs/index.html

@@ -10,6 +10,6 @@
     <div id="rsg-root"></div>
     <script src="build/bundle.f0f5edae.js"></script>
     <script src="build/2.80735149.js"></script>
-    <script src="build/main.7eb53e3c.js"></script>
+    <script src="build/main.bc19a037.js"></script>
   </body>
 </html>

client/package.json

@@ -44,7 +44,8 @@
     "test": "react-scripts test",
     "eject": "react-scripts eject",
     "styleguide": "styleguidist server",
-    "styleguide:build": "styleguidist build"
+    "styleguide:build": "styleguidist build",
+    "docs": "styleguidist build"
   },
   "eslintConfig": {
     "extends": [

client/src/components/Buttons/DeleteAccountButton.jsx

@@ -0,0 +1,98 @@
+import React, { useState } from 'react';
+import { Button, Dialog, DialogTitle, DialogActions, DialogContent, DialogContentText, CircularProgress } from '@material-ui/core';
+import { makeStyles } from '@material-ui/styles';
+import { useTranslation } from "react-i18next";
+import { deleteUser } from "../Settings/settings.util";
+import { useAuth0 } from "@auth0/auth0-react";
+
+const useStyles = makeStyles(theme => ({
+  logoutButton: {
+    minWidth: '10rem',
+    maxWidth: '60%',
+    margin: '1.5em auto',
+    display: "block",
+    backgroundColor: theme.palette.error.main,
+    color: theme.palette.error.contrastText,
+    '&:hover': {
+      backgroundColor: theme.palette.error.dark,
+    }
+  },
+  confirmDeletionButton: {
+    backgroundColor: theme.palette.error.main,
+    color: theme.palette.error.contrastText,
+    '&:hover': {
+      backgroundColor: theme.palette.error.dark,
+    }
+  }
+}));
+
+const logoutRedirect = process.env.REACT_APP_LOGOUT_REDIRECT;
+
+/** Login button including logout logic */
+const DeleteAccountButton = () => {
+  const classes = useStyles();
+  const { t } = useTranslation();
+  const { user, logout } = useAuth0();
+
+  const [confirmDeletionDialogOpen, setConfirmDeletionDialogOpen] = useState(false);
+  const [confirmationDialogOpen, setConfirmationDialogOpen] = useState(false);
+  const [deletionInProgress, setDeletionInProgress] = useState(false);
+
+  const openConfirmDeletionDialog = () => {
+    setConfirmDeletionDialogOpen(true);
+  }
+  const closeConfirmDeletionDialog = () => {
+    setConfirmDeletionDialogOpen(false);
+  }
+
+  const openConfirmationDialog = () => {
+    setConfirmationDialogOpen(true);
+  }
+  const closeConfirmationDialog = () => {
+    setConfirmationDialogOpen(false);
+  }
+
+  const deleteAccount = () => {
+    if (user) {
+      setDeletionInProgress(true);
+      closeConfirmDeletionDialog();
+      deleteUser(user.sub, () => {
+        openConfirmationDialog();
+        setDeletionInProgress(false);
+      });
+    }
+  }
+
+  const finalLogout = () => {
+    logout({ returnTo: logoutRedirect });
+  };
+
+  return (
+    <>
+      <Button variant="contained" size="large" className={classes.logoutButton} onClick={openConfirmDeletionDialog}>
+        {t('Delete Account')}
+      </Button>
+      <Dialog open={confirmDeletionDialogOpen} onClose={closeConfirmDeletionDialog}>
+        <DialogTitle>{t('Are you sure you want to delete your Emealay Account?')}</DialogTitle>
+        <DialogContent><DialogContentText>{t('This cannot be undone.')}</DialogContentText></DialogContent>
+        <DialogActions style={{ justifyContent: 'space-between' }}>
+          <Button variant="outlined" onClick={closeConfirmDeletionDialog}>{t('No, cancel.')}</Button>
+          <Button className={classes.confirmDeletionButton} onClick={deleteAccount}>{t('Yes, delete my account for good.')}</Button>
+        </DialogActions>
+      </Dialog>
+      <Dialog open={deletionInProgress} disableBackdropClick>
+        <DialogTitle>{t('Your account is being deleted')}</DialogTitle>
+        <DialogContent><CircularProgress /></DialogContent>
+      </Dialog>
+      <Dialog open={confirmationDialogOpen} onClose={closeConfirmationDialog} onBackdropClick={finalLogout}>
+        <DialogTitle>{t('Your Account has been deleted')}</DialogTitle>
+        <DialogContent><DialogContentText>{t('You will be logged out now.')}</DialogContentText></DialogContent>
+        <DialogActions>
+          <Button onClick={finalLogout}>{t('OK')}</Button>
+        </DialogActions>
+      </Dialog>
+    </>
+  );
+}
+
+export default DeleteAccountButton;

client/src/components/Buttons/LogoutButton.jsx

@@ -10,10 +10,6 @@ const useStyles = makeStyles(theme => ({
     maxWidth: '60%',
     margin: '1.5em auto',
     display: "block",
-    backgroundColor: theme.palette.error.main,
-    '&:hover': {
-      backgroundColor: theme.palette.error.dark,
-    }
   },
 }));
 
@@ -26,7 +22,7 @@ const LogoutButton = () => {
   const { t } = useTranslation();
 
   return (
-    <Button color="secondary" variant="contained" size="large" className={classes.logoutButton} onClick={() => logout({ returnTo: logoutRedirect})}>
+    <Button color="secondary" variant="outlined" size="large" className={classes.logoutButton} onClick={() => logout({ returnTo: logoutRedirect})}>
       {t('Logout')}
     </Button>
   );

client/src/components/Images/ImageUpload.jsx

@@ -1,4 +1,4 @@
-import React, { useState } from 'react';
+import React, { useState, useEffect } from 'react';
 import PhotoDropzone from './PhotoDropzone';
 import ImageGrid from './ImageGrid.jsx';
 import axios from "axios";
@@ -98,7 +98,7 @@ const useStyles = makeStyles((theme) => ({
 const ImageUpload = (props) => {
   const classes = useStyles();
 
-  const { uploadedImages, category, categoryId, onChangeUploadedImages, multiple, imageName, useSingleUploadOverlay, tags } = props;
+  const { uploadedImages, category, categoryId, onChangeUploadedImages, multiple, imageName, useSingleUploadOverlay, tags, setLoading } = props;
   const altText = imageName || category;
 
   const [photosToUpload, setPhotosToUpload] = useState([]);
@@ -124,6 +124,11 @@ const ImageUpload = (props) => {
     }
   };
 
+  useEffect(() => {
+    if (setLoading) setLoading(photosToUpload.length > 0);
+    // eslint-disable-next-line
+  }, [photosToUpload]);
+
   const uploadImages = (imagesToUpload) => {
     console.log('trying to upload images', imagesToUpload, ' to ', serverURL);
     setPhotosToUpload(imagesToUpload);
@@ -162,8 +167,6 @@ const ImageUpload = (props) => {
   }
 
   const deleteImage = (image) => {
-    console.log('trying to Reset Image', image);
-
     axios.post(serverURL + "/images/deleteImage", image)
          .then(res => {
            console.log('result of deleting planItem image', res);
@@ -263,6 +266,8 @@ ImageUpload.propTypes = {
   tags: array,
   /** overlay single image upload area with a transparent camera icon */
   useSingleUploadOverlay: bool,
+  /** this is a function to update the state of the calling component. It will receive false, if all images have been uploaded, and true otherwise */
+  setLoading: func,
 }
 
 ImageUpload.defaultProps = {
@@ -270,6 +275,7 @@ ImageUpload.defaultProps = {
   uploadedImages: [],
   tags: [],
   useSingleUploadOverlay: false,
+  setLoading: undefined,
 }
 
 export default ImageUpload;

client/src/components/Meals/AddMeal.jsx

@@ -52,6 +52,7 @@ const AddMeal = (props) => {
   }, [user]);
 
   const [meal, setMeal] = useState(emptyMeal);
+  const [loading, setLoading] = useState(false);
 
   const updateMeal = (key, value) => {
     setMeal(prevState => ({
@@ -72,11 +73,11 @@ const AddMeal = (props) => {
           deleteAllImagesFromMeal(meal._id);
         }
         history.goBack();
-      }} />} rightSideComponent={meal.title ? <DoneButton onClick={addNewMeal} /> : null} />
+      }} />} rightSideComponent={meal.title && !loading ? <DoneButton onClick={addNewMeal} /> : null} />
 
       <form noValidate onSubmit={addNewMeal} className={classes.form}>
-        <EditMealCore updateMeal={updateMeal} meal={meal} autoFocusFirstInput />
-        <Button type="submit" disabled={!meal.title} className={classes.submitButton} variant='contained' color='primary'>{t('Add')}</Button>
+        <EditMealCore updateMeal={updateMeal} meal={meal} autoFocusFirstInput setImagesLoading={setLoading} />
+        <Button type="submit" disabled={!meal.title || loading} className={classes.submitButton} variant='contained' color='primary'>{t('Add')}</Button>
       </form>
 
     </>

client/src/components/Meals/EditMeal.jsx

@@ -47,6 +47,7 @@ const EditMeal = (props) => {
   const { closeDialog, onDoneEditing, onDoneDelete, meal: givenMeal, open } = props;
 
   const [meal, setMeal] = useState(givenMeal);
+  const [loading, setLoading] = useState(false);
 
   const updateMeal = (key, value) => {
     setMeal(prevState => ({
@@ -110,10 +111,10 @@ const EditMeal = (props) => {
         <FullScreenDialog open={open} onClose={closeDialog}>
           <Navbar pageTitle={t('Edit Meal')}
                   leftSideComponent={<BackButton onClick={closeDialog} />}
-                  rightSideComponent={meal.title ? <DoneButton onClick={editAndClose} /> : null}
+                  rightSideComponent={meal.title && !loading ? <DoneButton onClick={editAndClose} /> : null}
                   secondary={inverseColors} />
           <form noValidate onSubmit={editAndClose} className={classes.form}>
-            <EditMealCore updateMeal={updateMeal} meal={meal} isSecondary={inverseColors} />
+            <EditMealCore updateMeal={updateMeal} meal={meal} isSecondary={inverseColors} setImagesLoading={setLoading} />
             <Grid container spacing={0} justify="space-between" alignItems="center" wrap="nowrap" className={classes.actionButtonWrapper}>
               <Grid item xs className={classes.cancelButton}>
                 <Button type="button" color={inverseColors ? "secondary" : "primary"} variant="outlined" onClick={closeDialog}>{t('Cancel')}</Button>
@@ -122,7 +123,7 @@ const EditMeal = (props) => {
                 <DeleteButton onClick={deleteMeal} />
               </Grid>
               <Grid item xs className={classes.saveButton}>
-                <Button type="submit" disabled={!meal.title} color={inverseColors ? "secondary" : "primary"} variant="contained">{t('Save')}</Button>
+                <Button type="submit" disabled={!meal.title || loading} color={inverseColors ? "secondary" : "primary"} variant="contained">{t('Save')}</Button>
               </Grid>
             </Grid>
           </form>

client/src/components/Meals/EditMealCore.jsx

@@ -1,17 +1,19 @@
-import React, { useState } from 'react';
+import React, { useEffect, useState } from 'react';
 import { arrayOf, bool, func, shape, string } from "prop-types";
 import { useTranslation } from "react-i18next";
 import ImageUpload from "../Images/ImageUpload";
-import { withAuthenticationRequired } from "@auth0/auth0-react";
+import { useAuth0, withAuthenticationRequired } from "@auth0/auth0-react";
 import { LoadingBody } from "../Loading";
 import SelectMealCategory from "./SelectMealCategory";
 import SelectMealTags from "./SelectMealTags";
 import OutlinedTextField from "../util/OutlinedTextField";
+import { fetchAndUpdateMealsFromUser } from "./meals.util";
 
 /** component is used by AddMeal and EditMeal and provides their shared core elements: text and photo input as well as choosing a category and adding tags.
  *  Does not handle communication to server. */
 const EditMealCore = (props) => {
   const { t } = useTranslation();
+  const { user } = useAuth0();
 
   const {
     updateMeal,
@@ -26,8 +28,10 @@ const EditMealCore = (props) => {
     },
     isSecondary,
     autoFocusFirstInput,
+    setImagesLoading,
   } = props;
 
+  const [placeholder, setPlaceholder] = useState(t('Rezept, Anweisungen, Kommentare, etc.'));
   const [, updateState] = useState();
   const forceUpdate = React.useCallback(() => updateState({}), []);
 
@@ -37,6 +41,15 @@ const EditMealCore = (props) => {
     forceUpdate(); // I don't know why the component does not rerender on state change but this solution fixes it. Source: https://stackoverflow.com/questions/53215285/how-can-i-force-component-to-re-render-with-hooks-in-react
   }
 
+  useEffect(() => {
+    if (user) {
+      fetchAndUpdateMealsFromUser(user.sub, meals => {
+        if (meals.length < 3) setPlaceholder(t('You can use this field to add a recipe in text form, instructions, experience or other comments.'));
+      })
+    }
+    // eslint-disable-next-line
+  }, [user]);
+
   return (
     <>
       <OutlinedTextField name="title"
@@ -49,9 +62,9 @@ const EditMealCore = (props) => {
       <OutlinedTextField name="recipeLink" value={recipeLink} label={t('Link to Recipe')} onChange={e => updateMeal('recipeLink', e.target.value)} isSecondary={isSecondary} />
       <OutlinedTextField multiline
                          rowsMax={10}
-                         rows={3}
+                         rows={1}
                          name="comment"
-                         placeholder={t('You can use this field to add a recipe in text form, instructions, experience or other comments.')}
+                         placeholder={placeholder}
                          value={comment}
                          onChange={e => updateMeal('comment', e.target.value)}
                          isSecondary={isSecondary} />
@@ -60,7 +73,14 @@ const EditMealCore = (props) => {
 
       <SelectMealTags currentTags={tags} updateTags={(newTags) => {updateMeal('tags', newTags)}} allowCreate />
 
-      <ImageUpload multiple uploadedImages={images} category="mealImages" categoryId={mealId} onChangeUploadedImages={onChangeUploadedImages} imageName={title} tags={tags} />
+      <ImageUpload multiple
+                   uploadedImages={images}
+                   category="mealImages"
+                   categoryId={mealId}
+                   onChangeUploadedImages={onChangeUploadedImages}
+                   imageName={title}
+                   tags={tags}
+                   setLoading={setImagesLoading} />
     </>
   );
 }
@@ -86,11 +106,14 @@ EditMealCore.propTypes = {
   isSecondary: bool,
   /** whether to autofocus title input (will open keyboard on smartphones) */
   autoFocusFirstInput: bool,
+  /** this is a function to update the state of the calling component. It will receive false, if all images of the meal have been uploaded, and true otherwise */
+  setImagesLoading: func,
 }
 
 EditMealCore.defaultProps = {
   isSecondary: false,
   autoFocusFirstInput: false,
+  setImagesLoading: undefined,
 }
 
 export default withAuthenticationRequired(EditMealCore, {

client/src/components/Meals/useCategoryIcons.jsx

@@ -11,10 +11,12 @@ export default function useCategoryIcons(foreignUserId = undefined) {
   const [categoriesChanged, setCategoriesChanged] = useState(false);
 
   useEffect(() => {
-    getSettingsOfUser(userId, (settings) => {
-      setAllCategories(settings.mealCategories || []);
-      setCategoriesChanged(false);
-    });
+    if(userId) {
+      getSettingsOfUser(userId, (settings) => {
+        setAllCategories(settings.mealCategories || []);
+        setCategoriesChanged(false);
+      });
+    }
   }, [userId, categoriesChanged]);
 
   useEffect(() => {

client/src/components/Settings/EditMealCategories.jsx

@@ -93,7 +93,6 @@ ChooseIconDialog.propTypes = {
 }
 
 export function updateMealCategories(userId, categoriesToAdd, onUpdateCategories, onUpdateSettings) {
-  console.log('updating', categoriesToAdd);
   updateUserSettingsForCategory(userId, 'mealCategories', categoriesToAdd, (setting) => {
     if (onUpdateSettings) onUpdateSettings(setting);
     if (onUpdateCategories) onUpdateCategories(setting.mealCategories);
@@ -118,7 +117,6 @@ const EditMealCategories = (props) => {
     if (user) {
       const userId = user.sub;
       getSettingsOfUser(userId, (settings) => {
-        console.log('getting categories from settings', settings.mealCategories);
         setCategories(settings.mealCategories || []);
       }); // categories must not be empty!
     }

client/src/components/Settings/EditMealTags.jsx

@@ -33,7 +33,6 @@ const EditMealTags = (props) => {
     if (user) {
       const userId = user.sub;
       getSettingsOfUser(userId, (settings) => {
-        console.log('getting tags from settings', settings.mealTags);
         setTags(settings.mealTags || []);
       }); // tags must not be empty!
     }

client/src/components/Settings/Settings.jsx

@@ -18,6 +18,7 @@ import EditMealCategories from "./EditMealCategories";
 import DoneButton from "../Buttons/DoneButton";
 import SwitchSelector from "react-switch-selector";
 import { useHistory } from "react-router-dom";
+import DeleteAccountButton from "../Buttons/DeleteAccountButton";
 
 const useStyles = makeStyles(theme => ({
   settings: {
@@ -206,6 +207,7 @@ const Settings = (props) => {
         <EditMealTags onUpdateSettings={getSettings} />
         <br />
         <LogoutButton />
+        <DeleteAccountButton />
       </Box>
 
 

client/src/components/Settings/settings.util.jsx

@@ -9,13 +9,15 @@ const serverURL = process.env.REACT_APP_SERVER_URL;
  * @param {function} callback function to be executed after settings are created, receives newly created settings
  */
 export const createNewSettingsForUser = (userId, callback) => {
-  console.log('creating new settings for user', userId);
-  const newSettings = { userId: userId };
-  axios.post(serverURL + '/settings/add/', newSettings)
-       .then(res => {
-         console.log('result of adding settings for ' + userId, res);
-         if (callback) callback(res.data);
-       }).catch(err => {console.log(err)});
+  if (userId) {
+    console.log('creating new settings for user', userId);
+    const newSettings = { userId: userId };
+    axios.post(serverURL + '/settings/add/', newSettings)
+         .then(res => {
+           console.log('result of adding settings for ' + userId, res);
+           if (callback) callback(res.data);
+         }).catch(err => {console.log(err)});
+  }
 }
 
 /**
@@ -32,6 +34,19 @@ export const updateUser = (userId, newData, callback) => {
        }).catch(err => {console.log(err)});
 }
 
+/**
+ * deletes user from everything: all plans, meals, images, settings, as well as user in Auth0 database
+ * @param {string} userId id of the user to be deleted
+ * @param {function} callback function to be executed after updating (receives new updated data)
+ */
+export const deleteUser = (userId, callback) => {
+  axios.delete(serverURL + '/users/' + userId)
+       .then((result) => {
+         console.log('deleted user');
+         if (callback) callback();
+       }).catch(err => {console.log(err)});
+}
+
 /**
  * updates user metadata in Auth0 database
  * @param {string} userId id of the user whose metadata is to be changed
@@ -84,7 +99,6 @@ export const getSettingsOfUser = (userId, updateSettings) => {
  */
 export const updateUserSettingsForCategory = (userId, key, value, updateAllSettings) => {
   axios.put(serverURL + '/settings/updateSingleUserSetting/' + userId, { key, value }).then((result) => {
-    console.log('result from updateUser' + key, result);
     if (updateAllSettings) updateAllSettings(result.data.settingSaved);
   });
 }

client/src/components/Social/Social.jsx

@@ -57,12 +57,13 @@ const Social = () => {
 
   useEffect(() => {
     if (user) {
+      fetchContacts();
       const userId = user.sub;
       getSettingsOfUser(userId, (settings) => {
-        console.log(settings, settings.contactStartPageIndex);
         setContactStartPage(settings.contactStartPageIndex === 0 ? 'meals' : 'plans');
       });
     }
+    // eslint-disable-next-line
   }, [user]);
 
   const showUser = (userId) => {

client/src/components/Social/social.util.jsx

@@ -1,6 +1,6 @@
 /** File includes all helper methods for social */
 import axios from "axios";
-import { createNewSettingsForUser, updateUserSettingsForCategory } from "../Settings/settings.util";
+import { getSettingsOfUser, updateUserSettingsForCategory } from "../Settings/settings.util";
 
 const serverURL = process.env.REACT_APP_SERVER_URL;
 
@@ -10,16 +10,10 @@ const serverURL = process.env.REACT_APP_SERVER_URL;
  * @param {function} updateContacts  function that receives the contacts and will update the state of the calling component
  */
 export const fetchContactsOfUser = (userId, updateContacts) => {
-  axios.get(serverURL + '/settings/ofUser/' + userId)
-       .then(res => {
-         const settingsFound = res.data;
-         if (!settingsFound) {
-           createNewSettingsForUser(userId, fetchContactsOfUser(userId, updateContacts));
-         } else {
-           const sortedContacts = settingsFound.contacts.sort((a, b) => a.name.toUpperCase() > b.name.toUpperCase() ? 1 : -1)
-           updateContacts(sortedContacts);
-         }
-       }).catch(err => {console.log(err)});
+  getSettingsOfUser(userId, (settingsFound) => {
+    const sortedContacts = settingsFound.contacts.sort((a, b) => a.name.toUpperCase() > b.name.toUpperCase() ? 1 : -1)
+    updateContacts(sortedContacts);
+  });
 }
 
 /**

client/src/translations/_example.translation.json

@@ -93,5 +93,14 @@
   "Import Meal": "",
   "Successfully imported meal": "",
   "You can use this field to add a recipe in text form, instructions, experience or other comments.": "",
+  "Delete Account": "",
+  "Are you sure you want to delete your Emealay Account?": "",
+  "This cannot be undone.": "",
+  "No, cancel.": "",
+  "Yes, delete my account for good.": "",
+  "Your account is being deleted": "",
+  "Your Account has been deleted": "",
+  "You will be logged out now.": "",
+  "OK": "",
   "": ""
 }

client/src/translations/de.translation.json

@@ -94,5 +94,14 @@
   "Import": "Importieren",
   "Import Meal": "Gericht importieren",
   "Successfully imported meal": "Gericht erfolgreich importiert",
-  "You can use this field to add a recipe in text form, instructions, experience or other comments.": "Sie können dieses Feld nutzen, um ein Rezept in Textform, Anweisungen, Erfahrungswerte oder andere Kommentare hinzuzufügen."
+  "You can use this field to add a recipe in text form, instructions, experience or other comments.": "Sie können dieses Feld nutzen, um ein Rezept in Textform, Anweisungen, Erfahrungswerte oder andere Kommentare hinzuzufügen.",
+  "Delete Account": "Account löschen",
+  "Are you sure you want to delete your Emealay Account?": "Bist du sicher, dass du deinen Emealay Account dauerhaft löschen möchtest?",
+  "This cannot be undone.": "Das Löschen kann nicht rückgängig gemacht werden",
+  "No, cancel.": "Abbrechen",
+  "Yes, delete my account for good.": "Ja, dauerhaft löschen",
+  "Your account is being deleted": "Dein Account wird gelöscht.",
+  "Your Account has been deleted": "Dein Account wurde gelöscht.",
+  "You will be logged out now.": "Du wirst jetzt ausgeloggt.",
+  "OK": "OK"
 }

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

@@ -93,5 +93,14 @@
   "Import": "Import",
   "Import Meal": "Import Meal",
   "Successfully imported meal": "Successfully imported meal",
-  "You can use this field to add a recipe in text form, instructions, experience or other comments.": "You can use this field to add a recipe in text form, instructions, experience or other comments."
+  "You can use this field to add a recipe in text form, instructions, experience or other comments.": "You can use this field to add a recipe in text form, instructions, experience or other comments.",
+  "Delete Account": "Delete Account",
+  "Are you sure you want to delete your Emealay Account?": "Are you sure you want to delete your Emealay Account?",
+  "This cannot be undone.": "This cannot be undone.",
+  "No, cancel.": "No, cancel.",
+  "Yes, delete my account for good.": "Yes, delete my account for good.",
+  "Your account is being deleted": "Your account is being deleted",
+  "Your Account has been deleted": "Your Account has been deleted",
+  "You will be logged out now.": "You will be logged out now.",
+  "OK": "OK"
 }

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

@@ -93,5 +93,14 @@
   "Import": "Import",
   "Import Meal": "Import Meal",
   "Successfully imported meal": "Successfully imported meal",
-  "You can use this field to add a recipe in text form, instructions, experience or other comments.": "You can use this field to add a recipe in text form, instructions, experience or other comments."
+  "You can use this field to add a recipe in text form, instructions, experience or other comments.": "You can use this field to add a recipe in text form, instructions, experience or other comments.",
+  "Delete Account": "Delete Account",
+  "Are you sure you want to delete your Emealay Account?": "Are you sure you want to delete your Emealay Account?",
+  "This cannot be undone.": "This cannot be undone.",
+  "No, cancel.": "No, cancel.",
+  "Yes, delete my account for good.": "Yes, delete my account for good.",
+  "Your account is being deleted": "Your account is being deleted",
+  "Your Account has been deleted": "Your Account has been deleted",
+  "You will be logged out now.": "You will be logged out now.",
+  "OK": "OK"
 }

client/src/translations/es.translation.json

@@ -93,5 +93,14 @@
   "Import": "Importar",
   "Import Meal": "Importar Comida",
   "Successfully imported meal": "Comida importada con éxito",
-  "You can use this field to add a recipe in text form, instructions, experience or other comments.": "Puede utilizar este campo para añadir una receta en forma de texto, instrucciones, experiencia u otros comentarios."
+  "You can use this field to add a recipe in text form, instructions, experience or other comments.": "Puede utilizar este campo para añadir una receta en forma de texto, instrucciones, experiencia u otros comentarios.",
+  "Delete Account": "Eliminar la cuenta",
+  "Are you sure you want to delete your Emealay Account?": "¿Seguro que quieres eliminar tu cuenta de Emealay?",
+  "This cannot be undone.": "Esto no se puede deshacer.",
+  "No, cancel.": "No, cancelar",
+  "Yes, delete my account for good.": "Sí, quiero eliminar mi cuenta",
+  "Your account is being deleted": "Tu cuenta está siendo eliminada",
+  "Your Account has been deleted": "Tu cuenta ha sido eliminada",
+  "You will be logged out now.": "Ahora se cerrará la sesión.",
+  "OK": "OK"
 }

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

@@ -93,5 +93,14 @@
   "Import": "Importer",
   "Import Meal": "Importer un repas",
   "Successfully imported meal": "Importation réussie du repas",
-  "You can use this field to add a recipe in text form, instructions, experience or other comments.": "Vous pouvez utiliser ce champ pour ajouter une recette sous forme de texte, des instructions, des expériences ou d'autres commentaires."
+  "You can use this field to add a recipe in text form, instructions, experience or other comments.": "Vous pouvez utiliser ce champ pour ajouter une recette sous forme de texte, des instructions, des expériences ou d'autres commentaires.",
+  "Delete Account": "Supprimer le compte",
+  "Are you sure you want to delete your Emealay Account?": "Êtes-vous sûr de vouloir supprimer votre compte de Emealay ?",
+  "This cannot be undone.": "Cette opération ne peut être annulée.",
+  "No, cancel.": "Non, annulez.",
+  "Yes, delete my account for good.": "Oui, supprimez mon compte pour de bon.",
+  "Your account is being deleted": "Votre compte est en cours de suppression",
+  "Your Account has been deleted": "Votre compte a été supprimé",
+  "You will be logged out now.": "Vous allez être déconnecté maintenant.",
+  "OK": "OK"
 }

client/src/translations/it.translation.json

@@ -93,5 +93,14 @@
   "Import": "Importare",
   "Import Meal": "Importare pasto",
   "Successfully imported meal": "Pasto importato con successo",
-  "You can use this field to add a recipe in text form, instructions, experience or other comments.": "Puoi usare questo campo per aggiungere una ricetta in forma di testo, istruzioni, esperienze o altri commenti."
+  "You can use this field to add a recipe in text form, instructions, experience or other comments.": "Puoi usare questo campo per aggiungere una ricetta in forma di testo, istruzioni, esperienze o altri commenti.",
+  "Delete Account": "Cancellare il conto",
+  "Are you sure you want to delete your Emealay Account?": "Sei sicuro di voler cancellare il tuo conto di Emealay?",
+  "This cannot be undone.": "Questo non può essere annullato.",
+  "No, cancel.": "No, annullare.",
+  "Yes, delete my account for good.": "Sì, cancella il mio conto per sempre.",
+  "Your account is being deleted": "Stiamo cancellando il tuo conto",
+  "Your Account has been deleted": "Il tuo conto è stato cancellato",
+  "You will be logged out now.": "Sarai disconnesso ora.",
+  "OK": "OK"
 }

server/controllers/images.controllers.js

@@ -163,10 +163,37 @@ export const deleteAllImagesFromCategory = async (req, res) => {
           if (err) {
             res.status(400).json({ 'info': `Deletion of images from ${category} ${id} failed`, 'message': err.message });
           } else {
-            res.status(201).json({ 'info': `images from ${category} with ${id} deleted`, deletionResult })
+            res.status(201).json({ 'info': `images from ${category} with ${id} deleted`, deletionResult });
           }
         });
       });
     }
-  })
+  });
+}
+
+export const deleteAllImagesFromCategoryInternally = async (category, categoryId) => {
+  await Image.find({ categoryName: category, categoryId: categoryId }, async function (err, foundImages) {
+    if (err) {
+      console.log('error in find', err);
+    } else {
+      await Promise.all(foundImages.map(async (i) => {
+        await cloudinary.uploader.destroy(i.cloudinaryPublicId).catch(error => {
+          console.log('deletion of ' + i.name + ' from cloudinary failed because', error);
+        });
+      }));
+      const folder = category + '/' + categoryId;
+      console.log('trying to delete folder ' + folder);
+      cloudinary.api.delete_folder(folder).catch(err => {
+        console.log('error on delete folder', err);
+      }).finally(() => {
+        Image.deleteMany({ categoryName: category, categoryId: categoryId }, {}, function (err, deletionResult) {
+          if (err) {
+            console.log(`Deletion of images from ${category} ${categoryId} failed`, err.message);
+          } else {
+            console.log(deletionResult.n + ` images from ${category} with ${categoryId} deleted`);
+          }
+        });
+      });
+    }
+  });
 }

server/controllers/meals.controllers.js

@@ -1,5 +1,6 @@
 /** logic for meal routes */
 import Meal from "../models/meal.model.js";
+import { deleteAllImagesFromCategoryInternally } from "./images.controllers.js";
 
 export const getMeals = async (req, res) => {
   Meal.find().sort({ title: 1 }).exec((err, meals) => {
@@ -98,3 +99,21 @@ export const deleteMeal = async (req, res) => {
   });
 }
 
+export const deleteAllMealsOfUser = async (userId) => {
+  await Meal.find({ userId: userId }).sort({ title: 1 }).exec(async (err, meals) => {
+    if (err) {
+      console.log('error on finding meals to delete images for user ' + userId);
+    } else {
+      await Promise.all(meals.map(async (meal) => {
+        await deleteAllImagesFromCategoryInternally('mealImages', meal._id);
+      }));
+    }
+  });
+  Meal.deleteMany({ userId: userId }, {}, function (err) {
+    if (err) {
+      console.log('error on delete meals for user ' + userId, err);
+    } else {
+      console.log('meals for user ' + userId + ' deleted');
+    }
+  });
+}

server/controllers/plans.controller.js

@@ -103,3 +103,13 @@ export const deletePlan = async (req, res) => {
     }
   });
 }
+
+export const deleteAllPlansOfUser = async (userId) => {
+  Plan.deleteMany({ userId: userId }, {}, function (err) {
+    if (err) {
+      console.log('error on delete plans for user ' + userId, err);
+    } else {
+      console.log('plans for user ' + userId + ' deleted');
+    }
+  });
+}

server/controllers/settings.controller.js

@@ -23,12 +23,17 @@ export const getSettingsOfUser = async (req, res) => {
 
 export const addSettings = async (req, res) => {
   const givenSettings = req.body;
-  const newSettings = new Settings(givenSettings);
-  try {
-    await newSettings.save();
-    res.status(201).json({ 'message': 'successfully added new Settings', 'Settings': newSettings });
-  } catch (error) {
-    res.status(409).json({ message: error.message });
+  const { userId } = givenSettings;
+  if (userId) {
+    const newSettings = new Settings(givenSettings);
+    try {
+      await newSettings.save();
+      res.status(201).json({ 'message': 'successfully added new Settings', 'Settings': newSettings });
+    } catch (error) {
+      res.status(409).json({ message: error.message });
+    }
+  } else {
+    res.status(409).json({ 'message': 'cannot add settings for undefined userId' });
   }
 }
 
@@ -64,6 +69,16 @@ export const deleteSettings = async (req, res) => {
   });
 }
 
+export const deleteSettingOfUser = async (userId) => {
+  Settings.deleteOne({ userId: userId }, {}, function (err) {
+    if (err) {
+      console.log('error on delete settings for user ' + userId, err);
+    } else {
+      console.log('settings for user ' + userId + ' deleted');
+    }
+  });
+}
+
 export const updateUserContacts = async (req, res) => {
   const newContacts = req.body;
   const id = req.params.id;
@@ -78,7 +93,6 @@ export const updateUserContacts = async (req, res) => {
   }
 }
 
-
 export const updateUserDarkModePreference = async (req, res) => {
   const newDarkModePreference = req.body;
   let id = req.params.id;

server/controllers/users.controller.js

@@ -3,6 +3,9 @@
  */
 import { ManagementClient } from 'auth0';
 import dotenv from 'dotenv';
+import { deleteSettingOfUser } from "./settings.controller.js";
+import { deleteAllMealsOfUser } from "./meals.controllers.js";
+import { deleteAllPlansOfUser } from "./plans.controller.js";
 
 dotenv.config();
 
@@ -100,3 +103,22 @@ export const updateUser = async (req, res) => {
                  res.status(404).json({ message: err.message });
                });
 }
+
+export const deleteUser = async (req, res) => {
+  const userId = req.params.id;
+  const params = { id: userId };
+
+  await deleteSettingOfUser(userId);
+  await deleteAllPlansOfUser(userId);
+  await deleteAllMealsOfUser(userId);
+
+  managementAPI.deleteUser(params)
+               .then(function () {
+                 console.log('user deleted for good.');
+                 res.status(200).json('account deleted');
+               })
+               .catch(function (err) {
+                 console.log('error while deleting user', err);
+                 res.status(404).json({ message: err.message });
+               });
+}

server/models/meal.model.js

@@ -8,6 +8,7 @@ const mealSchema = new mongoose.Schema({
     _id: String,
     name: String,
     url: String,
+    cloudinaryPublicId: String,
     isMain: Boolean,
     }],
   recipeLink: String,

server/models/settings.model.js

@@ -11,6 +11,10 @@ const settingsSchema = mongoose.Schema({
     icon: Object,
   }],
   mealTags: [String],
+  createdAt: {
+    type: Date,
+    default: new Date()
+  },
 });
 
 const Settings = mongoose.model('Settings', settingsSchema);

server/routes/users.routes.js

@@ -1,5 +1,5 @@
 import express from 'express';
-import { getAllUsers, getUsersFromQuery, getUserById, updateUserMetadata, updateUser } from "../controllers/users.controller.js";
+import { getAllUsers, getUsersFromQuery, getUserById, updateUserMetadata, updateUser, deleteUser } from "../controllers/users.controller.js";
 
 const router = express.Router();
 
@@ -8,4 +8,5 @@ router.get('/all', getAllUsers);
 router.get('/byId/:id', getUserById);
 router.put('/updateMetadata/:id', updateUserMetadata);
 router.put('/update/:id', updateUser);
+router.delete('/:id', deleteUser);
 export default router;