I ran into a sticky little issue with actions recently and I am hoping I might get some clarity in here. I am using server actions to get data from my db directly and then using the action client side in React Query hooks. It works great, but if a user navigates away from a page while the action is still fetching it never resolves.

For example, let's say I'm fetching the most recent action for a bunch of users in parallel and displaying the most recent action on a user card on the users page. The first half of them have loaded/resolved and the user clicks on a profile card to navigate to the profile page. When they come back to the users page the actions that hadn't resolved are stuck in an endless fetching state.

It feels like the action ID used to identify the action might be changing from page to page or the action is linked to the component render lifecycle.

I've played with setting timeouts and been able to put together a hacky fix where I cancel the query if it takes longer than x seconds to resolve and then refetch, but it doesn't feel like I should need to do this.

I don't run into the same issues if I just create an API endpoint and ping that thing instead of using an action.

I realize I am probably pushing actions to the limit by following this pattern, and maybe that's why there are no examples like this in the docs, but I was super hyped on actions and thought this was a killer way to use them since React Query accepts anything that returns a promise. At the end of the day these actions are essentially just that, a promise, and they would let me bypass creating an API layer for a single client (my front end) and maybe even be slightly more performant.

Has anyone else run into anything like this? Any feedback? Am I just using the actions incorrectly even though it technically works for fetching data and not just mutations? Or is this an unexpected bug? Perhaps an issue in the implememtation details for actions with Next?