zio
/
elk
2
0
Fork 0
Code Packages Releases 2 Activity

fix: format many voters as human readable number

zio/stable
Daniel Roe 2022-12-08 11:56:23 +01:00
parent 2fed89be9d
commit be68912226
No known key found for this signature in database
GPG Key ID: 22D5008E4F5D9B55
2 changed files with 3 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
components/status/StatusPoll.vue
View File

@ -13,6 +13,7 @@ function toPercentage(num: number) {
const timeAgoOptions = useTimeAgoOptions() const timeAgoOptions = useTimeAgoOptions()
const expiredTimeAgo = useTimeAgo(poll.expiresAt!, timeAgoOptions) const expiredTimeAgo = useTimeAgo(poll.expiresAt!, timeAgoOptions)
const expiredTimeFormatted = useFormattedDateTime(poll.expiresAt!) const expiredTimeFormatted = useFormattedDateTime(poll.expiresAt!)
const { formatHumanReadableNumber } = useHumanReadableNumber()
const masto = useMasto() const masto = useMasto()
async function vote(e: Event) { async function vote(e: Event) {
@ -57,7 +58,7 @@ async function vote(e: Event) {
</div> </div>
</template> </template>
<div text-sm> <div text-sm>
{{ $t('status.poll.count', poll.votersCount ?? 0) }} {{ $t('status.poll.count', formatHumanReadableNumber(poll.votersCount ?? 0)) }}
&middot; &middot;
<CommonTooltip :content="expiredTimeFormatted" class="inline-block" placement="right"> <CommonTooltip :content="expiredTimeFormatted" class="inline-block" placement="right">
<time :datetime="poll.expiresAt!">{{ $t(poll.expired ? 'status.poll.finished' : 'status.poll.ends', [expiredTimeAgo]) }}</time> <time :datetime="poll.expiresAt!">{{ $t(poll.expired ? 'status.poll.finished' : 'status.poll.ends', [expiredTimeAgo]) }}</time>

2
composables/i18n.ts
View File

@ -3,7 +3,7 @@ import type { MaybeComputedRef, UseTimeAgoOptions } from '@vueuse/core'
const formatter = Intl.NumberFormat() const formatter = Intl.NumberFormat()
export const humanReadableNumber = ( const humanReadableNumber = (
num: number, num: number,
{ k, m }: { k: string; m: string } = { k: 'K', m: 'M' }, { k, m }: { k: string; m: string } = { k: 'K', m: 'M' },
useFormatter: Intl.NumberFormat = formatter, useFormatter: Intl.NumberFormat = formatter,