Files
ticcat/resources/js/components/toDos/ToDoStore.tsx
2024-02-10 14:59:46 +01:00

42 lines
1.1 KiB
TypeScript

import React, {FC, FormEvent, useState} from "react"
import Field from "../Field";
import useAxiosTools from "../../hooks/AxiosTools";
const ToDoStore: FC<ToDoStoreProps> = ({setReload}) => {
const [toDo, setToDo] = useState('')
const {errorCatch, errorLabel, axiosPost} = useAxiosTools()
const onSubmit = async (event: FormEvent) => {
event.preventDefault()
try {
await axiosPost('api/todos', {name: toDo})
setToDo('')
setReload(new Date())
} catch (error) {
errorCatch(error)
}
}
return <>
{errorLabel()}
<form className="flex" onSubmit={onSubmit}>
<Field name="todo"
value={toDo}
classNameForm="flex-1"
className="h-10 !mt-0 rounded-r-none px-2"
onChange={event => setToDo(event.target.value)} />
<button type="submit"
className="bg-blue-900 h-10 rounded-r px-5">
Ajouter
</button>
</form>
</>
}
export default ToDoStore
interface ToDoStoreProps {
setReload: (date: Date) => void,
}