diff --git a/src/components/common/VotesDisplay.tsx b/src/components/common/VotesDisplay.tsx new file mode 100644 index 0000000..9a0b1d2 --- /dev/null +++ b/src/components/common/VotesDisplay.tsx @@ -0,0 +1,47 @@ +import React from 'react' + +export interface GameVotes { + unlocker: string + success: number + fail: number +} + +interface VotesDisplayProps { + votes: GameVotes | null +} + +/** + * Compact vote bar shown inside the unlocker selection dialog. + * Shows a green/red progress bar with a label, or "No votes yet" when empty. + */ +const VotesDisplay: React.FC = ({ votes }) => { + if (!votes || (votes.success === 0 && votes.fail === 0)) { + return ( +
+ No votes yet +
+ ) + } + + const total = votes.success + votes.fail + const pct = Math.round((votes.success / total) * 100) + + const labelClass = + pct >= 70 ? 'votes-label--positive' : pct >= 40 ? '' : 'votes-label--negative' + + return ( +
+
+
+
+ + {pct}% working ({total}) + +
+ ) +} + +export default VotesDisplay \ No newline at end of file