Skip to content

Commit

Permalink
Add single option votes tooltip in polls (mastodon#16849)
Browse files Browse the repository at this point in the history
Adds a tooltip when hovering over the percentages in a poll showing how
many votes were cast for that option.

Also removes descriptions from messages here since they are not picked
up by Crowdin anyway and might be confusing to other developers :)

Fixes mastodon#16820
  • Loading branch information
brawaru authored and jesseplusplus committed Feb 10, 2022
1 parent b8eb2ae commit 7ce0a3c
Showing 1 changed file with 22 additions and 5 deletions.
27 changes: 22 additions & 5 deletions app/javascript/mastodon/components/poll.js
Original file line number Diff line number Diff line change
Expand Up @@ -12,8 +12,18 @@ import RelativeTimestamp from './relative_timestamp';
import Icon from 'mastodon/components/icon';

const messages = defineMessages({
closed: { id: 'poll.closed', defaultMessage: 'Closed' },
voted: { id: 'poll.voted', defaultMessage: 'You voted for this answer', description: 'Tooltip of the "voted" checkmark in polls' },
closed: {
id: 'poll.closed',
defaultMessage: 'Closed',
},
voted: {
id: 'poll.voted',
defaultMessage: 'You voted for this answer',
},
votes: {
id: 'poll.votes',
defaultMessage: '{votes, plural, one {# vote} other {# votes}}',
},
});

const makeEmojiMap = record => record.get('emojis').reduce((obj, emoji) => {
Expand Down Expand Up @@ -148,9 +158,16 @@ class Poll extends ImmutablePureComponent {
data-index={optionIndex}
/>
)}
{showResults && <span className='poll__number'>
{Math.round(percent)}%
</span>}
{showResults && (
<span
className='poll__number'
title={intl.formatMessage(messages.votes, {
votes: option.get('votes_count'),
})}
>
{Math.round(percent)}%
</span>
)}

<span
className='poll__option__text translate'
Expand Down

0 comments on commit 7ce0a3c

Please sign in to comment.