React Hook For Asynchronous Data Fetching With Error Handling And Loading States

/**
       * Fetches data from an API and handles errors.
       * 
       * @param {string} url The URL of the API endpoint.
       * @param {object} options Options for the fetch request.
       * @returns {Promise<object>} A promise that resolves with the fetched data.
       * @throws {Error} If the fetch request fails.
       */
      import { useState, useEffect } from 'react';

      const useFetchData = (url, options) => {
         const [data, setData] = useState(null);
         const [error, setError] = useState(null);
         const [loading, setLoading] = useState(false);

         useEffect(() => {
            const fetchData = async () => {
               setLoading(true);
               try {
                  const response = await fetch(url, options);
                  if (!response.ok) {
                     throw new Error(response.statusText);
                  }
                  const data = await response.json();
                  setData(data);
               } catch (error) {
                  setError(error);
               } finally {
                  setLoading(false);
               }
            };
            fetchData();
         }, [url, options]);

         return { data, error, loading };
      };

      export default useFetchData;