first commit

resources/js/hooks/AuthUser.tsx

@@ -0,0 +1,77 @@
+import React, {
+    createContext,
+    Dispatch,
+    PropsWithChildren,
+    SetStateAction,
+    useContext,
+    useEffect,
+    useState
+} from "react";
+import axios from "axios";
+
+const AuthUserContext = createContext<AuthUserProps|undefined>(undefined)
+
+interface AuthUserProps {
+    authUser?: User|null,
+    setAuthUser: Dispatch<SetStateAction<User | null>>,
+    loadingAuthUser: boolean,
+    logout: () => void,
+}
+
+export const AuthUserProvider = ({children}: PropsWithChildren) => {
+    const [authUser, setAuthUser] = useState<User|null>(null)
+    const [loadingAuthUser, setLoadingAuthUser] = useState(true)
+
+    useEffect(() => {
+        (async () => {
+            try {
+                const res = await axios.get('/api/user')
+                setAuthUser(res.data)
+            } catch (e) {
+                // @ts-ignore
+                if (e.response.status === 401) {
+                    console.info('no user login')
+                    if (!['/connexion', '/inscription'].includes(window.location.pathname)) {
+                        window.location.href = '/connexion'
+                    }
+                }
+            } finally {
+                setLoadingAuthUser(false)
+            }
+        })()
+    }, [])
+
+    const logout = async () => {
+        try {
+            setLoadingAuthUser(false)
+            const res = await axios.delete('/api/logout')
+            setAuthUser(null)
+            window.location.replace('/')
+        } catch (e) {
+            console.error(e)
+        } finally {
+            setLoadingAuthUser(false)
+        }
+    }
+
+    return <AuthUserContext.Provider value={{authUser, setAuthUser, loadingAuthUser, logout}}>
+        {children}
+    </AuthUserContext.Provider>
+}
+
+const useAuthUser = () => {
+    const context = useContext(AuthUserContext)
+    if (context === undefined) {
+        throw new Error('Add AuthUserProvider to use AuthUserContext')
+    }
+    return context
+}
+
+export default useAuthUser
+
+interface User {
+    id: number,
+    name: string,
+    email: string,
+    locations: {id: number, latitude: number, longitude: number}[],
+}

resources/js/hooks/AxiosTools.tsx

@@ -0,0 +1,37 @@
+import {useState} from "react";
+import axios from "axios";
+import React from "react";
+import {cleanErrorsForm, displayFormErrors} from "../utilities/form";
+
+const useAxiosTools = (isLoading = false) => {
+
+    const [loading, setLoading] = useState(isLoading)
+    const [error, setError] = useState<string|null>(null)
+
+    const axiosGet = axios.get
+    const axiosPost = axios.post
+    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 errorLabel = () => {
+
+        return error ? <div className="bg-red-600 rounded m-2 text-center text-white px-2 py-1 mx-auto">{error}</div>: null
+    }
+
+    const cleanErrors = () => {
+        cleanErrorsForm()
+        setError(null)
+    }
+
+    return {loading, setLoading, error, setError, errorCatch, errorLabel, cleanErrors, axiosGet, axiosPost, axiosPut, axiosDelete}
+}
+
+export default useAxiosTools

resources/js/hooks/TraskerHook.tsx

@@ -0,0 +1,66 @@
+import React, {createContext, PropsWithChildren, useContext, useEffect, useState} from "react";
+import {timeTracker, toDo} from "../utilities/types";
+import useAxiosTools from "./AxiosTools";
+
+
+const TrackerContext = createContext<TrackerProps|undefined>(undefined)
+
+interface TrackerProps {
+    currentTimeTracker: timeTracker|null,
+    startTrackToDo: (toDo: toDo) => void,
+    stopCurrentTimeTrack: () => void,
+    isToDoTracked: (toDo: toDo) => boolean,
+}
+
+export const TrackerProvider = ({children}: PropsWithChildren) => {
+    const [currentTimeTracker, setCurrentTimeTracker] = useState(null)
+    const [toDoTracked, setToDoTracked] = useState<toDo|null>(null)
+    const {axiosGet, axiosPost, axiosDelete} = useAxiosTools()
+
+    useEffect(() => {
+        fetchCurrentTimeTracker()
+    }, [])
+
+    const fetchCurrentTimeTracker = async () => {
+        try {
+            const res = await axiosGet(`/api/time-tracker/user`)
+            setCurrentTimeTracker(res.data)
+        } catch (error) {
+            console.error(error)
+        }
+    }
+
+    const startTrackToDo = async (toDo: toDo) => {
+        try {
+            const res = await axiosPost('/api/time-tracker', {todo_id: toDo.id})
+            setCurrentTimeTracker(res.data)
+        } catch (error) {
+            console.error(error)
+        }
+    }
+
+    const stopCurrentTimeTrack = async () => {
+        try {
+            const res = await axiosDelete(`/api/time-tracker/user`)
+            setCurrentTimeTracker(null)
+        } catch (error) {
+            console.error(error)
+        }
+    }
+
+    const isToDoTracked = (toDo: toDo) => toDo.id === toDoTracked?.id
+
+    return <TrackerContext.Provider value={{currentTimeTracker, startTrackToDo, stopCurrentTimeTrack, isToDoTracked}}>
+        {children}
+    </TrackerContext.Provider>
+}
+
+const useTracker = () => {
+    const context = useContext(TrackerContext)
+    if (context === undefined) {
+        throw new Error('Add TrackerProvider to use AuthUserContext')
+    }
+    return context
+}
+
+export default useTracker