How to set reset useCustom isLoading?

When I run the refetch function from useCustom, the isLoading doesn't go to true then false. Why is that?

4 Replies

Hi @Script. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave: ---------------------- The isLoading property from the useCustom hook in Refine is tied to the state of the data fetching operation. When you call the refetch function, it should ideally set isLoading to true and then back to false once the operation is complete. However, if you're not seeing this behavior, it could be due to a couple of reasons: 1. There might be an issue with the way your useCustom hook is set up. Ensure that you're using it correctly as per the documentation (https://refine.dev/docs/data/hooks/use-custom). Here's a basic usage example:

import { useCustom, useApiUrl } from "@refinedev/core";  
  
const { data, isLoading, refetch } = useCustom({  
 url: `${apiURL}/posts-unique-check`,  
 method: "get",  
 config: {  
 query: {  
 title: "Foo bar",  
 },  
 },  
});

import { useCustom, useApiUrl } from "@refinedev/core";  
  
const { data, isLoading, refetch } = useCustom({  
 url: `${apiURL}/posts-unique-check`,  
 method: "get",  
 config: {  
 query: {  
 title: "Foo bar",  
 },  
 },  
});

2. There could be a bug in Refine causing this behavior. There's a similar issue reported on Github where the loading state doesn't update correctly during refetching after invalidation (source (https://github.com/refinedev/refine/issues/5090)). If you believe this is a bug, consider reporting it on the Refine Github repository. Remember, hooks should only be called inside the body of a function component as per React rules (source (https://discord.com/channels/837692625737613362/1155513779493294110)). If you're still having trouble, you might want to check the queryResult returned by the hook. It contains properties like isFetching and isRefetching that might help you manage the loading state better (source (https://github.com/refinedev/refine/issues/2095)). ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------

kapa.ai•6mo ago

<@584066183989428345> kapa.ai is still learning and improving, please let us know how it did by reacting below

flat-fuchsia•6mo ago

Hello @Script, refine uses TanStack Query under the hood. when the query has no data yet, isLoading will be true. You can isFetching state for your use case. for more information: https://tanstack.com/query/v4/docs/framework/react/guides/queries

like-gold•6mo ago

Yes thank you, I ended up using isFetching