added a field to confirm the password

Arquisoft · Apr 23, 2024 · c7ee24c · c7ee24c
1 parent 6b4c954
commit c7ee24c
Show file tree

Hide file tree

Showing 2 changed files with 27 additions and 7 deletions.
diff --git a/webapp/src/components/AddUser.js b/webapp/src/components/AddUser.js
@@ -12,18 +12,24 @@ const AddUser = () => {
   const [surname, setSurname] = useState('');
   const [username, setUsername] = useState('');
   const [password, setPassword] = useState('');
+  const [confirmPassword, setConfirmPassword] = useState('');
+
   const [error, setError] = useState('');
   const [openSnackbar, setOpenSnackbar] = useState(false);
 
   const addUser = async () => {
     if (name.trim() === '' || surname.trim() === '') {
       setError('Por favor, introduce tanto el nombre como los apellidos.');
     } else {
-      try {
-        await axios.post(`${apiEndpoint}/adduser`, { username, password });
-        setOpenSnackbar(true);
-      } catch (error) {
-        setError(error.response.data.error);
+      if(password !== confirmPassword){
+        setError('Las contraseñas no coinciden.');
+      }else{
+        try {
+          await axios.post(`${apiEndpoint}/adduser`, { username, password });
+          setOpenSnackbar(true);
+        } catch (error) {
+          setError(error.response.data.error);
+        }
       }
     }
   };
@@ -76,6 +82,16 @@ const AddUser = () => {
         onChange={(e) => setPassword(e.target.value)}
       />
 
+      <TextField
+        name="confirmPassword"
+        margin="normal"
+        fullWidth
+        label="Repetir contraseña"
+        type="password"
+        value={confirmPassword}
+        onChange={(e) => setConfirmPassword(e.target.value)}
+      />
+
       <Button text="Añadir" onClick={addUser} name = "Add user"/>
 
       <Snackbar open={openSnackbar} autoHideDuration={6000} onClose={handleCloseSnackbar} message="Usuario añadido correctamente" />

diff --git a/webapp/src/components/AddUser.test.js b/webapp/src/components/AddUser.test.js
@@ -17,7 +17,8 @@ describe('AddUser component', () => {
     const nameInput = screen.getByLabelText(/Nombre/);
     const surnameInput = screen.getByLabelText(/Apellidos/i);
     const usernameInput = screen.getByLabelText(/Usuario/i);
-    const passwordInput = screen.getByLabelText(/Contraseña/i);
+    const passwordInput = screen.getAllByLabelText(/Contraseña/i)[0];
+    const confirmPasswordInput = screen.getByLabelText(/Repetir contraseña/i);
     const addUserButton = document.getElementsByClassName('inner')[0]
 
     // Mock the axios.post request to simulate a successful response
@@ -28,6 +29,7 @@ describe('AddUser component', () => {
     fireEvent.change(surnameInput, { target: { value: 'testUser' } });
     fireEvent.change(usernameInput, { target: { value: 'testUser' } });
     fireEvent.change(passwordInput, { target: { value: 'testPassword' } });
+    fireEvent.change(confirmPasswordInput, { target: { value: 'testPassword' } });
 
     // Trigger the add user button click
     fireEvent.click(addUserButton);
@@ -44,7 +46,8 @@ describe('AddUser component', () => {
     const nameInput = screen.getByLabelText(/Nombre/);
     const surnameInput = screen.getByLabelText(/Apellidos/i);
     const usernameInput = screen.getByLabelText(/Usuario/i);
-    const passwordInput = screen.getByLabelText(/Contraseña/i);
+    const passwordInput = screen.getAllByLabelText(/Contraseña/i)[0];
+    const confirmPasswordInput = screen.getByLabelText(/Repetir contraseña/i);
     const addUserButton = document.getElementsByClassName('inner')[0]
 
     // Mock the axios.post request to simulate an error response
@@ -55,6 +58,7 @@ describe('AddUser component', () => {
     fireEvent.change(surnameInput, { target: { value: 'testUser' } });
     fireEvent.change(usernameInput, { target: { value: 'testUser' } });
     fireEvent.change(passwordInput, { target: { value: 'testPassword' } });
+    fireEvent.change(confirmPasswordInput, { target: { value: 'testPassword' } });
 
     // Trigger the add user button click
     fireEvent.click(addUserButton);