Revision History FAQ Block for React

Each question in QUESTIONS has revisions, newest first, ending with "first published". Add a line at the top when you change an answer; the revision number is the number of lines, so the row's "Rev 3" and the history's numbers always agree. Set revised to true while the change is recent and back to false when it's old news: it controls the Revised badge and the switch.

It hides the questions whose revised is false, so with the sample data four of six remain, and a count beside it says "4 of 6 questions" in a polite live region. The list keeps room for the full set on a desktop, so the block's height doesn't jump. The switch takes checked and onCheckedChange, with a plain boolean.

A date printed in a template is wrong the day after you ship it. Revision numbers stay true: they only change when you change the answer. If you want times, show them from your own data in the same line.

Each question is a button inside its own h3, with its badge and revision number inside the button's name. The Revision history button inside an answer says whether it's expanded and how many revisions it holds, and the revisions are an ordered list. The switch is named "Show revised questions only".

Yes. The Accordion takes hiddenUntilFound, so every closed answer stays in the markup as hidden="until-found": search engines see all of them, and the browser's find in page opens the answer that holds a match.

The title, the sentence and the switch stack above the rows, which run from rail to rail. The badge and the revision number sit under each question, and nothing scrolls sideways at 320 pixels.