Merge pull request #155 from danybeltran/fix-cancel-ssrsuspense

fix(cancel, SSRSuspense):

Author: danybeltran

package.json

@@ -1,6 +1,6 @@
 {
   "name": "http-react",
-  "version": "2.9.7",
+  "version": "2.9.8",
   "description": "React hooks for data fetching",
   "main": "dist/index.js",
   "scripts": {

src/components/index.tsx

@@ -15,7 +15,7 @@ import { FetchContextType } from '../types'
 
 import { isDefined, serialize } from '../utils/shared'
 
-let isServer: boolean
+let isServer: boolean = true
 /**
  * This is a wrapper around `Suspense`. It will render `fallback` during the first render and then leave the rendering to `Suspense`. If you are not using SSR, you should continue using the `Suspense` component.
  */
@@ -26,13 +26,11 @@ export function SSRSuspense({
   fallback?: React.ReactNode
   children?: React.ReactNode
 }) {
-  const [ssr, setSSR] = useState(isDefined(isServer) ? isServer : true)
+  const [ssr, setSSR] = useState(isServer)
 
   useEffect(() => {
-    if (!isDefined(isServer)) {
-      setSSR(false)
-      isServer = false
-    }
+    setSSR(false)
+    isServer = false
   }, [])
 
   // This will render the fallback in the server

src/hooks/use-fetch.ts

@@ -1178,6 +1178,14 @@ export function useFetch<FetchDataType = any, BodyType = any>(
       suspenseInitialized[resolvedKey] = true
     }
   }
+  useEffect(() => {
+    if (url !== '') {
+      if (!jsonCompare(previousProps[resolvedKey], optionsConfig)) {
+        abortControllers[resolvedKey]?.abort()
+        queue(initializeRevalidation)
+      }
+    }
+  }, [serialize(optionsConfig)])
 
   if (suspense) {
     if (auto) {