Upvote System Reviews Block for React

It's a toggle group that can be empty: press Up and its count goes up by one and the net score with it; press Down instead and Up gives its vote back as Down takes one; press the pressed side again to take the vote back. A polite status line says what happened and what the net score is now. Nothing is sent and a reload starts afresh: to keep votes, post the review's id and the side from the handler and seed up and down from your data.

Every order and the fold read the counts the page loaded with, and the note above the cards says so. A card that jumped to the top, or vanished into the fold, the moment you voted would be hard to follow. Your vote changes the two counts and the net score on its own card; the next visit, with your vote saved on a server, would re-order.

The review whose smaller side is largest, so a split of 39 up and 36 down (36) ranks above 33 and 29 (29), and a lopsided 58 and 4 (4) ranks near the end. Ties go to the review with more votes in all, then by id. Change splitOf for another rule, such as the ratio of the two sides.

Those at a net of -3 or lower when the page loads, set by FOLD_AT. They sit under the cards in a collapsible whose trigger is a heading button saying how many are hidden; open it and they're the same cards with the same Up and Down pill. The open state is kept above the tabs, so it survives switching tabs.

Yes. The cards, the pill and the tab list follow the page's direction; each count, the net score (with a true minus sign) and the dates are wrapped so their digits and signs stay in order, and the stars mirror.