Error Troubleshooting Steps Block for React

Nothing leaves the page. Try again shows a spinner on the button for under a second, then a polite status line says "Still can't connect, in this demo" and that nothing was requested; it never succeeds by accident. Ticks are kept in the page's state only: they aren't saved, and nothing is checked on the visitor's behalf. To wire Try again for real, reconnect to your service where the code says so, keep the busy state until it answers and show the page again when it succeeds.

Edit STEPS: each has an id, a name, one line on why it helps and a longer how. The count, the four-part bar (one part per step) and the "Still stuck?" condition all follow the length of the list, so add or remove a step without touching anything else. Keep each step something a visitor can do in a minute, and keep the order from most to least likely.

Because it is the page's one primary action, and a visitor on a phone should reach it without scrolling past four rows. The steps are help for when it keeps failing, not a gate in front of it. The button stays first in the focus order, so a keyboard user hits it before the list.

When all four steps are ticked. Its room is reserved from the start, hidden and unreachable by keyboard until then, so switching it on changes no layout and no tab order. To show it earlier, change the complete condition, for example after two steps or after a failed retry.

Each step is a real checkbox named by its title and described by its why line; Space ticks it, and the polite status line reads "Clear your cache marked as tried. 2 of 4 tried." The How buttons say which step they belong to and whether they're open. The four-part bar is decoration: the count in words says the same. Tried is a filled box, a filled part of the bar and a word, never only a color.

Try again is full width right under the heading, on the first screen. The steps stack in one column, each with its checkbox, title, why line and a How button at the end; opening one pushes the rows below it down, since it is a disclosure you opened.