Questions tagged [swr]

SWR is a React Hooks library for remote data fetching.

The name “SWR” is derived from stale-while-revalidate, a cache invalidation strategy popularized by HTTP RFC 5861. SWR first returns the data from cache (stale), then sends the fetch request (revalidate), and finally comes with the up-to-date data again.

369 questions
0
votes
0 answers

useSWRMutation post request optimisticData gives me a type error

i have a POST request using SWR: const { trigger, data, error, isMutating } = useSWRMutation(`${baseUrl}radios`, sendRequest); const onSubmit: SubmitHandler = data => { trigger(data, { rollbackOnError: true, …
junray
  • 163
  • 3
  • 15
0
votes
0 answers

How to use SWR with useReducer

I have useReducer and I have action type for fetching data inside useEffect and dispatch it like this. function reducer(state, action) { switch (action.type) { case 'FETCH_REQUEST': return { ...state, loading: true,…
0
votes
0 answers

Pass Parameters Besides URL in Next JS in Client Side API Fetch

I've been working on calling an internal GetCompanies API through the website client side. So far I made attempts like this based on search results and documentation // const fetcher = (includeFiles, folderLocation, SharePointCreds) =>…
BenCook
  • 17
  • 4
0
votes
1 answer

Environment Variables Not Working with SWR

I'm finding it hard to use ENV variables with the SWR hook for data fetching. I've been using it this way: const videoURLWithEnv =…
0
votes
0 answers

Understanding a custom hook in nextjs

this is a custom useAuth hook written by laravel team, I was wondering If you can help me understand a few things: Could you please help me to undestand these things: 1 - Why use axios and swr? I know they used swr for kind of revalidating things…
0
votes
1 answer

Use data populated by useEffect in conditional useSWR

I'm trying to resolve this issue, and I'm almost there. I'm getting the correct data from the API, and it's updating when it should, but on initial load useSWR is hitting the API with all null data. The data come from useContext, and are set in a…
philolegein
  • 1,099
  • 10
  • 28
0
votes
1 answer

drop down filtering data

I want to filter the data with a dropdown using useSWR. The sortedOptionList is hardcoded. Is there a way to make it more dynamic when calling the api? https://codesandbox.io/s/weathered-wildflower-ousy1n?file=/src/App.tsx:0-1903
JeongHaSeung
  • 393
  • 6
  • 12
0
votes
0 answers

Swr typescript error: A spread argument must either have a tuple type or be passed to a rest parameter

I'm setting the SWR config globaly like this in my App.tsx file: const App = () => { return ( fetch(...args).then(res => res.json()) || new Promise(() => {}), }}> …
Ilir
  • 488
  • 5
  • 20
0
votes
0 answers

useSWR returning completely incorrect data on refetch when window is refocused

Currently, this is my relevant code snip bit. const [open, setOpen] = useState(false) const fetcher = (url, open) => {return fetch(url).then((r) => r.json());} let { data: res, snapshotError } = useSWRImmutable( [url, open], fetcher, …
Jon
  • 481
  • 1
  • 6
  • 12
0
votes
0 answers

Combining useEffect, useContext, and/or useSWR to minimise renders on static pages with dynamic content

I suspect I'm overcomplicating things, and there's a much simpler solution here, but I'm new to NextJS ... and am clearly doing it wrong. I'm generating contest landing pages from a headless CMS using NextJS ("the contest page"). Any given user…
philolegein
  • 1,099
  • 10
  • 28
0
votes
0 answers

How do I convert this code from axios to useSWR?

I have a custom hook "useCart" to get the cart, but I have multiple API's to call and they are dependent on each other. I have written code using axios but I want it using useSWR because I am using mutate funtion from useSWR everywhere. useEffect(()…
Mohammed Ismail
  • 104
  • 1
  • 12
0
votes
1 answer

SWR Keep getting the same data through the loop

I have home component and i passing props into Product card component {products.map((product: ProductListStoreType) => (
0
votes
0 answers

How to make manual data validation/mutation work with useSWR and Axios?

I have tried everything I could so far, but can't get to make this manual data revalidation/mutation to work using const { mutate } = useSWRConfig(). I have tried setting GlobalConfig on my app, and not, but to no changes. For example: In my…
m3.b
  • 447
  • 4
  • 15
0
votes
0 answers

useSWR retrying request when on other tab

I'm using useSWR to fetch data from an api. The api is often down and I therefore retry the request every 15 seconds until it succeeds. This works very well until I change tabs. Then the requests stop. I can start sending requests again by setting…
Marcus
  • 29
  • 1
  • 5
0
votes
0 answers

Access token not getting applied on Axios with localstorage or cookie on NextJs and Laravel Sanctum

On this project, I am developing NextJs frontend with Laravel Backend API. I am able to log in to the App that's powered by NextJs (Axios + SWR) and Laravel (Sanctum + Breeze). User token is saved on both localstorage and cookie. Everything works…
Frank
  • 321
  • 1
  • 3
  • 11