State
After the submit button is clicked, show Saving, then update the message on success or failure.
Remember the current condition: After Save is clicked, the page records that it is submitting, preventing repeat clicks and showing progress; it then changes to success or error when the request ends.
State drives what appears: The same button and message area show different content for different values. A state change should come from an actual action or request result, not an early success label.
What state looks like in code: In React, useState is the most common way to declare state. For example, useState(false) creates a state that starts as false. When the user clicks, the code calls the setter function to change the value, and React automatically updates the UI to match. When AI says “add a loading state”, it usually means creating a boolean state variable to toggle a spinner.
You can say this to an AI Agent
Check the state in this save flow: after a click, show Saving and prevent duplicate submission; show Saved only after the API succeeds; show an error and retry path on failure. Verify both success and failure afterward.
Select page elements for precise AI edits
Click a button, text, or card, note the change, then copy its exact location to AI.
Open Selector Pro website↗