How to determine loading state?

[skworden]

I'm trying to convert some of our pages to SWR and I can't find how to get the true loading state.

All of the official SWR examples have isLoading = !data && !error but this doesn't mean the request is loading.

How do we get the true loading state with SWR?

 const { data, error } = useSWR();
 if(error) return "error UI"
 if(???????) return "loading UI"
 if(!data) return "no data UI"
 return data;

[ver1fy]

It sounds like isValidating might be what you are looking for. The isLoading example you give above will return true on the initial data fetch (i.e. when there is no corresponding key in the cache). If you need to know when SWR triggers a new request (i.e. revalidates), you can use isValidating:

const { isValidating } = useSWR('/api/user/123', fetcher)

The v2.0 docs illustrate this concept a bit better.