Change poll options to alphabetic letters when status text is hidden

Fix #10569
This commit is contained in:
Eugen Rochko 2019-05-03 21:37:28 +02:00
parent d77ee3f276
commit c53d673262
3 changed files with 10 additions and 8 deletions

View file

@ -28,6 +28,7 @@ class Poll extends ImmutablePureComponent {
intl: PropTypes.object.isRequired, intl: PropTypes.object.isRequired,
dispatch: PropTypes.func, dispatch: PropTypes.func,
disabled: PropTypes.bool, disabled: PropTypes.bool,
visible: PropTypes.bool,
}; };
state = { state = {
@ -69,13 +70,14 @@ class Poll extends ImmutablePureComponent {
}; };
renderOption (option, optionIndex) { renderOption (option, optionIndex) {
const { poll, disabled } = this.props; const { poll, disabled, visible } = this.props;
const percent = poll.get('votes_count') === 0 ? 0 : (option.get('votes_count') / poll.get('votes_count')) * 100; const percent = poll.get('votes_count') === 0 ? 0 : (option.get('votes_count') / poll.get('votes_count')) * 100;
const leading = poll.get('options').filterNot(other => other.get('title') === option.get('title')).every(other => option.get('votes_count') > other.get('votes_count')); const leading = poll.get('options').filterNot(other => other.get('title') === option.get('title')).every(other => option.get('votes_count') > other.get('votes_count'));
const active = !!this.state.selected[`${optionIndex}`]; const active = !!this.state.selected[`${optionIndex}`];
const showResults = poll.get('voted') || poll.get('expired'); const showResults = poll.get('voted') || poll.get('expired');
let titleEmojified = option.get('title_emojified'); let titleEmojified = option.get('title_emojified');
if (!titleEmojified) { if (!titleEmojified) {
const emojiMap = makeEmojiMap(poll); const emojiMap = makeEmojiMap(poll);
titleEmojified = emojify(escapeTextContentForBrowser(option.get('title')), emojiMap); titleEmojified = emojify(escapeTextContentForBrowser(option.get('title')), emojiMap);
@ -104,7 +106,7 @@ class Poll extends ImmutablePureComponent {
{!showResults && <span className={classNames('poll__input', { checkbox: poll.get('multiple'), active })} />} {!showResults && <span className={classNames('poll__input', { checkbox: poll.get('multiple'), active })} />}
{showResults && <span className='poll__number'>{Math.round(percent)}%</span>} {showResults && <span className='poll__number'>{Math.round(percent)}%</span>}
<span dangerouslySetInnerHTML={{ __html: titleEmojified }} /> {visible ? <span dangerouslySetInnerHTML={{ __html: titleEmojified }} /> : <span>{String.fromCharCode(64 + optionIndex + 1)}</span>}
</label> </label>
</li> </li>
); );

View file

@ -272,7 +272,7 @@ class Status extends ImmutablePureComponent {
} }
if (status.get('poll')) { if (status.get('poll')) {
media = <PollContainer pollId={status.get('poll')} />; media = <PollContainer pollId={status.get('poll')} visible={!status.get('hidden')} />;
} else if (status.get('media_attachments').size > 0) { } else if (status.get('media_attachments').size > 0) {
if (this.props.muted) { if (this.props.muted) {
media = ( media = (

View file

@ -106,7 +106,7 @@ export default class DetailedStatus extends ImmutablePureComponent {
} }
if (status.get('poll')) { if (status.get('poll')) {
media = <PollContainer pollId={status.get('poll')} />; media = <PollContainer pollId={status.get('poll')} visible={!status.get('hidden')} />;
} else if (status.get('media_attachments').size > 0) { } else if (status.get('media_attachments').size > 0) {
if (status.getIn(['media_attachments', 0, 'type']) === 'video') { if (status.getIn(['media_attachments', 0, 'type']) === 'video') {
const video = status.getIn(['media_attachments', 0]); const video = status.getIn(['media_attachments', 0]);