From d99b94be553da58ee44e2f4e80935c0fbb8abfd6 Mon Sep 17 00:00:00 2001
From: Romulus21 <romain@delanoe.pro>
Date: Mon, 19 Feb 2024 08:29:56 +0100
Subject: [PATCH] fix some lint errors

---
 app/Http/Controllers/ToDoController.php     |  1 +
 resources/js/components/toDos/ToDoStore.tsx |  2 +-
 resources/js/hooks/AuthUser.tsx             |  6 +++---
 resources/js/hooks/AxiosTools.tsx           | 14 ++++++------
 resources/js/pages/ToDos/ToDoShow.tsx       | 24 ++++++++-------------
 resources/js/utilities/customProperties.ts  |  1 +
 resources/js/utilities/form.ts              | 20 +++++++++++++----
 7 files changed, 39 insertions(+), 29 deletions(-)

diff --git a/app/Http/Controllers/ToDoController.php b/app/Http/Controllers/ToDoController.php
index a7765ac..2321c1d 100644
--- a/app/Http/Controllers/ToDoController.php
+++ b/app/Http/Controllers/ToDoController.php
@@ -44,6 +44,7 @@ class ToDoController extends Controller
      */
     public function update(ToDoRequest $request, ToDo $todo)
     {
+        abort(501, "xoxo");
         $data = $request->validated();
         $data['checked'] = $request->input('checked') ? now() : null;
         $todo->update($data);
diff --git a/resources/js/components/toDos/ToDoStore.tsx b/resources/js/components/toDos/ToDoStore.tsx
index 3026531..d9b04c4 100644
--- a/resources/js/components/toDos/ToDoStore.tsx
+++ b/resources/js/components/toDos/ToDoStore.tsx
@@ -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"
diff --git a/resources/js/hooks/AuthUser.tsx b/resources/js/hooks/AuthUser.tsx
index 012a4fd..92146ff 100644
--- a/resources/js/hooks/AuthUser.tsx
+++ b/resources/js/hooks/AuthUser.tsx
@@ -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'
diff --git a/resources/js/hooks/AxiosTools.tsx b/resources/js/hooks/AxiosTools.tsx
index f36d175..f26f837 100644
--- a/resources/js/hooks/AxiosTools.tsx
+++ b/resources/js/hooks/AxiosTools.tsx
@@ -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)
         }
     }
 
diff --git a/resources/js/pages/ToDos/ToDoShow.tsx b/resources/js/pages/ToDos/ToDoShow.tsx
index 5603636..a6be547 100644
--- a/resources/js/pages/ToDos/ToDoShow.tsx
+++ b/resources/js/pages/ToDos/ToDoShow.tsx
@@ -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,
-}
diff --git a/resources/js/utilities/customProperties.ts b/resources/js/utilities/customProperties.ts
index d4e194b..df940e0 100644
--- a/resources/js/utilities/customProperties.ts
+++ b/resources/js/utilities/customProperties.ts
@@ -1,4 +1,5 @@
 
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
 interface Number {
     pad(n: number, char?: string): string,
     durationify(): string
diff --git a/resources/js/utilities/form.ts b/resources/js/utilities/form.ts
index 7fbd562..2a2a5e6 100644
--- a/resources/js/utilities/form.ts
+++ b/resources/js/utilities/form.ts
@@ -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
+        }
     }
 }