useActionState and useFormStatus
Use useActionState to track pending state and errors, and useFormStatus to disable submit buttons during flight.
Introducing useActionState
useActionState(action, initialState) is a React 19 hook that wraps a Server Action to track its state across submissions. It takes the action function and an initial state value, and returns a tuple you can use to drive the entire form experience.
The Return Tuple
The hook returns [state, formAction, isPending]. The state holds the most recent return value of the action (starting as null or your initial value). formAction is the wrapped action to pass to the form. isPending is true while the action is executing on the server.