45 lines
1 KiB
TypeScript
45 lines
1 KiB
TypeScript
|
import classNames from 'classnames';
|
||
|
|
import React from 'react';
|
||
|
|
|
||
|
|
import { Poll as PollEntity, PollOption as PollOptionEntity } from 'soapbox/types/entities';
|
||
|
|
|
||
|
|
interface IPollPreview {
|
||
|
|
poll: PollEntity,
|
||
|
|
}
|
||
|
|
|
||
|
|
const PollPreview: React.FC<IPollPreview> = ({ poll }) => {
|
||
|
|
const renderOption = (option: PollOptionEntity, index: number) => {
|
||
|
|
const showResults = poll.voted || poll.expired;
|
||
|
|
|
||
|
|
return (
|
||
|
|
<li key={index}>
|
||
|
|
<label className={classNames('poll__text', { selectable: !showResults })}>
|
||
|
|
<input
|
||
|
|
name='vote-options'
|
||
|
|
type={poll.multiple ? 'checkbox' : 'radio'}
|
||
|
|
disabled
|
||
|
|
/>
|
||
|
|
|
||
|
|
<span className={classNames('poll__input', { checkbox: poll.multiple })} />
|
||
|
|
|
||
|
|
<span dangerouslySetInnerHTML={{ __html: option.title_emojified }} />
|
||
|
|
</label>
|
||
|
|
</li>
|
||
|
|
);
|
||
|
|
};
|
||
|
|
|
||
|
|
if (!poll) {
|
||
|
|
return null;
|
||
|
|
}
|
||
|
|
|
||
|
|
return (
|
||
|
|
<div className='poll'>
|
||
|
|
<ul>
|
||
|
|
{poll.options.map((option, i) => renderOption(option, i))}
|
||
|
|
</ul>
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
};
|
||
|
|
|
||
|
|
export default PollPreview;
|