From 612a2b1ac9195bb6259f85a7c6fc1c423f6f01c0 Mon Sep 17 00:00:00 2001 From: Amanda Yee Date: Tue, 1 Oct 2024 00:44:40 -0400 Subject: [PATCH 01/14] remove unused imports --- code/client/src/components/CreateUser.js | 3 --- code/client/src/components/Home.js | 13 +------------ code/client/src/components/ViewUsers.js | 13 +------------ 3 files changed, 2 insertions(+), 27 deletions(-) diff --git a/code/client/src/components/CreateUser.js b/code/client/src/components/CreateUser.js index 496f8f189..3344691a5 100644 --- a/code/client/src/components/CreateUser.js +++ b/code/client/src/components/CreateUser.js @@ -15,9 +15,6 @@ import { box, title, textField, - inputLable, - inputBackground, - menuPropsStyles, submitButton, } from "./style/styles.js"; diff --git a/code/client/src/components/Home.js b/code/client/src/components/Home.js index fcf86db50..862d71211 100644 --- a/code/client/src/components/Home.js +++ b/code/client/src/components/Home.js @@ -1,17 +1,6 @@ import { Box, - Typography, - TextField, - Grid, - Slider, - FormControlLabel, - Radio, - RadioGroup, - FormControl, - InputLabel, - Select, - MenuItem, - InputAdornment, + Typography } from "@mui/material"; import { box, title, bigTitle } from "./style/styles.js"; diff --git a/code/client/src/components/ViewUsers.js b/code/client/src/components/ViewUsers.js index 37b972aec..e60e920cd 100644 --- a/code/client/src/components/ViewUsers.js +++ b/code/client/src/components/ViewUsers.js @@ -4,18 +4,7 @@ import { useEffect, useState } from "react"; import apiClient from "../services/apiClient.js"; import { Box, - Typography, - TextField, - Grid, - Slider, - FormControlLabel, - Radio, - RadioGroup, - FormControl, - InputLabel, - Select, - MenuItem, - InputAdornment, + Typography } from "@mui/material"; import { box, bigTitle } from "./style/styles.js"; function ViewUsers() { From 790b22d56ab991d388cb4f706975bf422bf0491a Mon Sep 17 00:00:00 2001 From: Amanda Yee Date: Tue, 1 Oct 2024 21:07:42 -0400 Subject: [PATCH 02/14] need to debug this --- code/client/src/App.js | 14 ++++++- code/client/src/components/ManageProfile.js | 42 +++++++++++++++++++++ code/server/server.js | 9 +++-- 3 files changed, 60 insertions(+), 5 deletions(-) create mode 100644 code/client/src/components/ManageProfile.js diff --git a/code/client/src/App.js b/code/client/src/App.js index 93d99d75d..a23acc6c9 100644 --- a/code/client/src/App.js +++ b/code/client/src/App.js @@ -4,6 +4,7 @@ import Home from "./components/Home.js"; import Login from "./components/Login.js"; import CreateUser from "./components/CreateUser.js"; import ViewUsers from "./components/ViewUsers.js"; +import ManageProfile from "./components/ManageProfile.js"; import DailyData from "./components/DailyData.js"; import CreateGoal from "./components/CreateGoal.js"; @@ -27,7 +28,7 @@ import { import HomeIcon from "@mui/icons-material/Home"; import LoginIcon from "@mui/icons-material/Login"; -// import AccountCircleIcon from "@mui/icons-material/AccountCircle"; +import AccountCircleIcon from "@mui/icons-material/AccountCircle"; import EditNoteIcon from "@mui/icons-material/EditNote"; import TrackChangesIcon from "@mui/icons-material/TrackChanges"; import CloseIcon from "@mui/icons-material/Close"; @@ -141,6 +142,16 @@ function App() { + + + + {" "} + {" "} + + + + + @@ -173,6 +184,7 @@ function App() { } /> } /> } /> + } /> } /> } /> } /> diff --git a/code/client/src/components/ManageProfile.js b/code/client/src/components/ManageProfile.js new file mode 100644 index 000000000..8e5239ded --- /dev/null +++ b/code/client/src/components/ManageProfile.js @@ -0,0 +1,42 @@ +//will update this file with better error handling as per Mosh video + +import { useEffect, useState } from "react"; +import apiClient from "../services/apiClient.js"; +import { + Box, + Typography +} from "@mui/material"; +import { box, bigTitle } from "./style/styles.js"; +function ManageProfile() { + const [data, setData] = useState([{}]); + + useEffect(() => { + apiClient + .get("/view-users") + .then((res) => { + setData(res.data); + }) + .catch((err) => { + console.log(err); + }); + }, []); + + return ( + + + Manage Profile + + {typeof data === "undefined" ? ( +

Loading...

+ ) : ( + data.map((user, i) => ( +

+ {i + 1}. ID: {user.userId} | Name: {user.name} | Email: {user.email} +

+ )) + )} + + ); +} + +export default ManageProfile; diff --git a/code/server/server.js b/code/server/server.js index 4052f810c..10eb0a784 100644 --- a/code/server/server.js +++ b/code/server/server.js @@ -30,10 +30,11 @@ app.get('/check-connection', async (req, res) => { res.sendStatus(200) }) -app.get('/view-users', async (req, res) => { - allUsers = await User.find({}) - res.json(allUsers) -}) +// app.get('/view-users', async (req, res) => { +// console.log("Request received at /manage-profile"); +// allUsers = await User.find({}) +// res.json(allUsers) +// }) app.post('/create-user', async (req, res) => { From b95d8834911599e71ba3711ab9de24e996c0ffb9 Mon Sep 17 00:00:00 2001 From: Amanda Yee Date: Tue, 1 Oct 2024 23:37:05 -0400 Subject: [PATCH 03/14] render page --- code/client/src/components/ManageProfile.js | 35 +++++++++++++-------- code/client/src/services/apiClient.js | 2 +- code/server/server.js | 23 +++++++++++--- 3 files changed, 41 insertions(+), 19 deletions(-) diff --git a/code/client/src/components/ManageProfile.js b/code/client/src/components/ManageProfile.js index 8e5239ded..ef634cb88 100644 --- a/code/client/src/components/ManageProfile.js +++ b/code/client/src/components/ManageProfile.js @@ -1,39 +1,48 @@ -//will update this file with better error handling as per Mosh video - import { useEffect, useState } from "react"; import apiClient from "../services/apiClient.js"; + import { Box, Typography } from "@mui/material"; -import { box, bigTitle } from "./style/styles.js"; +import {box, bigTitle } from "./style/styles.js"; + function ManageProfile() { - const [data, setData] = useState([{}]); + + const [data, setData] = useState(null); // To store the profile data + const [error, setError] = useState(null); // To handle errors useEffect(() => { apiClient - .get("/view-users") + .get("/manage-profile") // Fetch user profile data from the backend (e.g., /manage-profile) .then((res) => { - setData(res.data); + setData(res.data); }) .catch((err) => { + setError("Error fetching profile data. Try refreshing."); console.log(err); }); }, []); + if (error) { + console.log(data) + return

