Let's say I have an image generation backend (python) and a next.js frontend where the user can edit settings to trigger a generation job. Until that point it seems pretty straightforward to me: RSC renders the initial page, asks for current state of API with perhaps with some user settings/data sprinkled in to check if there is an already started/completed job. Client components then show interactive controls that can trigger/cancel the job via a server action. Basically just like a contact form until here.
But what I'm trying to understand is how can the UI react to changes in server-state like when the image is done processing it should re-render parts of the application with the newest data - ideally in a RSC and not client component! The key point here is that this should feel like a desktop application where the UI stays mostly constant and doesn't need to reload / revalidate a route completely every time a user makes an action that affects server state. It would be great if server actions had some mechanism that would trigger the Suspense boundary of the affected components and could stream incremental response.
My best idea so far is that I could use useActionState to show a pending UI in a client component (binary, no 0-100% progress indicator or other current status) and I guess I would need to keep the server action running until the API finished processing and returns the result (some generation tasks could take many minutes up to an hour). Ideally however the app would respond to server-sent events / websockets to also enable collaborative tasks.
I'm also aware of react libraries like TanStack but I guess my question is whether Next.js has native tools for creating apps that behave like a SPA while still benefitting from RSC, Suspense, Server Actions etc.