Compact List Reviews Block for React

Edit REVIEWS at the top of the file: each entry has an id, the name, a rating from 1 to 5, an ISO date, a title, a one to three sentence body, verified and a helpful count. The count and the average in the header are computed from the array, so they follow your edits. Dates are fixed text, never computed from today.

Each of the four sortable column heads is a button inside its th. The first press sorts a column biggest first (names A to Z), the next reverses it, and the th carries aria-sort="ascending", "descending" or "none". The Select lists all eight orders and always shows the one in force, so the two controls stay in step. A polite status line, hidden from sight, says "Sorted by newest first." after every change. Ties fall back to the newest review, so the order never flickers.

It needs a caption, column headers with scope and aria-sort, and a column set that drops on a phone, and a plain table gives all of that the same way on every library. The scroll region around it is named and reachable by keyboard.

Below the md breakpoint the Reviewer and Date columns are hidden, the stars become a single star beside the number, and each row keeps its title and one-line excerpt. The Select, which mirrors the sort at every width, is the way to order the rows by date there.

Yes. Columns, the sort arrows and the end-aligned figures follow the page's direction, and dates, ratings and counts are isolated in bdi so their digits keep their order.