fix some lint errors
This commit is contained in:
@@ -21,7 +21,7 @@ const ToDoStore: FC<ToDoStoreProps> = ({setReload}) => {
|
||||
return <>
|
||||
{errorLabel()}
|
||||
<form className="flex" onSubmit={onSubmit}>
|
||||
<Field name="todo"
|
||||
<Field name="name"
|
||||
value={toDo}
|
||||
classNameForm="flex-1"
|
||||
className="!mt-0 h-10 rounded-r-none px-2"
|
||||
|
||||
@@ -27,9 +27,9 @@ export const AuthUserProvider = ({children}: PropsWithChildren) => {
|
||||
try {
|
||||
const res = await axios.get('/api/user')
|
||||
setAuthUser(res.data)
|
||||
} catch (e) {
|
||||
// @ts-ignore
|
||||
if (e.response.status === 401) {
|
||||
} catch (error) {
|
||||
// @ts-expect-error 401 error to redirect
|
||||
if (error.response.status === 401) {
|
||||
console.info('no user login')
|
||||
if (!['/connexion', '/inscription'].includes(window.location.pathname)) {
|
||||
window.location.href = '/connexion'
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
import React, {useState} from "react"
|
||||
import axios from "axios"
|
||||
import axios, {AxiosError} from "axios"
|
||||
import {cleanErrorsForm, displayFormErrors} from "../utilities/form"
|
||||
|
||||
const useAxiosTools = (isLoading = false) => {
|
||||
@@ -12,11 +12,13 @@ const useAxiosTools = (isLoading = false) => {
|
||||
const axiosPut = axios.put
|
||||
const axiosDelete = axios.delete
|
||||
|
||||
const errorCatch = (error: any) => {
|
||||
if (error.response && error.response.status === 422) {
|
||||
displayFormErrors(error)
|
||||
} else {
|
||||
setError(error.response?.data.message || error.message)
|
||||
const errorCatch = (error: Error|AxiosError|unknown) => {
|
||||
if (axios.isAxiosError(error)) {
|
||||
(error.response?.status === 422)
|
||||
? displayFormErrors(error)
|
||||
: setError(error.response?.data.message || error.message)
|
||||
} else if (error instanceof Error) {
|
||||
setError(error.message)
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -10,8 +10,9 @@ const ToDoShow = () => {
|
||||
const {id} = useParams()
|
||||
const {setLoading, errorCatch, errorLabel, axiosGet, axiosPut} = useAxiosTools(true)
|
||||
const [toDo, setToDo] = useState<toDo|null>(null)
|
||||
const [name, setName] = useState<string>('')
|
||||
const [description, setDescription] = useState<string>('')
|
||||
const [editMode, setEditMode] = useState(false)
|
||||
const [editForm, setEditForm] = useState<toDo|null>(null)
|
||||
|
||||
useEffect(() => {
|
||||
fetchToDo()
|
||||
@@ -29,29 +30,26 @@ const ToDoShow = () => {
|
||||
}
|
||||
|
||||
const handleEditTodoMode = async () => {
|
||||
if (editMode) {
|
||||
if (editMode && toDo) {
|
||||
try {
|
||||
const res = await axiosPut('/api/todos/' + id, editForm)
|
||||
const res = await axiosPut('/api/todos/' + id, {...toDo, name, description})
|
||||
setToDo(res.data)
|
||||
} catch (error) {
|
||||
errorCatch(error)
|
||||
}
|
||||
} else {
|
||||
setEditForm(toDo)
|
||||
setName(toDo?.name ?? '')
|
||||
setDescription(toDo?.description ?? '')
|
||||
}
|
||||
setEditMode(!editMode)
|
||||
}
|
||||
|
||||
const handleEditTodo = (event: React.ChangeEvent<HTMLInputElement|HTMLTextAreaElement>) => {
|
||||
setEditForm({...editForm, [event.target.name]: event.target.value})
|
||||
}
|
||||
|
||||
return <div className="relative p-5">
|
||||
{errorLabel()}
|
||||
{editMode ? <>
|
||||
<button className="absolute right-5 flex" onClick={handleEditTodoMode}>Valider <EditSVG className="w-5"/></button>
|
||||
<Field name="name" value={editForm?.name} onChange={handleEditTodo} />
|
||||
<TextArea name="description" value={editForm?.description} onChange={handleEditTodo} />
|
||||
<Field name="name" value={name} onChange={event => setName(event.target.value)} />
|
||||
<TextArea name="description" value={description} onChange={event => setDescription(event.target.value)} />
|
||||
</> : <>
|
||||
<button className="absolute right-5" onClick={handleEditTodoMode}><EditSVG className="w-5"/></button>
|
||||
<h1 className="text-lg font-bold">{toDo?.name}</h1>
|
||||
@@ -65,7 +63,7 @@ const ToDoShow = () => {
|
||||
|
||||
export default ToDoShow
|
||||
|
||||
const ToDoTimeTrackers: FC<ToDoTimeTrackers> = ({toDo: toDo}) => {
|
||||
const ToDoTimeTrackers: FC<{toDo: toDo}> = ({toDo: toDo}) => {
|
||||
|
||||
const {setLoading, errorCatch, errorLabel, axiosGet} = useAxiosTools(true)
|
||||
const [timeTrackers, setTimeTrackers] = useState<timeTracker[]>([])
|
||||
@@ -125,7 +123,3 @@ const ToDoTimeTrackers: FC<ToDoTimeTrackers> = ({toDo: toDo}) => {
|
||||
</table>
|
||||
</div>
|
||||
}
|
||||
|
||||
interface ToDoTimeTrackers {
|
||||
toDo: toDo,
|
||||
}
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
||||
interface Number {
|
||||
pad(n: number, char?: string): string,
|
||||
durationify(): string
|
||||
|
||||
@@ -1,11 +1,23 @@
|
||||
|
||||
export function displayFormErrors(error: any, form: HTMLElement|null = null) {
|
||||
export function displayFormErrors(error: ValidationErrors, form: HTMLElement|null = null) {
|
||||
if (error.response && error.response.status === 422) {
|
||||
let errors = error.response.data.errors
|
||||
const errors = error.response.data.errors
|
||||
const formBase = (form) ? form : document.body
|
||||
Object.keys(errors).forEach(key => {
|
||||
displayError(key, errors[key], formBase)
|
||||
Object.entries(errors).forEach(([key, value]) => {
|
||||
displayError(key, value, formBase)
|
||||
})
|
||||
// Object.keys(errors).forEach(key => {
|
||||
// displayError(key, errors[key], formBase)
|
||||
// })
|
||||
}
|
||||
}
|
||||
|
||||
interface ValidationErrors {
|
||||
response: {
|
||||
status: number,
|
||||
data: {
|
||||
errors: object
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user