Mirrors/phanpy
1
0
Fork 0
mirror of https://github.com/cheeaun/phanpy.git synced 2025-01-22 16:46:28 +01:00
Code Issues Projects Releases Packages Wiki Activity

Don't even need dayjs anymore

Browse source
This commit is contained in:
Lim Chee Aun 2024-08-16 11:16:19 +08:00
parent 6c0f0a4127
commit c914cf58aa
1 changed files with 22 additions and 14 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

36
src/components/relative-time.jsx
View file

@ -1,11 +1,19 @@
import { i18n } from '@lingui/core'; import { i18n } from '@lingui/core';
import { t, Trans } from '@lingui/macro'; import { t, Trans } from '@lingui/macro';
import dayjs from 'dayjs';
import { useEffect, useMemo, useReducer } from 'preact/hooks'; import { useEffect, useMemo, useReducer } from 'preact/hooks';
import localeMatch from '../utils/locale-match'; import localeMatch from '../utils/locale-match';
import mem from '../utils/mem'; import mem from '../utils/mem';
function isValidDate(value) {
if (value instanceof Date) {
return !isNaN(value.getTime());
} else {
const date = new Date(value);
return !isNaN(date.getTime());
}
}
const resolvedLocale = new Intl.DateTimeFormat().resolvedOptions().locale; const resolvedLocale = new Intl.DateTimeFormat().resolvedOptions().locale;
const DTF = mem((locale, opts = {}) => { const DTF = mem((locale, opts = {}) => {
const lang = localeMatch([locale], [resolvedLocale]); const lang = localeMatch([locale], [resolvedLocale]);
@ -63,38 +71,37 @@ const twitterFromNow = (date) => {
export default function RelativeTime({ datetime, format }) { export default function RelativeTime({ datetime, format }) {
if (!datetime) return null; if (!datetime) return null;
const [renderCount, rerender] = useReducer((x) => x + 1, 0); const [renderCount, rerender] = useReducer((x) => x + 1, 0);
const date = useMemo(() => dayjs(datetime), [datetime]); const date = useMemo(() => new Date(datetime), [datetime]);
const [dateStr, dt, title] = useMemo(() => { const [dateStr, dt, title] = useMemo(() => {
if (!date.isValid()) return ['' + datetime, '', '']; if (!isValidDate(date)) return ['' + datetime, '', ''];
const realDate = date.toDate();
let str; let str;
if (format === 'micro') { if (format === 'micro') {
// If date <= 1 day ago or day is within this year // If date <= 1 day ago or day is within this year
const now = new Date(); const now = new Date();
const dayDiff = (now.getTime() - realDate.getTime()) / 1000 / day; const dayDiff = (now.getTime() - date.getTime()) / 1000 / day;
if (dayDiff <= 1) { if (dayDiff <= 1) {
str = twitterFromNow(realDate); str = twitterFromNow(date);
} else { } else {
const sameYear = now.getFullYear() === realDate.getFullYear(); const sameYear = now.getFullYear() === date.getFullYear();
if (sameYear) { if (sameYear) {
str = DTF(i18n.locale, { str = DTF(i18n.locale, {
year: undefined, year: undefined,
month: 'short', month: 'short',
day: 'numeric', day: 'numeric',
}).format(realDate); }).format(date);
} else { } else {
str = DTF(i18n.locale, { str = DTF(i18n.locale, {
dateStyle: 'short', dateStyle: 'short',
}).format(realDate); }).format(date);
} }
} }
} }
if (!str) str = rtfFromNow(realDate); if (!str) str = rtfFromNow(date);
return [str, realDate.toISOString(), realDate.toLocaleString()]; return [str, date.toISOString(), date.toLocaleString()];
}, [date, format, renderCount]); }, [date, format, renderCount]);
useEffect(() => { useEffect(() => {
if (!date.isValid()) return; if (!isValidDate(date)) return;
let timeout; let timeout;
let raf; let raf;
function rafRerender() { function rafRerender() {
@ -107,9 +114,10 @@ export default function RelativeTime({ datetime, format }) {
// If less than 1 minute, rerender every 10s // If less than 1 minute, rerender every 10s
// If less than 1 hour rerender every 1m // If less than 1 hour rerender every 1m
// Else, don't need to rerender // Else, don't need to rerender
if (date.diff(dayjs(), 'minute', true) < 1) { const seconds = (Date.now() - date.getTime()) / 1000;
if (seconds < minute) {
timeout = setTimeout(rafRerender, 10_000); timeout = setTimeout(rafRerender, 10_000);
} else if (date.diff(dayjs(), 'hour', true) < 1) { } else if (seconds < hour) {
timeout = setTimeout(rafRerender, 60_000); timeout = setTimeout(rafRerender, 60_000);
} }
} }