Displaying Pending State with useFormStatus

How can a Submit button know that its form is being sent, when the button is a separate component? In the previous lesson, isPending from useActionState lived in the component that rendered the form. A reusable SubmitButton that appears in many forms does not have that value, and passing it down as a prop to every button repeats the same code in every form.

The useFormStatus hook answers the question from inside the button. It reads the status of the form that the calling component is rendered in, the same way useContext reads the nearest provider above it.