diff --git a/front/src/hooks/useFetch.ts b/front/src/hooks/useFetch.ts index 82a5106..c0e9319 100644 --- a/front/src/hooks/useFetch.ts +++ b/front/src/hooks/useFetch.ts @@ -1,4 +1,4 @@ -import { useEffect, useState } from 'react' +import { useCallback, useEffect, useState } from 'react' import useSend from './useSend' @@ -54,7 +54,9 @@ function useFetch>( ): UseFetchReturn { const [data, setData] = useState(initialData) - const { doSend, loading, error } = useSend( + const [fetchLoading, setFetchLoading] = useState(true) + + const { doSend, error } = useSend( url, method, needAuth, @@ -64,20 +66,26 @@ function useFetch>( params, ) - function refetch() { + const refetch = useCallback(() => { + setFetchLoading(true) doSend().then( - data => { if (data !== undefined) setData(data) } + data => { + if (data !== undefined) { + setData(data) + } + setFetchLoading(false) + } ).catch( // must never occur err => import.meta.env.DEV && console.error('Failed to do fetch request', err) ) - } + }, [doSend]) - useEffect(refetch, [doSend]) + useEffect(refetch, [refetch]) - if (loading === true) { + if (fetchLoading === true) { return { data: undefined, - loading, + loading: fetchLoading, error: null, refetch, } @@ -86,7 +94,7 @@ function useFetch>( if (error !== null) { return { data: undefined, - loading, + loading: fetchLoading, error, refetch, } @@ -94,7 +102,7 @@ function useFetch>( return { data: data!, - loading, + loading: fetchLoading, error, refetch, }