forked from b00tc4mp/isdi-bootcamp-202405
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
5 changed files
with
167 additions
and
6 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
108 changes: 108 additions & 0 deletions
108
staff/tatiana-garcia/project/app/view/settings/index.jsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,108 @@ | ||
import logic from '../../logic' | ||
|
||
import Container from '../library/Container' | ||
import Label from '../library/Label' | ||
import Input from '../library/Input' | ||
import Link from '../library/Link' | ||
import Footer from '../home/Footer' | ||
import Heading from '../library/Heading' | ||
import Header from '../home/Header' | ||
|
||
import useContext from '../context' | ||
|
||
export default function Settings({ onLogoutClick }) { | ||
const { alert } = useContext() | ||
|
||
// const handleRegisterSubmit = event => { | ||
// event.preventDefault() | ||
|
||
// const form = event.target | ||
|
||
// const imageInput = form['image-input'] | ||
// const nameInput = form['name-input'] | ||
// const surnameInput = form['surname-input'] | ||
// const emailInput = form['email-input'] | ||
// const usernameInput = form['username-input'] | ||
// const passwordInput = form['password-input'] | ||
// const passwordRepeatInput = form['password-repeat-input'] | ||
|
||
// const image = imageInput.value | ||
// const name = nameInput.value | ||
// const surname = surnameInput.value | ||
// const email = emailInput.value | ||
// const username = usernameInput.value | ||
// const password = passwordInput.value | ||
// const passwordRepeat = passwordRepeatInput.value | ||
|
||
// try { | ||
// logic.registerUser(image, name, surname, email, username, password, passwordRepeat) | ||
// .then(() => onRegister()) | ||
// .catch(error => { | ||
// console.error(error) | ||
|
||
// alert(message) | ||
// }) | ||
// } catch (error) { | ||
// console.error(error) | ||
|
||
// alert(error.message) | ||
// } | ||
// } | ||
|
||
const handleLogoutClick = event => { | ||
event.preventDefault() | ||
|
||
onLogoutClick() | ||
} | ||
|
||
return <> | ||
<Header /> | ||
<main className='h-screen flex flex-col mb-32'> | ||
<Container className=' bg-teal-100 pt-8 pb-8 text-start'> | ||
<Heading className='text-center mb-6 pt-8 text-2xl font-bold '>Editar usuario</Heading> | ||
|
||
<form onSubmit={handleLogoutClick} className='bg-white rounded-[50px] p-6 space-y-2'> | ||
<Container> | ||
<Label className='block text-base font-semibold text-gray-700' htmlFor='image-input'>Imagen</Label> | ||
<Input className='w-56 p-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-teal-500' id='image-input' type='text' placeholder='https://' /> | ||
</Container> | ||
|
||
<Container> | ||
<Label className='block text-base font-semibold text-gray-700' htmlFor='name-input'>Nombre</Label> | ||
<Input className='w-56 p-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-teal-500' type='text' id='name-input' name='name' placeholder='nombre' /> | ||
</Container> | ||
|
||
<Container> | ||
<Label className='block text-base font-semibold text-gray-700' htmlFor='surname-input'>Apellidos</Label> | ||
<Input className='w-56 p-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-teal-500' type='text' id='surname-input' name='surname' placeholder='apellidos' /> | ||
</Container> | ||
|
||
<Container> | ||
<Label className='block text-base font-semibold text-gray-700' htmlFor='email-input'>Email</Label> | ||
<Input className='w-56 p-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-teal-500' type='email' id='email-input' name='email' placeholder='email' /> | ||
</Container> | ||
|
||
<Container> | ||
<Label className='block text-base font-semibold text-gray-700' htmlFor='username-input'>Nombre de usuario</Label> | ||
<Input className='w-56 p-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-teal-500' type='text' id='username-input' name='username' placeholder='nombre de usuario' /> | ||
</Container> | ||
|
||
<Container> | ||
<Label className='block text-base font-semibold text-gray-700' htmlFor='password-input'>Contraseña</Label> | ||
<Input className='w-56 p-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-teal-500' type='password' name='password' id='password-input' placeholder='contraseña' /> | ||
</Container> | ||
|
||
<Container className='pb-2'> | ||
<Label className='block text-base font-semibold text-gray-700' htmlFor='password-repeat-input'>Repite contraseña</Label> | ||
<Input className='w-56 p-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-teal-500' type='password' id='password-repeat-input' name='password-repeat' placeholder='repite contraseña' /> | ||
</Container> | ||
|
||
<Container className='text-center'> | ||
<button className='w-36 font-bold bg-green-100 text-black p-2 rounded-full hover:bg-green-200 transition duration-200' type='submit'>{'Guardar cambios'}</button> | ||
</Container> | ||
</form> | ||
<Footer /> | ||
</Container> | ||
</main> | ||
</> | ||
} |