Update Poll.tsx

Fixed #256
This commit is contained in:
Zhiyuan Zheng 2022-05-29 17:56:35 +02:00
parent af0756cef2
commit 68178f7f31
1 changed files with 32 additions and 40 deletions

View File

@ -145,36 +145,6 @@ const TimelinePoll: React.FC<Props> = ({
mutation.isLoading mutation.isLoading
]) ])
const pollExpiration = useMemo(() => {
if (poll.expired) {
return (
<CustomText fontStyle='S' style={{ color: colors.secondary }}>
{t('shared.poll.meta.expiration.expired')}
</CustomText>
)
} else {
if (poll.expires_at) {
return (
<CustomText fontStyle='S' style={{ color: colors.secondary }}>
<Trans
i18nKey='componentTimeline:shared.poll.meta.expiration.until'
components={[
<FormattedRelativeTime
value={
(new Date(poll.expires_at).getTime() -
new Date().getTime()) /
1000
}
updateIntervalInSeconds={1}
/>
]}
/>
</CustomText>
)
}
}
}, [theme, i18n.language, poll.expired, poll.expires_at])
const isSelected = useCallback( const isSelected = useCallback(
(index: number): string => (index: number): string =>
allOptions[index] allOptions[index]
@ -302,21 +272,38 @@ const TimelinePoll: React.FC<Props> = ({
const pollVoteCounts = useMemo(() => { const pollVoteCounts = useMemo(() => {
if (poll.voters_count !== null) { if (poll.voters_count !== null) {
return ( return (
<CustomText fontStyle='S' style={{ color: colors.secondary }}> t('shared.poll.meta.count.voters', { count: poll.voters_count }) + ' • '
{t('shared.poll.meta.count.voters', { count: poll.voters_count })}
{' • '}
</CustomText>
) )
} else if (poll.votes_count !== null) { } else if (poll.votes_count !== null) {
return ( return (
<CustomText fontStyle='S' style={{ color: colors.secondary }}> t('shared.poll.meta.count.votes', { count: poll.votes_count }) + ' • '
{t('shared.poll.meta.count.votes', { count: poll.votes_count })}
{' • '}
</CustomText>
) )
} }
}, [poll.voters_count, poll.votes_count]) }, [poll.voters_count, poll.votes_count])
const pollExpiration = useMemo(() => {
if (poll.expired) {
return t('shared.poll.meta.expiration.expired')
} else {
if (poll.expires_at) {
return (
<Trans
i18nKey='componentTimeline:shared.poll.meta.expiration.until'
components={[
<FormattedRelativeTime
value={
(new Date(poll.expires_at).getTime() - new Date().getTime()) /
1000
}
updateIntervalInSeconds={1}
/>
]}
/>
)
}
}
}, [theme, i18n.language, poll.expired, poll.expires_at])
return ( return (
<View style={{ marginTop: StyleConstants.Spacing.M }}> <View style={{ marginTop: StyleConstants.Spacing.M }}>
{poll.expired || poll.voted ? pollBodyDisallow : pollBodyAllow} {poll.expired || poll.voted ? pollBodyDisallow : pollBodyAllow}
@ -329,8 +316,13 @@ const TimelinePoll: React.FC<Props> = ({
}} }}
> >
{pollButton} {pollButton}
<CustomText
fontStyle='S'
style={{ flexShrink: 1, color: colors.secondary }}
>
{pollVoteCounts} {pollVoteCounts}
{pollExpiration} {pollExpiration}
</CustomText>
</View> </View>
</View> </View>
) )