React hook for performing fetch calls

useFetch.jsx

import { useState, useEffect } from 'react'

const useFetch = (url, options = {}) => {
    const [loading, setLoading] = useState(true)
    const [data, setData] = useState()
    const [error, setError] = useState()

    useEffect(() => {
        const controller = new AbortController()
        setLoading(true)

        const fetchData = async () => {
            try {
                const res = await fetch(url, {
                    ...options,
                    signal: controller.signal,
                })

                const json = await res.json()
                setData(json)
            } catch (err) {
                console.error(err)
                setError(err)
            } finally {
                setLoading(false)
            }
        }

        fetchData()

        return () => {
            controller.abort()
        }
    }, [url])

    return { loading, data, error }
}

export default useFetch