useful-custom-react-hooks/dist/hooks/useFetch.js

A collection of useful custom React hooks to simplify common tasks and enhance your React applications.

var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
    return new (P || (P = Promise))(function (resolve, reject) {
        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
        step((generator = generator.apply(thisArg, _arguments || [])).next());
    });
};
import { useState, useEffect, useMemo } from 'react';
export const useFetch = (url, opts = { method: 'GET', body: null, headers: null }) => {
    const [data, setData] = useState(null);
    const [error, setError] = useState(null);
    const [isFetching, setIsFetching] = useState(false);
    const [refresh, setRefresh] = useState(false);
    const refetch = useMemo(() => () => {
        setRefresh((prev) => !prev);
    }, []);
    useEffect(() => {
        ;
        (function () {
            return __awaiter(this, void 0, void 0, function* () {
                setIsFetching(true);
                try {
                    const res = yield fetch(url, {
                        method: opts.method,
                        body: opts.body && JSON.stringify(opts.body),
                        headers: opts.headers ? opts.headers : undefined,
                    });
                    const resData = yield res.json();
                    if (res.ok) {
                        setData(resData);
                    }
                    else {
                        setError(res.status);
                    }
                }
                catch (e) {
                    if (e instanceof Error) {
                        setError(e.message);
                    }
                    console.error(e);
                }
                setIsFetching(false);
            });
        })();
    }, [refresh]);
    return { data, isFetching, error, refetch };
};