fixed search and added routes for past

db_app/src/components/LogMeals.js

@@ -80,84 +80,39 @@ function weekStart(){
 
 const net_id = ReactSession.get("net_id");
 
-//to set nutritional goal for the week
-const [goalInput, setGoalInput] = useState({
-      total_cal: 0,
-      total_fat: 0,
-      total_sat_fat: 0,
-      total_trans_fat: 0,
-      total_carbs: 0,
-      total_fiber: 0,
-      total_sugar: 0,
-      total_protein: 0,
-      total_sodium: 0,
-      total_potassium: 0,
-      total_cholesterol: 0,
-    }
-);
 
-const{total_cal, total_fat, total_sat_fat, total_trans_fat, total_carbs, total_fiber, 
-  total_sugar, total_protein, total_sodium, total_potassium, total_cholesterol} = goalInput
-
-const changeGoalHandler = evt =>{
-  setGoalInput({...goalInput, [evt.target.name]: [evt.target.value] })
-}
-
-const submitGoalHandler = evt => {
-  evt.preventDefault();
-  console.log(goalInput)
-  console.log(net_id)
-  console.log(weekStart())
-  Axios.post("http://3.219.93.142:8000/api/goal",
-    {
-      net_id: net_id,
-      week_date: weekStart(),
-      total_cal: Number(total_cal[0]),
-      total_fat: Number(total_fat[0]),
-      total_sat_fat: Number(total_sat_fat[0]),
-      total_trans_fat: Number(total_trans_fat[0]),
-      total_carbs: Number(total_carbs[0]),
-      total_fiber: Number(total_fiber[0]),
-      total_sugar: Number(total_sugar[0]),
-      total_protein: Number(total_protein[0]),
-      total_sodium: Number(total_sodium[0]),
-      total_potassium: Number(total_potassium[0]),
-      total_cholesterol: Number(total_cholesterol[0])
-    }).then((response) => {
-      console.log(response);
-      console.log(response.status);
-    })
-};
 
 //to find a food item from an on campus location to your weekly journal
 const [keyword, setKeyword] = useState({
   search_term:""
 })
 
-const [searchItems, setSearchItems] = useState([{}]);
+const [searchItems, setSearchItems] = useState([]);
+const [sendItems, setSendItems] = useState([{}]);
+
 
 const{search_term} = keyword
 
 const removeItem = (index) => {
-  setSearchItems([
+  setSendItems([
-             ...searchItems.slice(0, index),
+             ...sendItems.slice(0, index),
-             ...searchItems.slice(index + 1)
+             ...sendItems.slice(index + 1)
   ]);
 
 }
 
 function handleCheck (i) {
   console.log(i);
-  if (searchItems.indexOf(i) > -1){
+  if (sendItems.indexOf(i) > -1){
     //get index and delete
-    var index = searchItems.indexOf(i)
+    var index = sendItems.indexOf(i)
     removeItem(index);
     console.log(`removed ${i}`);
     
   }
 
   else{
-    setSearchItems(searchItems => [...searchItems, i]);
+    setSendItems(sendItems => [...sendItems, i]);
     console.log(`added ${i}`);
   }
   
@@ -178,8 +133,9 @@ const submitSearchHandler = evt => {
     }).then((response) => {
       console.log(response);
       console.log(response.status);
-      console.log(response.data);
+      console.log('Data:')
-      setSearchItems(response.data);
+      console.log(response.data.results);
+      setSearchItems(response.data.results);
     })
 };
 
@@ -335,9 +291,6 @@ color: 'main',
                       onChange={() => handleCheck(searchitem.item_id)}
                     />
                     </TableCell>
-                    <TableCell>
-                      {searchitem.item_name}
-                    </TableCell>
         
               <TableCell> {searchitem.eatery_id}</TableCell>
               <TableCell> {searchitem.item_name}</TableCell>

db_app/src/components/Past.js

@@ -1,4 +1,4 @@
-import React,{useState} from 'react';
+import React,{useState, useEffect} from 'react';
 import {Routes, Route, useNavigate} from 'react-router-dom';
 import './Login.css';
 import Button from "@mui/material/Button";
@@ -22,7 +22,7 @@ import MenuItem from '@mui/material/MenuItem';
 import {red, green, lightBlue, lightGreen} from '@mui/material/colors';
 import { ThemeProvider, createTheme } from '@mui/material/styles';
 import { ReactSession } from 'react-client-session';
-import { Axios } from 'axios';
+import Axios from 'axios';
 import Chip from '@mui/material/Chip';
 import Stack from '@mui/material/Stack';
 import Select, { SelectChangeEvent } from '@mui/material/Select';
@@ -94,78 +94,43 @@ function weekStart(){
 
 const net_id = ReactSession.get("net_id");
 
-//to set nutritional goal for the week
+  //Get history of plans for this week
-const [goalInput, setGoalInput] = useState({
+  const [pastPlans, setPastPlans] = useState([{}]);
-      total_cal: "",
+  const makePastURL = (net_id) => `http://3.219.93.142:8000/api/${net_id}`;
-      total_fat: "",
+
-      total_sat_fat: "",
+  const getPastPlans = () => {
-      total_trans_fat: "",
+    const net_id = ReactSession.get("net_id");
-      total_carbs: "",
+    const url_to_query = makePastURL(net_id);
-      total_fiber: "",
+     Axios.get(url_to_query).then((response) => {
-      total_sugar: "",
+      console.log(response.data);
-      total_protein: "",
+      setPastPlans(response.data);
-      total_sodium: "",
+    });
-      total_potassium: "",
+     
-      total_cholesterol: "",
     }
-);
+      //Get history of actual totals for weekly plan (progress)
+      const [past, setPast] = useState([{}]);
+      const makeURL = (net_id) => `http://3.219.93.142:8000/api/${net_id}`;
     
-const{total_cal, total_fat, total_sat_fat, total_trans_fat, total_carbs, total_fiber, 
+      const getPast = () => {
-  total_sugar, total_protein, total_sodium, total_potassium, total_cholesterol} = goalInput
+        const net_id = ReactSession.get("net_id");
+        const url_to_query = makeURL(net_id);
+         Axios.get(url_to_query).then((response) => {
+          console.log(response.data);
+          setPast(response.data);
+        });
          
-const changeGoalHandler = evt =>{
+        }
-  setGoalInput({...goalInput, [evt.target.name]: [evt.target.value] })
-}
 
-const submitGoalHandler = evt => {
+    //run getPast and pastPlans on page load
-  evt.preventDefault();
+        useEffect(() => {
-  console.log(goalInput)
+            getPast()
-  Axios.post("http://3.219.93.142:8000/api/",
+            console.log('Past actual in')
-    {
+            getPastPlans()
-      total_cal: total_cal[0],
+            console.log('Past plans in')
-      total_fat: total_fat[0],
+          }, [])
-      total_sat_fat: total_sat_fat[0],
-      total_trans_fat: total_trans_fat[0],
-      total_carbs: total_carbs[0],
-      total_fiber: total_fiber[0],
-      total_sugar: total_sugar[0],
-      total_protein: total_protein[0],
-      total_sodium: total_sodium[0],
-      total_potassium: total_potassium[0],
-      total_cholesterol: total_cholesterol[0]
-    }).then((response) => {
-      console.log(response);
-      console.log(response.status);
-    })
-};
 
 
-//to add an off campus food item or meal to your weekly journal
-  const [offCampusInput, setOffCampusInput] = useState({
-    calories: "",
-    fat_g: "",
-    sat_fat_g: "",
-    trans_fat_g: "",
-    carbs_g: "",
-    fiber_g: "",
-    sugar_g: "",
-    protein_g: "",
-    sodium_g: "",
-    potassium_g: "",
-    cholesterol_g: "",
-  }
-  );
 
-  const { calories, fat_g, sat_fat_g, trans_fat_g, carbs_g, fiber_g,sugar_g, protein_g,
-    sodium_g, potassium_g, cholesterol_g, } = offCampusInput
-
-  const changeoffCampusHandler = evt => {
-    setOffCampusInput({ ...offCampusInput, [evt.target.name]: [evt.target.value] })
-  }
-
-  const submitoffCampusHandler = evt => {
-    evt.preventDefault();
-  };
 
 
   
@@ -200,48 +165,129 @@ const submitGoalHandler = evt => {
     <div>
       <h1>
       &nbsp;
-        Past plans:
+        Your History
       </h1>
 
       
 
-      <TableContainer component={Paper}>
+      <h3>
-          <Table stickyHeader>
+        &nbsp; &nbsp;
+        Past plans by week:
+      </h3>
+
+      <Paper sx={{ width: '100%', overflow: 'hidden' }}>
+      <TableContainer component={Paper} sx={{margin: 5, maxHeight: 200, maxWidth:1400}}>
+          <Table stickyHeader sx={{maxWidth:1400}}>
           <TableHead>
-            <TableRow>
+            <TableRow sx={{maxWidth:1400}}>
-              <TableCell style={{ width: 90 }}  align="left">Food</TableCell>
+            
-              <TableCell style={{ width: 90 }} align="left">Calories</TableCell>
+        
-              <TableCell style={{ width: 90 }} align="left">Fat&nbsp;(g)</TableCell>
+              <TableCell style={{ maxWidth: 110}}  align="left">Week</TableCell>
-              <TableCell style={{ width: 90 }} align="left">Saturated Fat&nbsp;(g)</TableCell>
+              <TableCell style={{ maxWidth: 90 }} align="left">Calories</TableCell>
-              <TableCell style={{ width: 90 }} align="left">TransFat&nbsp;(g)</TableCell>
+              <TableCell style={{ maxWidth: 70 }} align="left">Fat&nbsp;(g)</TableCell>
-              <TableCell style={{ width: 90 }} align="left">Carbs&nbsp;(g)</TableCell>
+              <TableCell style={{ maxWidth: 90 }} align="left">Saturated Fat&nbsp;(g)</TableCell>
-              <TableCell style={{ width: 90 }} align="left">Fiber&nbsp;(g)</TableCell>
+              <TableCell style={{ maxWidth: 90 }} align="left">TransFat&nbsp;(g)</TableCell>
-              <TableCell style={{ width: 90 }} align="left">Sugar&nbsp;(g)</TableCell>
+              <TableCell style={{ maxWidth: 50 }} align="left">Carbs&nbsp;(g)</TableCell>
-              <TableCell style={{ width: 90 }} align="left">Protein&nbsp;(g)</TableCell>
+              <TableCell style={{ maxWidth: 70 }} align="left">Fiber&nbsp;(g)</TableCell>
-              <TableCell style={{ width: 90 }} align="left">Sodium&nbsp;(mg)</TableCell>
+              <TableCell style={{ maxWidth: 90 }} align="left">Sugar&nbsp;(g)</TableCell>
-              <TableCell style={{ width: 90 }} align="left">Potassium&nbsp;(mg)</TableCell>
+              <TableCell style={{ maxWidth: 90 }} align="left">Protein&nbsp;(g)</TableCell>
-              <TableCell style={{ width: 90 }} align="left">Cholesterol&nbsp;(mg)</TableCell>
+              <TableCell style={{ maxWidth: 90 }} align="left">Sodium&nbsp;(mg)</TableCell>
+              <TableCell style={{ maxWidth: 90 }} align="left">Potassium&nbsp;(mg)</TableCell>
+              <TableCell style={{ maxWidth: 80 }} align="left">Cholesterol&nbsp;(mg)</TableCell>
             </TableRow>
           </TableHead>
 
-          <TableBody>
+          <TableBody sx={{maxWidth:1350}}>
-            <TableRow>
+            {pastPlans.map((pastplan, i) => {
-              <TableCell> </TableCell>
+              console.log(i);
-              <TableCell> </TableCell>
+              return(
-              <TableCell> </TableCell>
+                <TableRow
-              <TableCell> </TableCell>
+                    key={pastplan.week}
-              <TableCell> </TableCell>
+                    sx={{ '&:last-child td, &:last-child th': { border: 0 } }}
-              <TableCell> </TableCell>
+                  >
-              <TableCell> </TableCell>
+                  
-              <TableCell> </TableCell>
+                    <TableCell>
-              <TableCell> </TableCell>
+                      {pastplan.week}
-              <TableCell> </TableCell>
+                    </TableCell>
-              <TableCell> </TableCell>
+        
+              <TableCell> {pastplan.calories}</TableCell>
+              <TableCell> {pastplan.fat_g}</TableCell>
+              <TableCell> {pastplan.sat_fat_g}</TableCell>
+              <TableCell> {pastplan.trans_fat_g}</TableCell>
+              <TableCell> {pastplan.carbs_g}</TableCell>
+              <TableCell> {pastplan.fiber_g}</TableCell>
+              <TableCell>{pastplan.sugar_g} </TableCell>
+              <TableCell> {pastplan.protein_g}</TableCell>
+              <TableCell>{pastplan.sodium_mg} </TableCell>
+              <TableCell> {pastplan.potassium_mg}</TableCell>
+              <TableCell> {pastplan.cholesterol_mg}</TableCell>
             </TableRow>
+            )
+          })}
           </TableBody>
         </Table>
       </TableContainer>
+      </Paper>
 
+    
+      <h3>
+        &nbsp; &nbsp;
+        Past actual by week:
+      </h3>
+
+      <Paper sx={{ width: '100%', overflow: 'hidden' }}>
+      <TableContainer component={Paper} sx={{margin: 5, maxHeight: 200, maxWidth:1400}}>
+          <Table stickyHeader sx={{maxWidth:1400}}>
+          <TableHead>
+            <TableRow sx={{maxWidth:1400}}>
+            
+        
+              <TableCell style={{ maxWidth: 110}}  align="left">Week</TableCell>
+              <TableCell style={{ maxWidth: 90 }} align="left">Calories</TableCell>
+              <TableCell style={{ maxWidth: 70 }} align="left">Fat&nbsp;(g)</TableCell>
+              <TableCell style={{ maxWidth: 90 }} align="left">Saturated Fat&nbsp;(g)</TableCell>
+              <TableCell style={{ maxWidth: 90 }} align="left">TransFat&nbsp;(g)</TableCell>
+              <TableCell style={{ maxWidth: 50 }} align="left">Carbs&nbsp;(g)</TableCell>
+              <TableCell style={{ maxWidth: 70 }} align="left">Fiber&nbsp;(g)</TableCell>
+              <TableCell style={{ maxWidth: 90 }} align="left">Sugar&nbsp;(g)</TableCell>
+              <TableCell style={{ maxWidth: 90 }} align="left">Protein&nbsp;(g)</TableCell>
+              <TableCell style={{ maxWidth: 90 }} align="left">Sodium&nbsp;(mg)</TableCell>
+              <TableCell style={{ maxWidth: 90 }} align="left">Potassium&nbsp;(mg)</TableCell>
+              <TableCell style={{ maxWidth: 80 }} align="left">Cholesterol&nbsp;(mg)</TableCell>
+            </TableRow>
+          </TableHead>
+
+          <TableBody sx={{maxWidth:1350}}>
+            {past.map((progress, i) => {
+              console.log(i);
+              return(
+                <TableRow
+                    key={progress.week}
+                    sx={{ '&:last-child td, &:last-child th': { border: 0 } }}
+                  >
+                  
+                    <TableCell>
+                      {progress.week}
+                    </TableCell>
+        
+              <TableCell> {progress.calories}</TableCell>
+              <TableCell> {progress.fat_g}</TableCell>
+              <TableCell> {progress.sat_fat_g}</TableCell>
+              <TableCell> {progress.trans_fat_g}</TableCell>
+              <TableCell> {progress.carbs_g}</TableCell>
+              <TableCell> {progress.fiber_g}</TableCell>
+              <TableCell>{progress.sugar_g} </TableCell>
+              <TableCell> {progress.protein_g}</TableCell>
+              <TableCell>{progress.sodium_mg} </TableCell>
+              <TableCell> {progress.potassium_mg}</TableCell>
+              <TableCell> {progress.cholesterol_mg}</TableCell>
+            </TableRow>
+            )
+          })}
+          </TableBody>
+        </Table>
+      </TableContainer>
+      </Paper>
       </div>
 
     

db_app/src/components/ThisWeek.js

@@ -94,79 +94,8 @@ function weekStart(){
 
 const net_id = ReactSession.get("net_id");
 
-//to set nutritional goal for the week
-const [goalInput, setGoalInput] = useState({
-      total_cal: "",
-      total_fat: "",
-      total_sat_fat: "",
-      total_trans_fat: "",
-      total_carbs: "",
-      total_fiber: "",
-      total_sugar: "",
-      total_protein: "",
-      total_sodium: "",
-      total_potassium: "",
-      total_cholesterol: "",
-    }
-);
-
-const{total_cal, total_fat, total_sat_fat, total_trans_fat, total_carbs, total_fiber, 
-  total_sugar, total_protein, total_sodium, total_potassium, total_cholesterol} = goalInput
-
-const changeGoalHandler = evt =>{
-  setGoalInput({...goalInput, [evt.target.name]: [evt.target.value] })
-}
-
-const submitGoalHandler = evt => {
-  evt.preventDefault();
-  console.log(goalInput)
-  Axios.post("http://3.219.93.142:8000/api/",
-    {
-      total_cal: total_cal[0],
-      total_fat: total_fat[0],
-      total_sat_fat: total_sat_fat[0],
-      total_trans_fat: total_trans_fat[0],
-      total_carbs: total_carbs[0],
-      total_fiber: total_fiber[0],
-      total_sugar: total_sugar[0],
-      total_protein: total_protein[0],
-      total_sodium: total_sodium[0],
-      total_potassium: total_potassium[0],
-      total_cholesterol: total_cholesterol[0]
-    }).then((response) => {
-      console.log(response);
-      console.log(response.status);
-    })
-};
-
-
-//to add an off campus food item or meal to your weekly journal
-  const [offCampusInput, setOffCampusInput] = useState({
-    calories: "",
-    fat_g: "",
-    sat_fat_g: "",
-    trans_fat_g: "",
-    carbs_g: "",
-    fiber_g: "",
-    sugar_g: "",
-    protein_g: "",
-    sodium_g: "",
-    potassium_g: "",
-    cholesterol_g: "",
-  }
-  );
-
-  const { calories, fat_g, sat_fat_g, trans_fat_g, carbs_g, fiber_g,sugar_g, protein_g,
-    sodium_g, potassium_g, cholesterol_g, } = offCampusInput
-
-  const changeoffCampusHandler = evt => {
-    setOffCampusInput({ ...offCampusInput, [evt.target.name]: [evt.target.value] })
-  }
-
-  const submitoffCampusHandler = evt => {
-    evt.preventDefault();
-  };
 
+  //Get history of items for this week
   const [pastItems, setPastItems] = useState([{}]);
   const makeURL = (net_id) => `http://3.219.93.142:8000/api/week_progress/${net_id}`;
 
@@ -179,28 +108,47 @@ const submitGoalHandler = evt => {
     });
      
     }
-    useEffect(() => {
+      //Get sum of totals for weekly plan (progress)
-        getHistory()
+    const [goals, setGoals] = useState([{}]);
-        console.log('History in')
+    const goalURL = (net_id) => `http://3.219.93.142:8000/api/week_goal/${net_id}`;
-      }, [])
     
-      const [sum, setSum] = useState([{}]);
+      const getGoal = () => {
-      const sumURL = (net_id) => `http://3.219.93.142:8000/api/week_sum/${net_id}`;
-    
-      const getSum = () => {
         const net_id = ReactSession.get("net_id");
-        const url_to_query = sumURL(net_id);
+        const url_to_query = goalURL(net_id);
          Axios.get(url_to_query).then((response) => {
           console.log(response.data);
-          setSum(response.data);
+          setGoals(response.data);
         });
          
         }
+
+        //Get weekly plan goals
+        const [sum, setSum] = useState([{}]);
+        const sumURL = (net_id) => `http://3.219.93.142:8000/api/week_sum/${net_id}`;
+      
+        const getSum = () => {
+          const net_id = ReactSession.get("net_id");
+          const url_to_query = sumURL(net_id);
+           Axios.get(url_to_query).then((response) => {
+            console.log(response.data);
+            setSum(response.data);
+          });
+           
+          }
+
+
+    const [cals, setCals] = useState([{}]);
+    const [fat, setFat] = useState([{}]);
+    const [trans, setTrans] = useState([{}]);
+
+    //Run getSum, getHistory, and getPlan on page load
         useEffect(() => {
             getHistory()
             console.log('History in')
             getSum()
             console.log('Sum in')
+            getGoal()
+            console.log('Goal in')
           }, [])