{error}

; + } + return ( Manage Profile - {typeof data === "undefined" ? ( -

Loading...

+ {/* If there is data returned, render the below in
section */} + {data ? ( +
+

Name: {data.name}

+

Email: {data.email}

+

Password: {data.passwordHashed}

+
) : ( - data.map((user, i) => ( -

- {i + 1}. ID: {user.userId} | Name: {user.name} | Email: {user.email} -

- )) +

No profile data available

)} ); diff --git a/code/client/src/services/apiClient.js b/code/client/src/services/apiClient.js index d2b184afe..3d72d10d1 100644 --- a/code/client/src/services/apiClient.js +++ b/code/client/src/services/apiClient.js @@ -7,7 +7,7 @@ import axios from 'axios'; // }); const apiClient = axios.create({ - baseURL: 'https://peak-performance-backend-394f316db343.herokuapp.com/', // Default to localhost for development + baseURL: 'http://localhost:5000' // 'https://peak-performance-backend-394f316db343.herokuapp.com/', // Default to localhost for development }); export default apiClient; \ No newline at end of file diff --git a/code/server/server.js b/code/server/server.js index 860d9afb5..1881cca50 100644 --- a/code/server/server.js +++ b/code/server/server.js @@ -30,11 +30,24 @@ app.get('/check-connection', async (req, res) => { res.sendStatus(200) }) -// app.get('/view-users', async (req, res) => { -// console.log("Request received at /manage-profile"); -// allUsers = await User.find({}) -// res.json(allUsers) -// }) +app.get('/view-users', async (req, res) => { + const allUsers = await User.find({}) + res.json(allUsers) +}) + +app.get('/manage-profile', async (req, res) => { + try { + // NEED TO UPDATE THIS TO GRAB USER ID FROM LOCAL STORAGE + const userId = 10001 // req.userId; + const userProfile = await User.findOne({ userId }); + if (!userProfile) { + return res.status(404).json({ error: "User not found" }); + } + res.json(userProfile); + } catch (error) { + res.status(500).json({ error: "Server error" }); + } +}); app.post('/create-user', async (req, res) => { From e5fcafe8181650c19d0727b99339410e00973ccd Mon Sep 17 00:00:00 2001 From: Amanda Yee Date: Wed, 2 Oct 2024 23:39:26 -0400 Subject: [PATCH 04/14] add gender, dob, height as fields for user --- code/server/db.js | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/code/server/db.js b/code/server/db.js index fd4d690e4..cdcf0b957 100644 --- a/code/server/db.js +++ b/code/server/db.js @@ -43,6 +43,12 @@ let userSchema = new Schema({ email: { type: String, required: true }, passwordHashed: { type: String, required: true }, name: { type: String, required: true }, + gender: { type: String, default: "" }, + dob: { type: Date, default: null }, + height: { + feet: { type: Number, default: 0 }, + inches: { type: Number, default: 0 } + }, createdAt: { type: Date, default: Date.now }, goals: {type: [goalSchema], default: [] } }, { From 7a6a3ae963de6c97620cecf3a79119bec8d3c6fc Mon Sep 17 00:00:00 2001 From: Amanda Yee Date: Wed, 2 Oct 2024 23:43:12 -0400 Subject: [PATCH 05/14] make defaults null --- code/client/src/components/ManageProfile.js | 3 +++ code/server/db.js | 6 +++--- 2 files changed, 6 insertions(+), 3 deletions(-) diff --git a/code/client/src/components/ManageProfile.js b/code/client/src/components/ManageProfile.js index ef634cb88..b7c96dcd9 100644 --- a/code/client/src/components/ManageProfile.js +++ b/code/client/src/components/ManageProfile.js @@ -40,6 +40,9 @@ function ManageProfile() {

Name: {data.name}

Email: {data.email}

Password: {data.passwordHashed}

+

Gender: {data.gender}

+

Date of Birth: {data.dob}

+

Height: {data.height.feet} {data.height.inches}

) : (

No profile data available

diff --git a/code/server/db.js b/code/server/db.js index cdcf0b957..4e019d95f 100644 --- a/code/server/db.js +++ b/code/server/db.js @@ -43,11 +43,11 @@ let userSchema = new Schema({ email: { type: String, required: true }, passwordHashed: { type: String, required: true }, name: { type: String, required: true }, - gender: { type: String, default: "" }, + gender: { type: String, default: null }, dob: { type: Date, default: null }, height: { - feet: { type: Number, default: 0 }, - inches: { type: Number, default: 0 } + feet: { type: Number, default: null }, + inches: { type: Number, default: null } }, createdAt: { type: Date, default: Date.now }, goals: {type: [goalSchema], default: [] } From 61d1a7623024c0fb463159999d4d192ff7ad6550 Mon Sep 17 00:00:00 2001 From: Amanda Yee Date: Thu, 3 Oct 2024 00:04:59 -0400 Subject: [PATCH 06/14] update UI to be form style --- code/client/src/components/ManageProfile.js | 158 +++++++++++++++++--- code/server/server.js | 2 +- 2 files changed, 138 insertions(+), 22 deletions(-) diff --git a/code/client/src/components/ManageProfile.js b/code/client/src/components/ManageProfile.js index b7c96dcd9..2cc3562ad 100644 --- a/code/client/src/components/ManageProfile.js +++ b/code/client/src/components/ManageProfile.js @@ -1,15 +1,18 @@ import { useEffect, useState } from "react"; import apiClient from "../services/apiClient.js"; - -import { - Box, - Typography -} from "@mui/material"; -import {box, bigTitle } from "./style/styles.js"; +import { Box, Typography, TextField, MenuItem, Button } from "@mui/material"; +import { box, bigTitle, inputBackground, menuPropsStyles, submitButton } from "./style/styles.js"; function ManageProfile() { - const [data, setData] = useState(null); // To store the profile data + const [data, setData] = useState({ + name: "", + email: "", + passwordHashed: "", + gender: "", + dob: "", + height: { feet: "", inches: "" }, + }); // To store the profile data const [error, setError] = useState(null); // To handle errors useEffect(() => { @@ -24,10 +27,39 @@ function ManageProfile() { }); }, []); - if (error) { - console.log(data) - return

{error}

; - } + // Handle input changes + const handleChange = (e) => { + const { name, value } = e.target; + setData((prevData) => ({ + ...prevData, + [name]: value, + })); + }; + + // Handle input change for height + const handleHeightChange = (e) => { + const { name, value } = e.target; + setData((prevData) => ({ + ...prevData, + height: { ...prevData.height, [name]: value }, + })); + }; + + const handleSubmit = () => { + apiClient + .post("/manage-profile", data) + .then((res) => { + console.log("Profile updated successfully"); + }) + .catch((err) => { + console.log("Error updating profile", err); + }); + }; + +// if (error) { +// console.log(data) +// return

{error}

; +// } return ( @@ -35,17 +67,101 @@ function ManageProfile() { Manage Profile {/* If there is data returned, render the below in
section */} - {data ? ( -
-

Name: {data.name}

-

Email: {data.email}

-

Password: {data.passwordHashed}

-

Gender: {data.gender}

-

Date of Birth: {data.dob}

-

Height: {data.height.feet} {data.height.inches}

-
+ {error ? ( +

{error}

) : ( -

No profile data available

+
+ + + + + Male + Female + Non-Binary + Prefer not to disclose + + + + + + )} ); diff --git a/code/server/server.js b/code/server/server.js index 1881cca50..c5878d22a 100644 --- a/code/server/server.js +++ b/code/server/server.js @@ -37,7 +37,7 @@ app.get('/view-users', async (req, res) => { app.get('/manage-profile', async (req, res) => { try { - // NEED TO UPDATE THIS TO GRAB USER ID FROM LOCAL STORAGE + // TO DO: UPDATE THIS TO GRAB USER ID FROM LOCAL STORAGE, rather than hardcode const userId = 10001 // req.userId; const userProfile = await User.findOne({ userId }); if (!userProfile) { From e92855b0865c29d383476204235ef782ef2a50bd Mon Sep 17 00:00:00 2001 From: Amanda Yee Date: Thu, 3 Oct 2024 22:31:51 -0400 Subject: [PATCH 07/14] testing dob update --- code/server/db.js | 8 ++++---- code/server/server.js | 9 +++++++++ 2 files changed, 13 insertions(+), 4 deletions(-) diff --git a/code/server/db.js b/code/server/db.js index 4e019d95f..6837e5e16 100644 --- a/code/server/db.js +++ b/code/server/db.js @@ -43,11 +43,11 @@ let userSchema = new Schema({ email: { type: String, required: true }, passwordHashed: { type: String, required: true }, name: { type: String, required: true }, - gender: { type: String, default: null }, - dob: { type: Date, default: null }, + gender: { type: String, default: "na" }, + dob: { type: Date, default: new Date('1900-01-01') }, height: { - feet: { type: Number, default: null }, - inches: { type: Number, default: null } + feet: { type: Number, default: 0 }, + inches: { type: Number, default: 0 } }, createdAt: { type: Date, default: Date.now }, goals: {type: [goalSchema], default: [] } diff --git a/code/server/server.js b/code/server/server.js index c5878d22a..3eb27acc0 100644 --- a/code/server/server.js +++ b/code/server/server.js @@ -49,6 +49,15 @@ app.get('/manage-profile', async (req, res) => { } }); +app.post('/manage-profile', async (req, res) => { + try { + + } catch (error) { + res.status(500).json({ error: "Error updating profile" }); + } +}); + + app.post('/create-user', async (req, res) => { try { From 04803a619cd5e262d68280486a1321f2eb9c5518 Mon Sep 17 00:00:00 2001 From: Amanda Yee Date: Thu, 3 Oct 2024 22:32:33 -0400 Subject: [PATCH 08/14] finish commit for testing --- code/client/src/components/ManageProfile.js | 56 ++++++++++++++------- 1 file changed, 37 insertions(+), 19 deletions(-) diff --git a/code/client/src/components/ManageProfile.js b/code/client/src/components/ManageProfile.js index 2cc3562ad..7c5c005f8 100644 --- a/code/client/src/components/ManageProfile.js +++ b/code/client/src/components/ManageProfile.js @@ -12,8 +12,8 @@ function ManageProfile() { gender: "", dob: "", height: { feet: "", inches: "" }, - }); // To store the profile data - const [error, setError] = useState(null); // To handle errors + }); + const [error, setError] = useState(null); useEffect(() => { apiClient @@ -30,10 +30,23 @@ function ManageProfile() { // Handle input changes const handleChange = (e) => { const { name, value } = e.target; - setData((prevData) => ({ - ...prevData, - [name]: value, - })); + // setData((prevData) => ({ + // ...prevData, + // [name]: value, + // })); + if (name === 'dob') { + // Convert the string date back to a Date object + const dateValue = new Date(value); // `value` will be in "yyyy-MM-dd" format + setData((prevData) => ({ + ...prevData, + [name]: dateValue, + })); + } else { + setData((prevData) => ({ + ...prevData, + [name]: value, + })); + } }; // Handle input change for height @@ -47,7 +60,7 @@ function ManageProfile() { const handleSubmit = () => { apiClient - .post("/manage-profile", data) + .post("/manage-profile", data) // Post user to back end .then((res) => { console.log("Profile updated successfully"); }) @@ -56,10 +69,14 @@ function ManageProfile() { }); }; -// if (error) { -// console.log(data) -// return

{error}

; -// } + const formatDate = (date) => { + if (!date) return ''; // Handle cases where date might be null or undefined + const year = date.getFullYear(); + console.log(year) + const month = String(date.getMonth() + 1).padStart(2, '0'); // Months are zero-indexed + const day = String(date.getDate()).padStart(2, '0'); + return `${year}-${month}-${day}`; // Returns 'yyyy-MM-dd' + }; return ( @@ -79,7 +96,7 @@ function ManageProfile() { fullWidth margin="normal" sx={inputBackground} - MenuProps={menuPropsStyles} + menuprops={menuPropsStyles} /> Male Female @@ -122,7 +139,8 @@ function ManageProfile() { label="Date of Birth" name="dob" type="date" - value={data.dob} + value = {data.dob} + // value={formatDate(data.dob)} onChange={handleChange} fullWidth margin="normal" @@ -130,7 +148,7 @@ function ManageProfile() { shrink: true, }} sx={inputBackground} - MenuProps={menuPropsStyles} + menuprops={menuPropsStyles} /> )} + {errorMessage &&

{errorMessage}

} + {successMessage &&

{successMessage}

} ); } From 0a2e6bf15fdb7d8872ec8fd4a64f17d97454b827 Mon Sep 17 00:00:00 2001 From: Amanda Yee Date: Fri, 4 Oct 2024 09:26:35 -0400 Subject: [PATCH 13/14] update hardcoded user to 10001 --- code/server/server.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/code/server/server.js b/code/server/server.js index f794f8a7c..8b1991047 100644 --- a/code/server/server.js +++ b/code/server/server.js @@ -38,7 +38,7 @@ app.get('/view-users', async (req, res) => { app.get('/manage-profile', async (req, res) => { try { // TO DO: UPDATE THIS TO GRAB USER ID FROM LOCAL STORAGE, rather than hardcode - const userId = 10003 // req.userId; + const userId = 10001 // req.userId; const userProfile = await User.findOne({ userId }); if (!userProfile) { return res.status(404).json({ error: "User not found" }); From 10bf9ec2d83123d5577ace82eeb9db1256249531 Mon Sep 17 00:00:00 2001 From: Amanda Yee Date: Fri, 4 Oct 2024 09:32:14 -0400 Subject: [PATCH 14/14] remove old code --- code/client/src/components/ManageProfile.js | 20 +++++--------------- 1 file changed, 5 insertions(+), 15 deletions(-) diff --git a/code/client/src/components/ManageProfile.js b/code/client/src/components/ManageProfile.js index 224a083c3..8fc475482 100644 --- a/code/client/src/components/ManageProfile.js +++ b/code/client/src/components/ManageProfile.js @@ -33,20 +33,10 @@ function ManageProfile() { // Handle input changes const handleChange = (e) => { const { name, value } = e.target; - if (name === 'dob') { - console.log("Date:", value) - // Convert the string date back to a Date object - const dateValue = new Date(value); // `value` will be in "yyyy-MM-dd" format - setProfileData((prevData) => ({ - ...prevData, - [name]: dateValue, - })); - } else { - setProfileData((prevData) => ({ - ...prevData, - [name]: value, - })); - } + setProfileData((prevData) => ({ + ...prevData, + [name]: value, + })); }; // Handle input change for height @@ -88,7 +78,7 @@ function ManageProfile() { Manage Profile - {/* If there is data returned, render the below in
section */} + {/* If there is data returned, renders in below section */} {error ? (

{error}

) : (