cloudy-cyan•13mo ago

Calling Refetch() when Edit Call is Complete?

Hi, I have a refetch() function and a useDrawerForm. Currently, I have refetch() called on submit. However, there's some delay between the database being updated and submission -- causing refetch() to be called before the database is actually updated. I'm wondering if there's some boolean associated with useDrawerForm that tells you whether an edit call is complete to hopefully use alongside useEffect?

8 Replies

kapa.ai•13mo ago

Hi @avangeous. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave: ---------------------- Hmm, I don't know enough to give you a confident answer yet. The extracts provided do not contain information about a boolean associated with useDrawerForm that indicates whether an edit call is complete. However, useDrawerForm does return a saveButtonProps object which includes an onClick function. This function could potentially be used to trigger your refetch() function after the form submission is complete. Here's an example of how saveButtonProps is used:

const { formProps, drawerProps, saveButtonProps } = useDrawerForm({  
 action: "create",  
});

const { formProps, drawerProps, saveButtonProps } = useDrawerForm({  
 action: "create",  
});

For more detailed information, you may want to refer to the useDrawerForm documentation (https://refine.dev/docs/api-reference/antd/hooks/form/useDrawerForm/). ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------

kapa.ai•13mo ago

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

cloudy-cyan•13mo ago

@kapa.ai What does the DrawerProps use to know that its API call is complete?

kapa.ai•13mo ago

Let me check the knowledge base for you. One moment! :books: ---------------------- The useDrawerForm hook in Refine does not directly provide a way to know if its API call is complete. However, it does provide deleteButtonProps and saveButtonProps objects, which include onSuccess functions. These functions are triggered when the respective delete or save operations are successful. Here's an example of how deleteButtonProps is used:

const { deleteButtonProps } = useDrawerForm({  
 action: "delete",  
});  

deleteButtonProps.onSuccess();

const { deleteButtonProps } = useDrawerForm({  
 action: "delete",  
});  

deleteButtonProps.onSuccess();

When deleteButtonProps.onSuccess is called, it sets id to undefined and open to false. This could potentially be used as an indication that the delete operation is complete. For the save operation, you could use saveButtonProps.onSuccess in a similar way. For more detailed information, you may want to refer to the useDrawerForm documentation (https://refine.dev/docs/api-reference/antd/hooks/form/useDrawerForm/). ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------

kapa.ai•13mo ago

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

cloudy-cyan•13mo ago

@kapa.ai How can I use onMutationSuccess? Could you explan its use?

kapa.ai•13mo ago

Let me check the knowledge base for you. One moment! :books: ---------------------- The onMutationSuccess property is a callback function that is called after a mutation is successful. It is a property of the useForm hook in Refine. The onMutationSuccess function receives the following parameters: - data: This is the returned value from useCreate or useUpdate depending on the action. - variables: These are the variables passed to the mutation. - context: This is the react-query context. Here is an example of how you can use onMutationSuccess:

useForm({  
 onMutationSuccess: (data, variables, context) => {  
 console.log({ data, variables, context });  
 },  
});

useForm({  
 onMutationSuccess: (data, variables, context) => {  
 console.log({ data, variables, context });  
 },  
});

In this example, the onMutationSuccess function is logging the data, variables, and context to the console. You can replace the console log with any function you want to execute after the mutation is successful. For more detailed information, you may want to refer to the useForm documentation (https://refine.dev/docs/api-reference/core/hooks/useForm). ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------

kapa.ai•13mo ago

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