From 42e1ebc804a50b3eee7143cc47ec0d65e02c0a60 Mon Sep 17 00:00:00 2001
From: nadinedelia <nadine.delia@yahoo.com>
Date: Wed, 11 Oct 2023 16:34:35 +0700
Subject: [PATCH] fixed statistics FE

---
 frontend/src/App.js                   | 11 +++++++++--
 frontend/src/components/login.js      |  2 +-
 frontend/src/components/statistics.js | 15 ++++++++-------
 3 files changed, 18 insertions(+), 10 deletions(-)

diff --git a/frontend/src/App.js b/frontend/src/App.js
index 5dff2e0..cbcecb7 100644
--- a/frontend/src/App.js
+++ b/frontend/src/App.js
@@ -11,9 +11,16 @@ import Signup from './components/signup';
 
 function App() {
   const [isLoggedIn, setIsLoggedIn] = React.useState(false);
+  const [currentUser, setCurrentUser] = React.useState('');  // Added state for current user
 
   const handleLogout = () => {
     setIsLoggedIn(false); 
+    setCurrentUser('');  // Clear the current user on logout
+  };
+
+  const handleLogin = (username) => {  // Modified to accept a username parameter
+    setIsLoggedIn(true);
+    setCurrentUser(username);  // Set the current user on login
   };
 
   return (
@@ -27,10 +34,10 @@ function App() {
 
         <div className="componentContainer">
           <Routes>
-            <Route path="/login" element={isLoggedIn ? <Navigate to="/" /> : <Login onLogin={() => setIsLoggedIn(true)} />} />
+            <Route path="/login" element={isLoggedIn ? <Navigate to="/" /> : <Login onLogin={handleLogin} />} />
             <Route path="/signup" element={isLoggedIn ? <Navigate to="/" /> : <Signup onSignup={() => setIsLoggedIn(true)} />} />
             <Route path="/trackExercise" element={isLoggedIn ? <TrackExercise /> : <Navigate to="/login" />} />
-            <Route path="/statistics" element={isLoggedIn ? <Statistics /> : <Navigate to="/login" />} />
+            <Route path="/statistics" element={isLoggedIn ? <Statistics currentUser={currentUser} /> : <Navigate to="/login" />} />
             <Route path="/" element={isLoggedIn ? <Navigate to="/trackExercise" /> : <Navigate to="/login" />} />
           </Routes>
         </div>
diff --git a/frontend/src/components/login.js b/frontend/src/components/login.js
index dd2e7dc..cb60bf5 100644
--- a/frontend/src/components/login.js
+++ b/frontend/src/components/login.js
@@ -18,7 +18,7 @@ const Login = ({ onLogin }) => {
       });
 
       if (response.status === 200) {
-        onLogin();
+        onLogin(username);
       } else {
         setError('Invalid credentials');
       }
diff --git a/frontend/src/components/statistics.js b/frontend/src/components/statistics.js
index de072a1..d5d6e44 100644
--- a/frontend/src/components/statistics.js
+++ b/frontend/src/components/statistics.js
@@ -1,7 +1,7 @@
 import React, { useState, useEffect } from 'react';
 import axios from 'axios';
 
-const Statistics = () => {
+const Statistics = ({ currentUser }) => {
   const [data, setData] = useState([]);
 
   useEffect(() => {
@@ -9,27 +9,28 @@ const Statistics = () => {
 
     axios.get(url)
       .then(response => {
-        setData(response.data.stats);
+        const userData = response.data.stats.find(user => user.username === currentUser);
+        setData(userData ? userData.exercises : []);
       })
       .catch(error => {
         console.error('There was an error fetching the data!', error);
       });
-  }, []);
+  }, [currentUser]);
 
   return (
     <div>
       {data && data.length > 0 ? (
         data.map((item, index) => (
           <div key={index}>
-            <p>Exercise Type: {item._id}</p>
-            <p>Total Duration: {item.duration}</p>
+            <p>Exercise Type: {item.exerciseType}</p>
+            <p>Total Duration: {item.totalDuration}</p>
           </div>
         ))
       ) : (
-        <p>No data available</p>
+        <p>No data available for {currentUser}</p>
       )}
     </div>
   );
 };
 
-export default Statistics;
+export default Statistics;
\ No newline at end of file