Adrian

package.json

@@ -0,0 +1,8 @@
+{
+  "dependencies": {
+    "@chakra-ui/react": "^2.8.2",
+    "@emotion/react": "^11.11.4",
+    "@emotion/styled": "^11.11.0",
+    "framer-motion": "^11.0.12"
+  }
+}

users/userservice/database/game-model.js

@@ -0,0 +1,29 @@
+const mongoose = require('mongoose');
+const User = require('./user-model');
+
+const gameSchema = new mongoose.Schema({
+    correct_answers: {
+      type: Number,
+      required: true,
+    },
+    failed_answers: {
+      type: Number,
+      required: true,
+    },
+    punctuation: {
+      type: Number,
+      required: true,
+    },
+    time: {
+      type: TimeStamp,
+      required: true,
+    },
+    user: {
+      type: User,
+      required: true,
+    },
+});
+
+const Game = mongoose.model('Game', gameSchema, 'Game');
+
+module.exports = Game

users/userservice/database/history-model.js

@@ -0,0 +1,28 @@
+const mongoose = require('mongoose');
+
+const historySchema = new mongoose.Schema({
+    total_correct_answers: {
+      type: Number,
+      required: true,
+    },
+    total_failed_answers: {
+      type: Number,
+      required: true,
+    },
+    total_punctuation: {
+      type: Number,
+      required: true,
+    },
+    total_time: {
+      type: TimeStamp,
+      required: true,
+    },
+    user: {
+      type: User,
+      required: true,
+    },
+});
+
+const History = mongoose.model('History', historySchema, 'History');
+
+module.exports = History

users/userservice/user-service.js

@@ -34,13 +34,18 @@ app.post('/adduser', async (req, res) => {
         // Encrypt the password before saving it
         const hashedPassword = await bcrypt.hash(req.body.password, 10);
 
-        const newUser = new User({
+        const user = await User.findOne({ username: req.body.username });
+        if (user) {
+          res.status(401).json({ error: error.message }); 
+        }else{
+          const newUser = new User({
             username: req.body.username,
             password: hashedPassword,
-        });
+          });
 
-        await newUser.save();
-        res.json(newUser);
+          await newUser.save();
+          res.json(newUser);
+        }
     } catch (error) {
         res.status(400).json({ error: error.message }); 
     }});

webapp/package.json

@@ -4,13 +4,14 @@
   "private": true,
   "dependencies": {
     "@chakra-ui/react": "^2.8.2",
-    "@emotion/react": "^11.11.3",
+    "@emotion/react": "^11.11.4",
     "@emotion/styled": "^11.11.0",
     "@mui/material": "^5.15.3",
     "@testing-library/jest-dom": "^5.17.0",
     "@testing-library/react": "^14.1.2",
     "@testing-library/user-event": "^14.5.2",
     "axios": "^1.6.5",
+    "framer-motion": "^11.0.12",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-scripts": "5.0.1",

webapp/src/App.js

@@ -15,6 +15,7 @@ function App() {
   const [showLogin, setShowLogin] = useState(true);
   const [showGame, setShowGame] = useState(false); // Nuevo estado para controlar si se muestra el juego
   const [showWelcomeMessage, setShowWelcomeMessage] = useState(true); // Estado para controlar la visibilidad del mensaje de bienvenida y los enlaces
+  const [showAddUser, setShowAddUser] = useState(false);
 
 
   const handleToggleView = () => {
@@ -27,6 +28,7 @@ function App() {
     setShowLogin(false);
     setShowGame(true);
     setShowWelcomeMessage(false);
+    setShowAddUser(false);
   };
 
   return (
@@ -35,7 +37,7 @@ function App() {
       {/* Mostrar el mensaje de bienvenida y los enlaces solo si showWelcomeMessage es true */}
       {showWelcomeMessage && (
         <Typography component="h1" variant="h5" align="center" sx={{ marginTop: 2 }}>
-          Welcome to the 2024 edition of the Software Architecture course
+          Welcome to Wiq-es05
           <Typography component="div" align="center" sx={{ marginTop: 2 }}>
             {showLogin ? (
               <Link name="gotoregister" component="button" variant="body2" onClick={handleToggleView}>
@@ -51,7 +53,11 @@ function App() {
       )}
 
       {showLogin && <Login startGame={startGame} />}
-      {!showLogin && !showGame && <AddUser />}
+      {!showLogin && !showGame && (
+          <ChakraProvider>
+            <AddUser />
+          </ChakraProvider>
+      )}
       {showGame && (
         <ChakraProvider>
           <Game />

webapp/src/components/AddUser.js

@@ -1,22 +1,37 @@
 // src/components/AddUser.js
 import React, { useState } from 'react';
 import axios from 'axios';
-import { Container, Typography, TextField, Button, Snackbar } from '@mui/material';
+import { Box, Center, Text, Input, Button, FormControl, FormLabel, Alert } from '@chakra-ui/react';
+import { QuestionArea } from './QuestionArea';
 
 const apiEndpoint = process.env.REACT_APP_API_URI || 'http://localhost:8000';
 
 const AddUser = () => {
   const [username, setUsername] = useState('');
   const [password, setPassword] = useState('');
+  const [repPassword, setRepPassword] = useState('');
   const [error, setError] = useState('');
   const [openSnackbar, setOpenSnackbar] = useState(false);
 
   const addUser = async () => {
     try {
+      if(password.length < 6){
+        setError("Password must have at least 6 characters");
+        return;
+      }
+      if(password !== repPassword){
+        setError("Passwords don't match");
+        return;
+      }
+
       await axios.post(`${apiEndpoint}/adduser`, { username, password });
       setOpenSnackbar(true);
     } catch (error) {
-      setError(error.response.data.error);
+      if (error.response && error.response.data && error.response.data.error) {
+          setError(error.response.data.error);
+      } else {
+          setError("An unexpected error occurred");
+      }
     }
   };
 
@@ -25,35 +40,53 @@ 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>
+    <Center h="100vh" w="100vw" bgGradient="linear(to-t, #08313A, #107869)">
+      <Box p="100" w="100%" h="35%" maxW="md" display="flex" flexDirection="column" justifyContent="center" alignItems="center" gap={14} bg="white">
+          <Text as="b" fontSize="3xl" mb="4">
+            Create account
+          </Text>
+          <FormControl>
+            <FormLabel>Username</FormLabel>
+            <Input
+              name="username"
+              margin="normal"
+              value={username}
+              onChange={(e) => setUsername(e.target.value)}
+            />
+            <FormLabel>Password</FormLabel>
+            <Input
+              name="password"
+              margin="normal"
+              type="password"
+              value={password}
+              onChange={(e) => setPassword(e.target.value)}
+            />
+            <FormLabel>Repeat Password</FormLabel>
+            <Input
+              name="repeat password"
+              margin="normal"
+              type="password"
+              value={repPassword}
+              onChange={(e) => setRepPassword(e.target.value)}
+            />
+          </FormControl>
+          <Button variant="solid" onClick={addUser} textAlign="center" 
+                color="white" bgGradient="linear(to-t, #08313A, #107869)" size="lg">
+            Add user
+          </Button>
+          {openSnackbar && (
+            <Alert status="success" marginTop={2} onClose={handleCloseSnackbar}>
+              User added successfully
+            </Alert>
+          )}
+          {/* Alerta para errores */}
+          {error && (
+            <Alert status="error" marginTop={2} onClose={() => setError('')}>
+              Error: {error}
+            </Alert>
+          )}
+        </Box>
+      </Center>
   );
 };