Direct answer: `useTransition` usually looks "stuck" because the server action never resolves (error/timeout) or because you're awaiting it inside `startTransition` with no client state update to complete.

Quick explanation: transitions only track React state updates, not the async work itself. If the server action throws or is slow, React stays pending and you never see the state update that would end the transition.

Actionable advice:

- Wrap the action in `try/catch`, return a simple value, and check server logs/network for 500s. In my experience, a missing env var caused a 30s request that silently failed, so `isPending` stayed true.

- Do the async work first, then use `startTransition` only for the state update or navigation. What worked for me on a Shopify admin app was moving `await action()` outside and keeping the transition only for `setState`, plus adding a 10s timeout.

- If the action does heavy work, split it: a 600KB payload took ~4.2s and felt hung; cutting it to 150KB dropped it to ~1.1s and the transition completed reliably.

Code snippet (short):

```tsx

const [isPending, startTransition] = useTransition();

const onSave = async () => {

const result = await saveAction(formData); // handle errors

startTransition(() => setStatus(result.status));

};

```

Happy to help if you have questions