55 lines
1.2 KiB
TypeScript
55 lines
1.2 KiB
TypeScript
import React, { useState, useCallback } from 'react'
|
|
import { useAuthContext } from 'auth-context-provider'
|
|
|
|
const FormLogin = () => {
|
|
const [username, setUsername] = useState('')
|
|
const [password, setPassword] = useState('')
|
|
const auth: any = useAuthContext()
|
|
|
|
const onSubmit = useCallback(
|
|
(authenticationInfo) => {
|
|
auth.login(authenticationInfo)
|
|
},
|
|
[auth]
|
|
)
|
|
|
|
return (
|
|
<>
|
|
<form
|
|
onSubmit={(e) => {
|
|
e.preventDefault()
|
|
onSubmit({ username, password })
|
|
}}
|
|
>
|
|
<label htmlFor='username'>Username</label>
|
|
<input
|
|
type='text'
|
|
id='username'
|
|
value={username}
|
|
onChange={(e) => {
|
|
setUsername(e.target.value)
|
|
}}
|
|
/>
|
|
|
|
<label htmlFor='password'>Password</label>
|
|
<input
|
|
type='password'
|
|
id='password'
|
|
value={password}
|
|
onChange={(e) => {
|
|
setPassword(e.target.value)
|
|
}}
|
|
/>
|
|
<button type={'submit'}>Submit</button>
|
|
</form>
|
|
<br />
|
|
|
|
<pre>
|
|
{JSON.stringify(auth)}
|
|
</pre>
|
|
</>
|
|
)
|
|
}
|
|
|
|
export default FormLogin
|