Hi,
i need a solution for this problem: i have two pages: one for tracking habits and another for daily quests. Completing a habit can update the quests. When a habit is checked/unchecked, a function runs to update the habit, and in its after() callback, it updates the quests data. The after() makes things tricky because the quests update happens after the initial response, and it's unclear when it actually finishes.

The problem:
If the user switches pages while the function is still executing (especially during the after() part), the quest component displays outdated data. Additionally, the quest component itself doesn’t have interactivity, which complicates things further.

I could use React Query and Zustand with await to handle this, but it feels like overcomplicating the logic (since I always do optimistic updates) and could hurt performance.

Any suggestions for a cleaner or more efficient way to handle this?
If you need more details, feel free to ask! Thanks for your help!