Final Touch to recipe website

atharv02-git · Dec 14, 2021 · 4a86df1 · 4a86df1
1 parent ca992b9
commit 4a86df1
Show file tree

Hide file tree

Showing 6 changed files with 30 additions and 34 deletions.
diff --git a/src/components/RecipeList.js b/src/components/RecipeList.js
@@ -30,7 +30,7 @@ export default function RecipeList({ recipes }) {
       {recipes.map((recipe) => (
         <div key={recipe.id} className={`card ${mode}`}>
           <h3>{recipe.title}</h3>
-          <p>{recipe.cookingTime} to make.</p>
+          <p>{recipe.cookingTime} minutes to make</p>
           <div>{recipe.method.substring(0, 100)}...</div>
           <Link to={`/recipes/${recipe.id}`}>Cook This</Link>
           <img

diff --git a/src/components/navbar.js b/src/components/navbar.js
@@ -12,7 +12,7 @@ export default function Navbar() {
     <div className="navbar" style={{ background: defaultColor }}>
       <nav>
         <Link to="/" className="brand">
-          <h1>Cooking Ninja</h1>
+          <h1>My Recipes</h1>
         </Link>
         <SearchBar />
         <Link to="/create">Create Recipe</Link>

diff --git a/src/firebase/config.js b/src/firebase/config.js
@@ -1,22 +1,13 @@
 import firebase from "firebase/app";
 import "firebase/firestore";
 
-// const firebaseConfig = {
-//     apiKey: process.env.FIREBASE_API_KEY,
-//     authDomain: process.env.FIREBASE_AUTH_DOMAIN ,
-//     projectId: process.env.FIREBASE_PROJECT_ID,
-//     storageBucket: process.env.FIREBASE_STORAGE_BUCKET,
-//     messagingSenderId: process.env.FIREBASE_MESSAGING_SENDER_ID,
-//     appId: process.env.FIREBASE_APP_ID
-//   };
-
 const firebaseConfig = {
-  apiKey: "AIzaSyAe4IkiQyjxjgFwf32xIOkdHClG2Naz3Nc",
-  authDomain: "cooking-recipe-website.firebaseapp.com",
-  projectId: "cooking-recipe-website",
-  storageBucket: "cooking-recipe-website.appspot.com",
-  messagingSenderId: "390496285457",
-  appId: "1:390496285457:web:7aafa4ffc19bd3546792b0"
+  apiKey: process.env.REACT_APP_FIREBASE_API_KEY,
+  authDomain: process.env.REACT_APP_FIREBASE_AUTH_DOMAIN,
+  projectId: process.env.REACT_APP_FIREBASE_PROJECT_ID,
+  storageBucket: process.env.REACT_APP_FIREBASE_STORAGE_BUCKET,
+  messagingSenderId: process.env.REACT_APP_FIREBASE_MESSAGING_SENDER_ID,
+  appId: process.env.REACT_APP_FIREBASE_APP_ID,
 };
 
 //initialize firebase
@@ -25,4 +16,4 @@ firebase.initializeApp(firebaseConfig);
 // initialize firestore services
 const projectFirestore = firebase.firestore();
 
-export { projectFirestore };
+export { projectFirestore };
diff --git a/src/pages/create/Create.js b/src/pages/create/Create.js
@@ -1,5 +1,5 @@
 import { projectFirestore } from "../../firebase/config";
-import { useState, useRef} from "react";
+import { useState, useRef } from "react";
 
 import { useNavigate } from "react-router";
 import { useTheme } from "../../hooks/useTheme";
@@ -15,20 +15,25 @@ export default function Create() {
   // ingredients array
   const [ingredients, setIngredients] = useState([]);
   const ingredientInput = useRef(null);
-  
+
   // Navigate
   const navigate = useNavigate();
 
-  const {mode} = useTheme()
-  
-  const submitHandler = async(e) => {
+  const { mode } = useTheme();
+
+  const submitHandler = async (e) => {
     e.preventDefault();
-    const doc = {title, ingredients, method, cookingTime: cookingTime + " minutes"};
-    try{
-      await projectFirestore.collection('recipes').add(doc);
-      navigate('/');
-    }catch(err){
-      console.log(err)
+    const doc = {
+      title,
+      ingredients,
+      method,
+      cookingTime
+    };
+    try {
+      await projectFirestore.collection("recipes").add(doc);
+      navigate("/");
+    } catch (err) {
+      console.log(err);
     }
   };
 

diff --git a/src/pages/edit/Edit.js b/src/pages/edit/Edit.js
@@ -39,10 +39,10 @@ export default function Edit() {
           title:title,
           ingredients:ingredients,
           method:method,
-          cookingTime:
-            cookingTime.slice(0, 1) === "1"
-              ? cookingTime.slice(0, 1) + "minute"
-              : cookingTime.slice(0, 1) + "minutes",
+          cookingTime:cookingTime
+            // cookingTime.slice(0, 1) === "1"
+            //   ? cookingTime.slice(0, 1) + "minute"
+            //   : cookingTime.slice(0, 1) + "minutes",
         });
       navigate("/");
     } catch (err) {

diff --git a/src/pages/recipe/Recipe.js b/src/pages/recipe/Recipe.js
@@ -41,7 +41,7 @@ export default function Recipe() {
       {recipe && (
         <>
           <h2 className="page-title">{recipe.title}</h2>
-          <p>Takes {recipe.cookingTime} to cook.</p>
+          <p>Takes {recipe.cookingTime} minutes to make.</p>
           <ul>
             {recipe.ingredients.map((ingredient) => (
               <li key={ingredient}>{ingredient}</li>