v2.4.7

Feat: Suspense

Requests that will use Suspense can be specified by their IDs in the FetcerConfig component

Example:

<FetcherConfig suspense={["profile", "messages"] /* This should always be present */}>
  <Suspense fallback={<p>Loading profile</p>}>
    <Profile />
  </Suspense>
  <Suspense fallback={<p>Loading messages</p>}>
    <Messages/>
  </Suspense>
</FetcherConfig>

The example above assumes Profile and Messages are passing profile and messages to their useFetch calls respectively

v2.4.6

Feat: Suspense

Makes fallback optional in SSRSuspense

v2.4.5

Feat: Suspense

When using suspense, start rendering after data has been set

v2.4.4

Feat: Suspense

Added SSRSuspense component for when using Suspense with SSR. It's a wrapper around the Suspense component.

Example:

import { SSRSuspense, useFetch } from "http-react"

function Profile() {
  const { data } = useFetch("/api/profile", {
    id: "profile",
    suspense: true,
  })

  return (
    <section>
      <p>Name: {data?.name}</p>
      <p>Email: {data?.email}</p>
    </section>
  )
}

export default function Home() {
  return (
    <main>
      <h2>Perfil</h2>
      <SSRSuspense fallback={<p>Loading profile</p>}>
        <h2>El perfil</h2>
        <Profile />
      </SSRSuspense>
    </main>
  )
}

v2.4.3

Fix: Suspense

Fixed double request when using suspense

v2.4.2

Feat: Suspense

improve suspense usage

v2.4.1

Feat: Suspense 🚀

Added support for Suspense.

Example:

import { Suspense } from 'react'
import { useFetch } from 'http-react'

function Profile() {
  const { data } = useFetch('/api/profile', {
    suspense: true // If we don't pass anything, this will work as a normal component would
  })

  return (
    <div>
      <p>Email: {data.email}</p>
    </div>
  )
}

export default function App() {
  return (
    <div>
      <h2>Welcome</h2>
      <Suspense fallback={<p>Loading profile...</p>}>
        <Profile />
      </Suspense>
    </div>
  )
}

v2.4.0

Feat: library name

Changed library name for a shorter one: http-react-fetcher --> http-react
Old library will not be deprecated (yet)

v2.3.9

Fix: cancelOnChange

Fixed cancelOnChange not revalidating

v2.3.8

Feats

Added more customization to queryProvider:

• per-query baseUrl, headers and graphqlPath
• Default baseUrl and graphqlPath in general queryProvider config

Example:

export const useQuery = queryProvider(queries, {
  defaults: {
    appInfo: {
      baseUrl: '/api', // This overwrites the 'baseUrl' below
      headers: { a: 'b' }, // These headers are added to the headers passed below and in any <FetcherConfig> root in the React tree
      variables: {}
    },
    characters: {
      value: {
        characters: {
          results: []
        }
      },
      variables: {
        page: 3
      }
    }
  },
  config: {
    baseUrl: 'https://rickandmortyapi.com',
    headers: {  Authorization: "Token etc" }
  }
})