async-fetch 0.3.2 → 0.3.3

package/README.md

@@ -1,6 +1,6 @@
 # useAsyncFetch
 
-Use fetch for requests within React components.
+Use async fetch hook for requests within React components.
 
 ## Installation
 
@@ -56,12 +56,11 @@ The minimum requirement for the hook is a url string as the first argument. The
 | initialError   | Any      | Initial state for the error constant.                                                                           |         |
 | deps           | Array    | List of dependencies to run the request on.                                                                     |         |
 | poll           | Number   | Number of milliseconds to wait for polling requests.                                                            |         |
-| cachetime      | Number   | Number of milliseconds to cache responses for.                                                                  | 60000   |
 | timeout        | Number   | Number of milliseconds to wait before canceling the request.                                                    | 30000   |
 | ignoreCleanup  | Boolean  | Whether or not the hook should cleanup on component unmount.                                                    |         |
 | ignoreRequest  | Boolean  | Whether or not the request should send.                                                                         |         |
-| query          | Object   | JSON object to append to the url as query params.                                                               |         |
-| params         | Object   | JSON object to append to the url as query params.                                                               |         |
+| query          | Object   | JSON object to append to the url as search params.                                                              |         |
+| params         | Object   | JSON object to append to the url as search params.                                                              |         |
 | data           | Object   | JSON object to send in the request body.                                                                        |         |
 | parser         | String   | Method used to parse the response.                                                                              | "json"  |
 | onStart        | Function | Callback function to call when the request starts.                                                              |         |

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "async-fetch",
-  "version": "0.3.2",
-  "description": "Use fetch for requests within React components.",
+  "version": "0.3.3",
+  "description": "Use async fetch hook for requests within React components.",
   "main": "useAsyncFetch.js",
   "type": "module",
   "scripts": {},
@@ -17,6 +17,8 @@
   ],
   "author": "Nameer Rizvi (https://github.com/nameer-rizvi)",
   "license": "ISC",
-  "bugs": "https://github.com/nameer-rizvi/useAsyncFetch/issues",
+  "bugs": {
+    "url": "https://github.com/nameer-rizvi/useAsyncFetch/issues"
+  },
   "homepage": "https://github.com/nameer-rizvi/useAsyncFetch#readme"
 }

package/useAsyncFetch.js

@@ -1,5 +1,4 @@
 import { useState, useEffect } from "react";
-import useCache from "./useCache.js";
 import useInterval from "./useInterval.js";
 
 function useAsyncFetch(stringUrl, props = {}) {
@@ -9,7 +8,6 @@ function useAsyncFetch(stringUrl, props = {}) {
     initialError,
     deps = [],
     poll,
-    cachetime = 60000, // 1 minute.
     timeout = 30000, // 30 seconds.
     ignoreCleanup,
     ignoreRequest,
@@ -36,19 +34,13 @@ function useAsyncFetch(stringUrl, props = {}) {
 
   const [unmounted, setUnmounted] = useState(false);
 
-  const cache = useCache(cachetime);
-
   useEffect(() => {
     return cleanupRequest;
   }, []);
 
-  useEffect(() => {
-    sendRequest("USE_CACHE");
-  }, [stringUrl, ...deps]);
+  useEffect(sendRequest, [stringUrl, ...deps]);
 
-  useInterval(() => {
-    sendRequest();
-  }, poll);
+  useInterval(sendRequest, poll);
 
   function cancelRequest() {
     if (cancelSource?.abort) cancelSource.abort();
@@ -61,7 +53,7 @@ function useAsyncFetch(stringUrl, props = {}) {
     }
   }
 
-  async function sendRequest(constant) {
+  async function sendRequest() {
     if (!stringUrl) {
       throw new Error("URL is required.");
     }
@@ -96,56 +88,61 @@ function useAsyncFetch(stringUrl, props = {}) {
 
         if (!unmounted) {
           if (pending) setPending2(true);
+
           if (!pending) setPending(true);
+
           setError();
+
           cancelRequest();
+
           setCancelSource(controller);
+
           if (onStart) onStart();
         }
 
-        const cachedResponse = constant === "USE_CACHE" && cache.get(url.href);
-
-        let parsedResponse = cachedResponse;
+        const response = await fetch(url, fetchProps);
 
-        if (!parsedResponse) {
-          const response = await fetch(url, fetchProps);
-
-          if (!response.ok) {
-            throw new Error(
-              JSON.stringify({
-                code: response.status,
-                text: response.statusText,
-                response: await response.text(),
-              }),
-            );
-          }
-
-          parsedResponse = await response[parser]();
+        if (!response.ok) {
+          throw new Error(
+            JSON.stringify({
+              code: response.status,
+              text: response.statusText,
+              response: await response.text(),
+            }),
+          );
         }
 
+        const parsedResponse = await response[parser]();
+
         if (!unmounted) {
           setData(parsedResponse);
+
           if (onSuccess) onSuccess(parsedResponse);
-          if (!cachedResponse) cache.set(url, parsedResponse);
         }
       } catch (e) {
         if (!unmounted && e.name !== "AbortError") {
           let error;
+
           try {
-            error = e.toString().replace("Error:", "");
-            error = JSON.parse(error.trim());
+            error = JSON.parse(e.toString().replace("Error:", "").trim());
           } catch {
             error = { response: e.toString(), text: e.toString() };
           }
+
           setError(error);
+
           if (onFail) onFail(error);
         }
       } finally {
         clearTimeout(requestTimeout);
+
         if (!unmounted) {
           if (pending) {
             setPending2();
-          } else setPending();
+          } else {
+            setPending();
+          }
+
           if (onFinish) onFinish();
         }
       }

package/useInterval.js

@@ -1,4 +1,4 @@
-import { useEffect, useRef } from "react";
+import { useRef, useEffect } from "react";
 
 function useInterval(callback, poll) {
   const callbackRef = useRef(() => {}); // noop
@@ -8,8 +8,10 @@ function useInterval(callback, poll) {
   });
 
   useEffect(() => {
-    if (typeof poll !== "number") return;
+    if (typeof poll !== "number" || poll < 1000) return;
+
     const interval = setInterval(() => callbackRef.current(), poll);
+
     return () => {
       clearInterval(interval);
     };

package/useCache.js

@@ -1,23 +0,0 @@
-import useInterval from "./useInterval.js";
-
-const cache = {};
-
-function useCache(cachetime) {
-  useInterval(() => {
-    for (let [key, value] of Object.entries(cache)) {
-      if (value.timestamp + cachetime < new Date().getTime()) delete cache[key];
-    }
-  }, cachetime);
-
-  function get(url) {
-    if (cachetime) return cache[url]?.response;
-  }
-
-  function set(url, response) {
-    if (cachetime) cache[url] = { timestamp: new Date().getTime(), response };
-  }
-
-  return { get, set };
-}
-
-export default useCache;