How to update task state after a POST request in update-task interceptor?

JoseMiguelPulgarin

Helloo, I'm updating the task information in the database via a POST request inside the update-task interceptor. However, after making the POST request, the local task state is not updating as expected.

In contrast, when I don't include the POST request, the task state updates correctly like it works in the demos. How can I ensure that the task state is updated even after performing the POST?

Here's the code I'm using:

useEffect(() => {
  const api = apiRef.current;
  if (!api) return;

  api.intercept("update-task", async (data) => {
    // some validation and logic
    await apiClient.post(`https://api.com/assign_responsible/`, bodyObject);
    return true; // should this be different?
  });
}, [apiRef.current]);

What do I need to return after the POST? Any help is appreciated!

Helga

Hi,

It depends on your goal. If you want to first update the task locally and then save it, then it is better to use api.on method that is triggered after the related action happens.

But if you want to first send request and then update the task locally, probably with some extra info from backend, you need to cancel local processing (return false) but after receiving the response call the "update-task" again with task info and some flag to distinguish between action calls.

api.intercept("update-task",  (data) => {
    if(!data.myCall){ // do not intercept own calls
      apiClient.post(`https://api.com/assign_responsible/`, data.task).then(res => {
         api.exec("update-task", { id, task, myCall:true})
    });
    return false; // cancel updating
   }  
});

In case you intercept the action, changes will not be applied.