genetic-orange
genetic-orange10mo ago

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
kapa.ai
kapa.ai10mo ago
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
kapa.ai10mo ago
<@584066183989428345> kapa.ai is still learning and improving, please let us know how it did by reacting below
xenial-black
xenial-black10mo 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
genetic-orange
genetic-orangeOP10mo ago
Yes thank you, I ended up using isFetching