Merge branch 'master' of https://github.com/Shubh-Nisar/Recipe_Recomm…

…ender
Shubh-Nisar · Oct 19, 2023 · d73e142 · d73e142
2 parents fab526c + 4d7975d
commit d73e142
Show file tree

Hide file tree

Showing 6 changed files with 73 additions and 24 deletions.
diff --git a/Code/frontend/src/App.js b/Code/frontend/src/App.js
@@ -81,16 +81,17 @@ class App extends Component {
     const cuis = formDict["cuisine"];
     const cook_time = formDict["time_to_cook"];
     const budget = formDict["budget"];
-    this.getRecipeDetails(items, cuis, cook_time, budget);
+    const pref = formDict["food_pref"];
+    this.getRecipeDetails(items, cuis, cook_time, budget, pref);
     //  alert(typeof(ingredientsInput["cuisine"]));
   };
 
-  getRecipeDetails = async (ingredient, cuis, cook_time, budget) => {
+  getRecipeDetails = async (ingredient, cuis, cook_time, budget, pref) => {
     console.log(ingredient, cuis, cook_time, budget);
     try {
       const response = await recipeDB
         .get(
-          `/recipes?CleanedIngredients=${ingredient}&Cuisine=${cuis}&budget=${budget}&TotalTimeInMins=${cook_time}`,
+          `/recipes?CleanedIngredients=${ingredient}&Cuisine=${cuis}&budget=${budget}&TotalTimeInMins=${cook_time}&typeOfDiet=${pref}`,
         )
         .catch((err) => {
           console.log(err, err.message);

diff --git a/Code/frontend/src/components/AddRecipeForm.js b/Code/frontend/src/components/AddRecipeForm.js
@@ -36,6 +36,7 @@ class Form extends Component {
     dict["recipe_time"] = document.getElementById("recipe_time").value;
     dict["recipe_url"] = document.getElementById("recipe_url").value;
     dict["recipe_budget"] = document.getElementById("recipe_budget").value;
+    dict["food_pref"] = document.getElementById("food_pref").value;
     console.log(dict);
 
     let all_val_filled = [];
@@ -166,6 +167,26 @@ class Form extends Component {
               </div>
             </div>
           </div>
+
+          <div className="row pb-1">
+            <div className="input-group col-lg-4 bg-danger flexer">
+              <label className="sideLabel"> Recipe Time: </label>
+              <div className="input-group-append" style={{ width: "66%" }}>
+                <select
+                  name="time_to_cook"
+                  id="food_pref"
+                  className="form-input"
+                  style={{ width: "100%" }}
+                >
+                  <option value="Vegetarian">Vegetarian</option>
+                  <option value="Non-Vegetarian">Non-Vegetarian</option>
+                  <option value="Vegan">Vegan</option>
+                </select>
+                {/* <input type="text" id="recipe_time" /> */}
+              </div>
+            </div>
+          </div>
+
           <div className="row pb-1">
             <div className="input-group col-lg-4 bg-danger flexer">
               <label className="sideLabel"> Recipe URL: </label> <br />

diff --git a/Code/frontend/src/components/Form.js b/Code/frontend/src/components/Form.js
@@ -110,20 +110,12 @@ class Form extends Component {
   searchRecipe = async () => {
     const budget = document.getElementById("budget").value;
     const time = document.getElementById("time_to_cook").value;
-
-    if (isNaN(budget) || budget <= 0) {
-      alert("Budget should be a positive number");
-      return;
-    }
-
-    if (isNaN(time) || time <= 0) {
-      alert("Time to cook should be a positive number");
-      return;
-    }
+    const pref = document.getElementById("food_pref").value;
+    console.log("PREFERENCE", pref);
 
     const response = await recipeDB
       .get(
-        `/recipes?CleanedIngredients=${this.state.ingredients}&Cuisine=${this.state.ingredients}&budget=${budget}&TotalTimeInMins=${time}`,
+        `/recipes?CleanedIngredients=${this.state.ingredients}&Cuisine=${this.state.ingredients}&budget=${budget}&TotalTimeInMins=${time}&typeOfDiet=${pref}`,
       )
       .catch((err) => {
         console.log(err, err.message);
@@ -151,24 +143,19 @@ class Form extends Component {
       () => console.log(this.state),
     );
 
-    if (this.state.cuisine.trim() === "") {
-      alert("Cuisine cannot be empty");
-      return;
-    }
-
     event.preventDefault();
     var dict = {};
     dict["ingredient"] = this.state.ingredients;
     dict["cuisine"] = document.getElementById("cuisine").value;
     dict["time_to_cook"] = document.getElementById("time_to_cook").value;
     dict["budget"] = document.getElementById("budget").value;
     dict["time_to_cook"] = document.getElementById("time_to_cook").value;
+    dict["food_pref"] = document.getElementById("food_pref").value;
 
     console.log(dict);
 
     this.props.sendFormData(dict);
     document.getElementById("cuisine").value = "";
-    document.getElementById("time_to_cook").value = "";
 
     // this.searchRecipe();
   };
@@ -229,6 +216,23 @@ class Form extends Component {
               </select>
             </div>
           </div>
+
+          <div className="row pb-1">
+            <div className="input-group col-lg-4 bg-danger text-white flexer-new">
+              <label className="sideLabel-new">Preference:</label> <br />
+              <select
+                style={{ width: "auto" }}
+                name="time_to_cook"
+                id="food_pref"
+                className="form-input"
+              >
+                <option value="Vegetarian">Vegetarian</option>
+                <option value="Non-Vegetarian">Non-Vegetarian</option>
+                <option value="Vegan">Vegan</option>
+              </select>
+            </div>
+          </div>
+
           <div className="row pb-1">
             <div className="input-group col-lg-4 bg-danger text-white flexer-new">
               <div className="input-group-append form-input">

diff --git a/Code/frontend/src/components/Header.js b/Code/frontend/src/components/Header.js
@@ -4,6 +4,10 @@ import { useHistory } from "react-router-dom";
 function Header() {
   const history = useHistory();
 
+  if (!sessionStorage.getItem("login_recipe_recommender")) {
+    history.push("/login");
+  }
+
   return (
     <div>
       <ul className="navbar-ul">
@@ -15,6 +19,16 @@ function Header() {
           Recipe Recommender
         </li>
 
+        <li
+          className="navbar-li navbar-li-right"
+          onClick={() => {
+            sessionStorage.removeItem("login_recipe_recommender");
+            history.push("/login");
+          }}
+          style={{ cursor: "pointer" }}
+        >
+          Logout
+        </li>
         <li
           className="navbar-li navbar-li-right"
           onClick={() => history.push("/add-recipe")}

diff --git a/Code/frontend/src/components/RecipeCard.js b/Code/frontend/src/components/RecipeCard.js
@@ -12,7 +12,6 @@ const RecipeCard = ({
   imageUrl,
   budget,
 }) => {
-  console.log(Cuisine);
   const fetchYTId = (url) => {
     if (url.length > 0) {
       let tmp = url.split("be/")[1];
@@ -43,7 +42,10 @@ const RecipeCard = ({
           title="Embedded youtube"
         />
       </StyledYtIFrame>
-      <StyledBudget>Ingredients Required (Budget: ${budget})</StyledBudget>
+      <StyledBudget>
+        <StyledCuisine>Cuisine: {Cuisine}</StyledCuisine>
+        Ingredients Required (Budget: ${budget})
+      </StyledBudget>
       <StyledIngridients>
         {ingredientList(CleanedIngredients).map((ingredient) => (
           <StyledIngredient key={ingredient}>
@@ -152,4 +154,11 @@ const StyledBudget = styled.div`
   padding: 4px 8px;
   text-align: left;
   color: black;
+  font-weight: 800;
+`;
+
+const StyledCuisine = styled.div`
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
 `;
diff --git a/README.md b/README.md
@@ -22,7 +22,7 @@ https://github.com/Shubh-Nisar/Recipe_Recommender/blob/master/images/recipe-reco
 <!-- [![Running Code Coverage](https://github.com/thosaniparth/Recipe_Recommender/actions/workflows/coverage.yml/badge.svg)](https://github.com/thosaniparth/Recipe_Recommender/actions/workflows/coverage.yml) -->
 
 [![Style Checker and Prettify Code](https://github.com/thosaniparth/Recipe_Recommender/actions/workflows/Style_Checker_and_Prettify_Code.yml/badge.svg)](https://github.com/thosaniparth/Recipe_Recommender/actions/workflows/Style_Checker_and_Prettify_Code.yml)
-[![Greetings](https://github.com/thosaniparth/Recipe_Recommender/actions/workflows/greetings.yml/badge.svg)](https://github.com/thosaniparth/Recipe_Recommender/actions/workflows/greetings.yml)
+[![Greetings](https://github.com/Shubh-Nisar/Recipe_Recommender/actions/workflows/greetings.yml/badge.svg)](https://github.com/Shubh-Nisar/Recipe_Recommender/actions/workflows/greetings.yml)
 ![Lines of code](https://img.shields.io/badge/Lines%20of%20Code-123.5k-green)
 ![GitHub code size in bytes](https://img.shields.io/github/languages/code-size/thosaniparth/Recipe_Recommender)
 
@@ -53,7 +53,7 @@ Source documentation can be found at: [Recipe Recommender Docs] https://github.c
 ![React](https://img.shields.io/badge/react-%2320232a.svg?style=for-the-badge&logo=react&logoColor=%2361DAFB)
 ![Express.js](https://img.shields.io/badge/express.js-%23404d59.svg?style=for-the-badge&logo=express&logoColor=%2361DAFB)
 ![NPM](https://img.shields.io/badge/npm-CB3837?style=for-the-badge&logo=npm&logoColor=white)
-![JEST](https://img.shields.io/badge/Jest-C21325?style=for-the-badge&logo=jest&logoColor=white)
+![Chai](https://img.shields.io/badge/chai.js-323330?style=for-the-badge&logo=chai&logoColor=red)
 ![MongoDB](https://img.shields.io/badge/MongoDB-%234ea94b.svg?style=for-the-badge&logo=mongodb&logoColor=white)
 ![HTML](https://img.shields.io/badge/HTML5-E34F26?style=for-the-badge&logo=html5&logoColor=white)
 ![CSS](https://img.shields.io/badge/CSS3-1572B6?style=for-the-badge&logo=css3&logoColor=white)