user saved with localStorage

Arquisoft · Mar 11, 2024 · 95198ed · 95198ed
1 parent f12dd2b
commit 95198ed
Show file tree

Hide file tree

Showing 4 changed files with 16 additions and 42 deletions.
diff --git a/webapp/src/App.tsx b/webapp/src/App.tsx
@@ -1,26 +1,14 @@
 import { BrowserRouter } from "react-router-dom";
 import { AppRouter } from "./Router";
-import { createContext, useContext, useState } from "react"
-import { User, UserContexType } from "./common/types";
 
-export const UserContext = createContext<UserContexType>({} as UserContexType);
-export const UserData = () => useContext(UserContext);
+
 
 /** The old code is not in /pages/init/index.tsx and is shown as default */
 function App() {
-  let myUser: User = {
-    name: "Usuario", points: "0", isAuthenticated: false
-  }
-  const [user, setUser] = useState<User>(myUser);
-
-  //const userProviderValue: UserContexType = useMemo(()=>({AuthUser : user, setAuthUser: setUser}), [user, setUser])
-
   return (
-    <UserContext.Provider value={{AuthUser : user, setAuthUser: setUser}}>
       <BrowserRouter>
         <AppRouter />      
       </BrowserRouter>
-    </UserContext.Provider>
   );
 }
 

diff --git a/webapp/src/common/types.tsx b/webapp/src/common/types.tsx
diff --git a/webapp/src/components/Login.tsx b/webapp/src/components/Login.tsx
@@ -4,8 +4,6 @@ import axios from 'axios';
 import { Container, Typography, TextField, Snackbar, Button, Stack } from '@mui/material';
 import { useTranslation } from 'react-i18next';
 import { useNavigate } from "react-router-dom";
-import { UserData } from 'src/App';
-import { User } from "../common/types";
 
 
 type ActionProps = {
@@ -20,24 +18,21 @@ const Login = (props: ActionProps) => {
   const [username, setUsername] = useState('');
   const [password, setPassword] = useState('');
   const [error, setError] = useState('');
-  const { setAuthUser} = UserData();
   const [openSnackbar, setOpenSnackbar] = useState(false);
 
   const apiEndpoint = process.env.REACT_APP_API_ENDPOINT || 'http://localhost:8000';
 
   const loginUser = async () => {
 
     try {
-      await axios.post(`${apiEndpoint}/login`, { username, password });
-
-      var user:User = {
-        name: username, 
-        points: "10", 
-        isAuthenticated: true
-      }
-
-
-      setAuthUser(user);
+      localStorage.clear();
+      const user = await axios.post(`${apiEndpoint}/login`, { username, password });
+
+      console.log(user.data);
+      localStorage.setItem("username", user.data.username);
+      localStorage.setItem("score", user.data.totalScore);
+      localStorage.setItem("nWins", user.data.nWins);
+      localStorage.setItem("uuid", user.data.uuid);
       // Extract data from the response
 
       setOpenSnackbar(true);

diff --git a/webapp/src/pages/userProfile/index.tsx b/webapp/src/pages/userProfile/index.tsx
@@ -1,17 +1,18 @@
 import { useTranslation } from 'react-i18next';
-import { UserData } from 'src/App';
 import { Container } from '@mui/material';
 
 const ProfilePage = () => {
     const { t } = useTranslation();
-    const {AuthUser} = UserData();
+    const user =  localStorage.getItem("username");
+    const score = localStorage.getItem("totalScore");
+    const nwins = localStorage.getItem("nwins");
+
     return(
         <Container sx={{ mt: 9 }} maxWidth="xl">
             <div >
-                <p>{t('profile_name')}</p>
-                <p>{AuthUser.name}</p>
-                <p>{t('profile_points')}</p>
-                <p>{AuthUser.points}</p>
+                <p>{t('profile_name')} { JSON.stringify(user)}</p>
+                <p>{t('profile_points')} { JSON.stringify(Number(score)) }</p>
+                <p>{t('profile_nwins')} { JSON.stringify(Number(nwins)) }</p>
             </div>
         </Container>
     )