React 19 made form state feel native again

React 19 made form state feel native again.

That sounds small until you remember how much plumbing forms used to need. Submit state, error state, optimistic state, reset behavior, server rejection, duplicate-submit protection, and loading indicators all used to get rebuilt a little differently in every component.

submission finally has a place to live

useActionState gives the submit flow a boundary. The form can submit to an action, React can track the pending state, and the component can receive the returned state without threading a pile of local flags through the tree.

const [state, formAction, isPending] = useActionState(saveProfile, {
  status: "idle",
})

return (
  <form action={formAction}>
    <input name="displayName" />
    <button disabled={isPending}>Save</button>
    {state.status === "error" ? <p>{state.message}</p> : null}
  </form>
)

pending belongs near the button

useFormStatus removes one more bit of awkward prop drilling. A submit button can read the surrounding form’s pending state directly and show the right label without the parent form carrying a separate mirror state.

server errors are normal state

Forms fail on the server for ordinary reasons: validation, permissions, conflicts, and stale data. The action can return a structured state instead of forcing everything into client-side validation or a generic toast that disappears before the user can act on it.

optimistic UI still needs rollback

useOptimistic is useful because the interface should respond before the server finishes in some cases. But optimism is a promise. The spec has to say what happens when the server rejects the action, what stays editable, and how the user sees the rollback.

React did not make forms automatic. It made the async shape feel like application code instead of hand-built state machine glue. That is enough. The boring states finally have a home that looks like the rest of the component.