From 6a67e870a47f91f32be1eee6f20653dc8bef3677 Mon Sep 17 00:00:00 2001
From: UO289659 <uo289659@uniovi.es>
Date: Wed, 6 Mar 2024 20:47:45 +0100
Subject: [PATCH 1/2] =?UTF-8?q?Modificado=20user=20model=20para=20incluir?=
 =?UTF-8?q?=20hist=C3=B3rico=20de=20participaci=C3=B3n=20de=20usuario.?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 users/userservice/user-model.js | 10 ++++++++++
 1 file changed, 10 insertions(+)

diff --git a/users/userservice/user-model.js b/users/userservice/user-model.js
index 71d81b5f..0b19badc 100644
--- a/users/userservice/user-model.js
+++ b/users/userservice/user-model.js
@@ -13,6 +13,16 @@ const userSchema = new mongoose.Schema({
       type: Date,
       default: Date.now, 
     },
+    gamesPlayed:{ //Añadido para guardar las partidas en la bbdd
+      type: Number,
+    },
+    rigthAnswers:{
+      type:Number,
+    },
+    wrongAnswers:{
+      type:Number,
+    },
+    
 });
 
 const User = mongoose.model('User', userSchema);

From 9eb838f3cf56519203d950d39fd709e1e29f34d8 Mon Sep 17 00:00:00 2001
From: UO289659 <uo289659@uniovi.es>
Date: Thu, 7 Mar 2024 21:26:33 +0100
Subject: [PATCH 2/2] =?UTF-8?q?A=C3=B1adida=20css=20de=20registro=20y=20ca?=
 =?UTF-8?q?mbiados=20tama=C3=B1os=20de=20los=20contenedores.?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 users/userservice/user-model.js            |   9 --
 webapp/src/components/Inicio.js            |   8 +-
 webapp/src/components/login/Login.js       |   4 +-
 webapp/src/components/{login => }/logo.png | Bin
 webapp/src/components/register/AddUser.css |  65 ++++++++++
 webapp/src/components/register/AddUser.js  | 133 ++++++++++++++++-----
 6 files changed, 174 insertions(+), 45 deletions(-)
 rename webapp/src/components/{login => }/logo.png (100%)
 create mode 100644 webapp/src/components/register/AddUser.css

diff --git a/users/userservice/user-model.js b/users/userservice/user-model.js
index 0b19badc..66dc9b9c 100644
--- a/users/userservice/user-model.js
+++ b/users/userservice/user-model.js
@@ -13,15 +13,6 @@ const userSchema = new mongoose.Schema({
       type: Date,
       default: Date.now, 
     },
-    gamesPlayed:{ //Añadido para guardar las partidas en la bbdd
-      type: Number,
-    },
-    rigthAnswers:{
-      type:Number,
-    },
-    wrongAnswers:{
-      type:Number,
-    },
     
 });
 
diff --git a/webapp/src/components/Inicio.js b/webapp/src/components/Inicio.js
index 49b2c936..8107019b 100644
--- a/webapp/src/components/Inicio.js
+++ b/webapp/src/components/Inicio.js
@@ -2,8 +2,8 @@ import React, { useState } from 'react';
 import CssBaseline from '@mui/material/CssBaseline';
 import Container from '@mui/material/Container';
 import Typography from '@mui/material/Typography';
