diff --git a/src/components/NewskieDialog.tsx b/src/components/NewskieDialog.tsx
index fcdae0da..789a42d5 100644
--- a/src/components/NewskieDialog.tsx
+++ b/src/components/NewskieDialog.tsx
@@ -30,12 +30,13 @@ export function NewskieDialog({
const moderation = moderateProfile(profile, moderationOpts)
return sanitizeDisplayName(name, moderation.ui('displayName'))
}, [moderationOpts, profile])
+ const [now] = React.useState(Date.now())
const timeAgo = useGetTimeAgo()
const createdAt = profile.createdAt as string | undefined
const daysOld = React.useMemo(() => {
if (!createdAt) return Infinity
- return differenceInSeconds(new Date(), new Date(createdAt)) / 86400
- }, [createdAt])
+ return differenceInSeconds(now, new Date(createdAt)) / 86400
+ }, [createdAt, now])
if (!createdAt || daysOld > 7) return null
@@ -70,7 +71,7 @@ export function NewskieDialog({
{profileName} joined Bluesky{' '}
- {timeAgo(createdAt, {format: 'long'})} ago
+ {timeAgo(createdAt, now, {format: 'long'})} ago
diff --git a/src/lib/hooks/useTimeAgo.ts b/src/lib/hooks/useTimeAgo.ts
index 5f0782f9..efcb4754 100644
--- a/src/lib/hooks/useTimeAgo.ts
+++ b/src/lib/hooks/useTimeAgo.ts
@@ -1,4 +1,4 @@
-import {useCallback, useMemo} from 'react'
+import {useCallback} from 'react'
import {msg, plural} from '@lingui/macro'
import {I18nContext, useLingui} from '@lingui/react'
import {differenceInSeconds} from 'date-fns'
@@ -12,25 +12,16 @@ export function useGetTimeAgo() {
const {_} = useLingui()
return useCallback(
(
- date: number | string | Date,
+ earlier: number | string | Date,
+ later: number | string | Date,
options?: Omit,
) => {
- return dateDiff(date, Date.now(), {lingui: _, format: options?.format})
+ return dateDiff(earlier, later, {lingui: _, format: options?.format})
},
[_],
)
}
-export function useTimeAgo(
- date: number | string | Date,
- options?: Omit,
-): string {
- const timeAgo = useGetTimeAgo()
- return useMemo(() => {
- return timeAgo(date, {...options})
- }, [date, options, timeAgo])
-}
-
const NOW = 5
const MINUTE = 60
const HOUR = MINUTE * 60
diff --git a/src/view/com/util/TimeElapsed.tsx b/src/view/com/util/TimeElapsed.tsx
index d939b316..a4958518 100644
--- a/src/view/com/util/TimeElapsed.tsx
+++ b/src/view/com/util/TimeElapsed.tsx
@@ -15,12 +15,14 @@ export function TimeElapsed({
const ago = useGetTimeAgo()
const format = timeToString ?? ago
const tick = useTickEveryMinute()
- const [timeElapsed, setTimeAgo] = React.useState(() => format(timestamp))
+ const [timeElapsed, setTimeAgo] = React.useState(() =>
+ format(timestamp, tick),
+ )
const [prevTick, setPrevTick] = React.useState(tick)
if (prevTick !== tick) {
setPrevTick(tick)
- setTimeAgo(format(timestamp))
+ setTimeAgo(format(timestamp, tick))
}
return children({timeElapsed})
diff --git a/src/view/screens/Log.tsx b/src/view/screens/Log.tsx
index e10aa83a..e6040b77 100644
--- a/src/view/screens/Log.tsx
+++ b/src/view/screens/Log.tsx
@@ -7,6 +7,7 @@ import {useFocusEffect} from '@react-navigation/native'
import {useGetTimeAgo} from '#/lib/hooks/useTimeAgo'
import {getEntries} from '#/logger/logDump'
+import {useTickEveryMinute} from '#/state/shell'
import {useSetMinimalShellMode} from '#/state/shell'
import {usePalette} from 'lib/hooks/usePalette'
import {CommonNavigatorParams, NativeStackScreenProps} from 'lib/routes/types'
@@ -24,6 +25,7 @@ export function LogScreen({}: NativeStackScreenProps<
const setMinimalShellMode = useSetMinimalShellMode()
const [expanded, setExpanded] = React.useState([])
const timeAgo = useGetTimeAgo()
+ const tick = useTickEveryMinute()
useFocusEffect(
React.useCallback(() => {
@@ -72,7 +74,7 @@ export function LogScreen({}: NativeStackScreenProps<
/>
) : undefined}
- {timeAgo(entry.timestamp)}
+ {timeAgo(entry.timestamp, tick)}
{expanded.includes(entry.id) ? (