diff --git a/code/client/src/App.js b/code/client/src/App.js
index b9c64ab2d..03572eba8 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";
import React, { useState, useEffect } from 'react';
@@ -28,7 +29,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";
@@ -170,6 +171,16 @@ function App() {
+
+
+
+ {" "}
+ {" "}
+
+
+
+
+
@@ -202,6 +213,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..8fc475482
--- /dev/null
+++ b/code/client/src/components/ManageProfile.js
@@ -0,0 +1,223 @@
+import { useEffect, useState } from "react";
+import apiClient from "../services/apiClient.js";
+import { Box, Typography, TextField, MenuItem, Button } from "@mui/material";
+import { box, bigTitle, inputBackground, menuPropsStyles, submitButton } from "./style/styles.js";
+
+function ManageProfile() {
+
+ const [profileData, setProfileData] = useState({
+ userId: "",
+ email: "",
+ name: "",
+ gender: "",
+ dob: { year: 1900, month: 1, day: 1 },
+ height: { feet: "", inches: "" },
+ });
+
+ const [error, setError] = useState(null);
+ const [successMessage, setSuccessMessage] = useState('');
+ const [errorMessage, setErrorMessage] = useState('');
+
+ useEffect(() => {
+ apiClient
+ .get("/manage-profile") // Fetch user profile data from the backend (e.g., /manage-profile)
+ .then((res) => {
+ setProfileData(res.data);
+ })
+ .catch((err) => {
+ setError("Error fetching profile data. Try refreshing.");
+ console.log(err);
+ });
+ }, []);
+
+ // Handle input changes
+ const handleChange = (e) => {
+ const { name, value } = e.target;
+ setProfileData((prevData) => ({
+ ...prevData,
+ [name]: value,
+ }));
+ };
+
+ // Handle input change for height
+ const handleHeightChange = (e) => {
+ const { name, value } = e.target;
+ setProfileData((prevData) => ({
+ ...prevData,
+ height: { ...prevData.height, [name]: value },
+ }));
+ };
+
+ const handleDobChange = (e) => {
+ const { name, value } = e.target;
+ setProfileData((prevData) => ({
+ ...prevData,
+ dob: { ...prevData.dob, [name]: Number(value) }, // Convert to Number
+ }));
+ };
+
+ const handleSubmit = async (event) => {
+ event.preventDefault(); // Prevent default form submission behavior (e.g., page reload)
+
+ // Clear any existing messages before processing the form
+ setSuccessMessage('');
+ setErrorMessage('');
+
+ try {
+ await apiClient.post("/manage-profile", profileData);
+ console.log("Updating profile")
+ setSuccessMessage('Profile updated!');
+ } catch (err) {
+ console.log("Error updating profile", err);
+ setErrorMessage('Error: Failed to update profile. Please try again');
+ }
+ };
+
+ return (
+
+
+ Manage Profile
+
+ {/* If there is data returned, renders in below section */}
+ {error ? (
+ {error}
+ ) : (
+
+ )}
+ {errorMessage && {errorMessage}
}
+ {successMessage && {successMessage}
}
+
+ );
+}
+
+export default ManageProfile;
diff --git a/code/server/db.js b/code/server/db.js
index fccbfc046..074479b9a 100644
--- a/code/server/db.js
+++ b/code/server/db.js
@@ -43,6 +43,16 @@ let userSchema = new Schema({
email: { type: String, required: true },
passwordHashed: { type: String, required: true },
name: { type: String, required: true },
+ gender: { type: String, default: "na" },
+ dob: {
+ year: { type: Number, default: 1900, min: 1900, max: 2024 },
+ month: { type: Number, default: 1, min: 1, max: 12 },
+ day: { type: Number, default: 1, min: 1, max: 31 },
+ },
+ height: {
+ feet: { type: Number, default: 0, min: 0, max: 7 },
+ inches: { type: Number, default: 0, min: 0, max: 12 }
+ },
createdAt: { type: Date, default: Date.now },
goals: {type: [goalSchema], default: [] }
}, {
diff --git a/code/server/server.js b/code/server/server.js
index 2290c3b26..419e77c96 100644
--- a/code/server/server.js
+++ b/code/server/server.js
@@ -32,10 +32,53 @@ app.get('/check-connection', async (req, res) => {
})
app.get('/view-users', async (req, res) => {
- allUsers = await User.find({})
+ const allUsers = await User.find({})
res.json(allUsers)
})
+app.get('/manage-profile', async (req, res) => {
+ try {
+ // 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) {
+ return res.status(404).json({ error: "User not found" });
+ }
+ res.json(userProfile);
+ } catch (error) {
+ res.status(500).json({ error: "Server error" });
+ }
+});
+
+app.post('/manage-profile', async (req, res) => {
+ try {
+ const { userId, name, gender, dob, height } = req.body;
+
+ // Find user in the database using userId
+ const userProfile = await User.findOne({ userId });
+
+ // Check if user exists
+ if (!userProfile) {
+ return res.status(404).json({ error: "User not found" });
+ }
+
+ // Update the profile with the new values
+ userProfile.name = name;
+ userProfile.gender = gender;
+ userProfile.dob = dob;
+ userProfile.height = height;
+
+ // Save the updated user profile
+ await userProfile.save();
+
+ // Send a success response
+ res.status(200).json({ message: "Profile updated successfully", userProfile });
+ } catch (error) {
+ console.error(error); // Log the error for debugging
+ res.status(500).json({ message: "Error updating profile" });
+ }
+});
+
app.post('/create-user', async (req, res) => {
try {