-import Login from './Login';
-import AddUser from './AddUser';
+import Login from './login/Login';
+import AddUser from './register/AddUser';
 import Link from '@mui/material/Link';
 
 function Inicio() {
@@ -16,8 +16,8 @@ function Inicio() {
   return (
     <Container>
         <CssBaseline />
-      <Typography component="h1" variant="h5" align="center" sx={{ marginTop: 2 }}>
-        Welcome to the 2024 edition of the Software Architecture course
+      <Typography component="h1" variant="h5" align="center"  sx={{ marginTop: 2, fontWeight:"bold" }}>
+        Welcome to WIQ
       </Typography>
       {showLogin ? <Login /> : <AddUser />}
       <Typography component="div" align="center" sx={{ marginTop: 2 }}>
diff --git a/webapp/src/components/login/Login.js b/webapp/src/components/login/Login.js
index 30831c5a..d5313ec1 100644
--- a/webapp/src/components/login/Login.js
+++ b/webapp/src/components/login/Login.js
@@ -4,7 +4,7 @@ import axios from 'axios';
 import { Container, Typography, TextField, Button, Snackbar } from '@mui/material';
 import './Login.css';
 import Link from '@mui/material/Link';
-import logo from './logo.png'
+import logo from '../logo.png'
 
 const Login = () => {
   const [username, setUsername] = useState('');
@@ -39,7 +39,7 @@ const Login = () => {
   
 
   return (
-    <Container component="main" maxWidth="s" sx={{ marginTop: 8 }}>
+    <Container component="main" maxWidth="xs" sx={{ marginTop: 8 }}>
        <div className='logo-container' >
          <img src={logo} alt='Logo wiq'></img>
        </div>
diff --git a/webapp/src/components/login/logo.png b/webapp/src/components/logo.png
similarity index 100%
rename from webapp/src/components/login/logo.png
rename to webapp/src/components/logo.png
diff --git a/webapp/src/components/register/AddUser.css b/webapp/src/components/register/AddUser.css
new file mode 100644
index 00000000..1fee2b12
--- /dev/null
+++ b/webapp/src/components/register/AddUser.css
@@ -0,0 +1,65 @@
+.register-container {
+    display: flex;
+    flex-direction: column;
+    background-color: #fff;
+    padding-bottom: 1.5em;
+    border-radius: 1em;
+    width: 100%;
+  }
+
+.text{
+  margin-top: 20ev;
+  text-align: center;
+  font-size: 20ev;
+  font-weight: bold;
+  font-display: 'Fira Sans', sans-serif;
+}
+
+.underline{
+  width: 20%;
+  margin-top: 7ev;
+  height: 0.5em;
+  border-radius: 9px;
+  background: #EE0E51;
+  align-self: center;
+}
+
+.input{
+  display: flex;
+  flex-direction: column;
+  margin-left: 1em;
+  margin-right: 1em;
+}
+  
+.register-container button {
+  background-color: #EE0E51;
+}
+
+.register-container button:hover {
+  background-color: #A80032;
+}
+
+body {
+  height: 10vh;
+  background: radial-gradient(circle at 50% -20.71%, #ffdfda 0, #ffdfd8 6.25%, #ffe0d5 12.5%, #ffe1d3 18.75%, #fee2d1 25%, #fbe3cf 31.25%, #f8e4ce 37.5%, #f5e5cd 43.75%, #f2e6cd 50%, #eee7cd 56.25%, #ebe8ce 62.5%, #e7e9cf 68.75%, #e3ead0 75%, #dfebd2 81.25%, #dcecd4 87.5%, #d8edd7 93.75%, #d5edda 100%);
+}
+
+.button {
+  display: flex;
+  flex-direction: column;
+  margin-left: 1em;
+  margin-top: 1em;
+  margin-right: 1em;
+}
+
+.logo-container {
+    position: fixed;
+    top: 2em;
+    left: 2em;
+    z-index: 9999;
+}
+
+.logo-container img {
+    width: 30em; 
+    height: auto; 
+  }
\ No newline at end of file
diff --git a/webapp/src/components/register/AddUser.js b/webapp/src/components/register/AddUser.js
index 00d522a2..4b92e48a 100644
--- a/webapp/src/components/register/AddUser.js
+++ b/webapp/src/components/register/AddUser.js
@@ -2,18 +2,29 @@
 import React, { useState } from 'react';
 import axios from 'axios';
 import { Container, Typography, TextField, Button, Snackbar } from '@mui/material';
+import './AddUser.css';
+import logo from '../logo.png'
 
 const apiEndpoint = process.env.REACT_APP_API_ENDPOINT || 'http://localhost:8000';
 
 const AddUser = () => {
+  const [name, setName] = useState('');
+  const [surname, setSurName] = useState('');
   const [username, setUsername] = useState('');
   const [password, setPassword] = useState('');
+  const [passwordRepeat, setPasswordRepeat] = useState('');
   const [error, setError] = useState('');
   const [openSnackbar, setOpenSnackbar] = useState(false);
 
   const addUser = async () => {
     try {
-      await axios.post(`${apiEndpoint}/adduser`, { username, password });
+      await axios.post(`${apiEndpoint}/adduser`, { 
+        name,
+        surname,
+        username, 
+        password,
+        passwordRepeat
+      });
       setOpenSnackbar(true);
     } catch (error) {
       setError(error.response.data.error);
@@ -25,36 +36,98 @@ const AddUser = () => {
   };
 
   return (
-    <Container component="main" maxWidth="xs" sx={{ marginTop: 4 }}>
-      <Typography component="h1" variant="h5">
-        Add User
-      </Typography>
-      <TextField
-        name="username"
-        margin="normal"
-        fullWidth
-        label="Username"
-        value={username}
-        onChange={(e) => setUsername(e.target.value)}
-      />
-      <TextField
-        name="password"
-        margin="normal"
-        fullWidth
-        label="Password"
-        type="password"
-        value={password}
-        onChange={(e) => setPassword(e.target.value)}
-      />
-      <Button variant="contained" color="primary" onClick={addUser}>
-        Add User
-      </Button>
-      <Snackbar open={openSnackbar} autoHideDuration={6000} onClose={handleCloseSnackbar} message="User added successfully" />
-      {error && (
-        <Snackbar open={!!error} autoHideDuration={6000} onClose={() => setError('')} message={`Error: ${error}`} />
-      )}
+    <Container component="main" maxWidth="xs"  className='container'>
+      <div className='logo-container'>
+        <img src={logo} alt='Logo wiq'></img>
+      </div>
+      <div className="register-container" >
+        <div className='text'>
+          <Typography variant="h4">
+            Añadir usuario
+          </Typography>
+        </div>
+        <div className="underline"></div>
+        <div className='input'>
+        <TextField
+          name="name"
+          margin="normal"
+          label="Nombre"
+          value={name}
+          onChange={(e) => setName(e.target.value)}
+          id = "input"
+        />
+        </div>
+        <div className='input'>
+        <TextField
+          name="surname"
+          margin="normal"
+          fullWidth
+          label="Apellidos"
+          value={surname}
+          onChange={(e) => setSurName(e.target.value)}
+          id = "input"
+        />
+        </div>
+        <div className='input'>
+        <TextField
+          name="username"
+          margin="normal"
+          fullWidth
+          label="Nombre de usuario"
+          value={username}
+          onChange={(e) => setUsername(e.target.value)}
+          id = "input"
+        />
+        </div>
+        
+        <div className='input'>
+        <TextField
+          name="password"
+          margin="normal"
+          fullWidth
+          label="Contraseña"
+          type="password"
+          value={password}
+          onChange={(e) => setPassword(e.target.value)}
+          id = "input"
+        />
+        </div>
+        
+        <div className='input'>
+        <TextField
+          name="passwordRepeat"
+          margin="normal"
+          fullWidth
+          label="Repetir contraseña"
+          type="password"
+          value={passwordRepeat}
+          onChange={(e) => setPasswordRepeat(e.target.value)}
+          id = "input"
+        />
+        </div>
+        <div className="underline"></div>
+        <div className='button'>
+        <Button variant="contained" onClick={addUser}>
+          Registrarse
+        </Button>
+        </div>
+        <Snackbar
+          open={openSnackbar}
+          autoHideDuration={6000}
+          onClose={handleCloseSnackbar}
+          message="User registrado correctamente"
+        />
+        {error && (
+          <Snackbar
+            open={!!error}
+            autoHideDuration={6000}
+            onClose={() => setError("")}
+            message={`Error: ${error}`}
+          />
+        )}
+      </div>
     </Container>
   );
 };
 
-export default AddUser;
+export default AddUser;
\ No newline at end of file