elk/composables/i18n.ts

81 lines
2.3 KiB
TypeScript
Raw Permalink Normal View History

2022-12-02 08:52:00 +00:00
import type { MaybeRef } from '@vueuse/shared'
import type { MaybeComputedRef, UseTimeAgoOptions } from '@vueuse/core'
2022-12-02 08:52:00 +00:00
const formatter = Intl.NumberFormat()
export const formattedNumber = (num: number, useFormatter: Intl.NumberFormat = formatter) => {
return useFormatter.format(num)
}
export const useHumanReadableNumber = () => {
const { n, locale } = useI18n()
const fn = (num: number) => {
return n(
num,
num < 10000
? 'smallCounting'
: num < 1000000
? 'kiloCounting'
: 'millionCounting',
locale.value,
)
}
2022-12-02 08:52:00 +00:00
return {
formatHumanReadableNumber: (num: MaybeRef<number>) => fn(unref(num)),
formatNumber: (num: MaybeRef<number>) => n(unref(num), 'smallCounting', locale.value),
formatPercentage: (num: MaybeRef<number>) => n(unref(num), 'percentage', locale.value),
forSR: (num: MaybeRef<number>) => unref(num) > 10000,
2022-12-02 08:52:00 +00:00
}
}
export const useFormattedDateTime = (
2022-11-27 08:48:04 +00:00
value: MaybeComputedRef<string | Date | undefined | null>,
options: Intl.DateTimeFormatOptions = { dateStyle: 'long', timeStyle: 'medium' },
) => {
2022-11-29 23:25:29 +00:00
const { locale } = useI18n()
const formatter = $computed(() => Intl.DateTimeFormat(locale.value, options))
return computed(() => {
const v = resolveUnref(value)
return v ? formatter.format(new Date(v)) : ''
})
}
2022-11-26 05:05:44 +00:00
2022-12-02 08:16:06 +00:00
export const useTimeAgoOptions = (short = false): UseTimeAgoOptions<false> => {
const { d, t, n: fnf, locale } = useI18n()
2022-12-02 08:16:06 +00:00
const prefix = short ? 'short_' : ''
2022-12-02 02:18:36 +00:00
const fn = (n: number, past: boolean, key: string) => {
return t(`time_ago_options.${prefix}${key}_${past ? 'past' : 'future'}`, n, {
named: {
v: fnf(n, 'smallCounting', locale.value),
},
})
}
2022-12-02 02:18:36 +00:00
return {
rounding: 'floor',
2022-12-02 08:16:06 +00:00
showSecond: !short,
updateInterval: short ? 60_000 : 1_000,
2022-12-02 02:18:36 +00:00
messages: {
justNow: t('time_ago_options.just_now'),
// just return the value
past: n => n,
// just return the value
future: n => n,
second: (n, p) => fn(n, p, 'second'),
minute: (n, p) => fn(n, p, 'minute'),
hour: (n, p) => fn(n, p, 'hour'),
day: (n, p) => fn(n, p, 'day'),
week: (n, p) => fn(n, p, 'week'),
month: (n, p) => fn(n, p, 'month'),
year: (n, p) => fn(n, p, 'year'),
2022-12-20 13:27:53 +00:00
invalid: '',
2022-12-02 02:18:36 +00:00
},
fullDateFormatter(date) {
2022-12-02 08:16:06 +00:00
return d(date, short ? 'short' : 'long')
2022-12-02 02:18:36 +00:00
},
}
2022-11-26 05:05:44 +00:00
}