merge in main

src/view/com/util/TimeElapsed.tsx

@@ -1,26 +1,26 @@
 import React from 'react'
 
+import {useGetTimeAgo} from '#/lib/hooks/useTimeAgo'
 import {useTickEveryMinute} from '#/state/shell'
-import {ago} from 'lib/strings/time'
 
 export function TimeElapsed({
   timestamp,
   children,
-  timeToString = ago,
+  timeToString,
 }: {
   timestamp: string
   children: ({timeElapsed}: {timeElapsed: string}) => JSX.Element
   timeToString?: (timeElapsed: string) => string
 }) {
+  const ago = useGetTimeAgo()
+  const format = timeToString ?? ago
   const tick = useTickEveryMinute()
-  const [timeElapsed, setTimeAgo] = React.useState(() =>
-    timeToString(timestamp),
-  )
+  const [timeElapsed, setTimeAgo] = React.useState(() => format(timestamp))
 
   const [prevTick, setPrevTick] = React.useState(tick)
   if (prevTick !== tick) {
     setPrevTick(tick)
-    setTimeAgo(timeToString(timestamp))
+    setTimeAgo(format(timestamp))
   }
 
   return children({timeElapsed})

src/view/icons/index.tsx

@@ -1,5 +1,5 @@
 import {library} from '@fortawesome/fontawesome-svg-core'
-import {faAddressCard} from '@fortawesome/free-regular-svg-icons'
+import {faAddressCard} from '@fortawesome/free-regular-svg-icons/faAddressCard'
 import {faBell as farBell} from '@fortawesome/free-regular-svg-icons/faBell'
 import {faBookmark as farBookmark} from '@fortawesome/free-regular-svg-icons/faBookmark'
 import {faCalendar as farCalendar} from '@fortawesome/free-regular-svg-icons/faCalendar'
@@ -25,8 +25,6 @@ import {faSquareCheck} from '@fortawesome/free-regular-svg-icons/faSquareCheck'
 import {faSquarePlus} from '@fortawesome/free-regular-svg-icons/faSquarePlus'
 import {faTrashCan} from '@fortawesome/free-regular-svg-icons/faTrashCan'
 import {faUser} from '@fortawesome/free-regular-svg-icons/faUser'
-import {faFlask} from '@fortawesome/free-solid-svg-icons'
-import {faUniversalAccess} from '@fortawesome/free-solid-svg-icons'
 import {faAngleDown} from '@fortawesome/free-solid-svg-icons/faAngleDown'
 import {faAngleLeft} from '@fortawesome/free-solid-svg-icons/faAngleLeft'
 import {faAngleRight} from '@fortawesome/free-solid-svg-icons/faAngleRight'
@@ -62,6 +60,7 @@ import {faExclamation} from '@fortawesome/free-solid-svg-icons/faExclamation'
 import {faEye} from '@fortawesome/free-solid-svg-icons/faEye'
 import {faFilter} from '@fortawesome/free-solid-svg-icons/faFilter'
 import {faFire} from '@fortawesome/free-solid-svg-icons/faFire'
+import {faFlask} from '@fortawesome/free-solid-svg-icons/faFlask'
 import {faGear} from '@fortawesome/free-solid-svg-icons/faGear'
 import {faGlobe} from '@fortawesome/free-solid-svg-icons/faGlobe'
 import {faHand} from '@fortawesome/free-solid-svg-icons/faHand'
@@ -97,6 +96,7 @@ import {faSignal} from '@fortawesome/free-solid-svg-icons/faSignal'
 import {faSliders} from '@fortawesome/free-solid-svg-icons/faSliders'
 import {faThumbtack} from '@fortawesome/free-solid-svg-icons/faThumbtack'
 import {faTicket} from '@fortawesome/free-solid-svg-icons/faTicket'
+import {faUniversalAccess} from '@fortawesome/free-solid-svg-icons/faUniversalAccess'
 import {faUserCheck} from '@fortawesome/free-solid-svg-icons/faUserCheck'
 import {faUserPlus} from '@fortawesome/free-solid-svg-icons/faUserPlus'
 import {faUsers} from '@fortawesome/free-solid-svg-icons/faUsers'

src/view/screens/Log.tsx

@@ -1,18 +1,19 @@
 import React from 'react'
 import {StyleSheet, TouchableOpacity, View} from 'react-native'
-import {useFocusEffect} from '@react-navigation/native'
 import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
-import {NativeStackScreenProps, CommonNavigatorParams} from 'lib/routes/types'
-import {ScrollView} from '../com/util/Views'
-import {s} from 'lib/styles'
-import {ViewHeader} from '../com/util/ViewHeader'
-import {Text} from '../com/util/text/Text'
-import {usePalette} from 'lib/hooks/usePalette'
-import {getEntries} from '#/logger/logDump'
-import {ago} from 'lib/strings/time'
-import {useLingui} from '@lingui/react'
 import {msg} from '@lingui/macro'
+import {useLingui} from '@lingui/react'
+import {useFocusEffect} from '@react-navigation/native'
+
+import {useGetTimeAgo} from '#/lib/hooks/useTimeAgo'
+import {getEntries} from '#/logger/logDump'
 import {useSetMinimalShellMode} from '#/state/shell'
+import {usePalette} from 'lib/hooks/usePalette'
+import {CommonNavigatorParams, NativeStackScreenProps} from 'lib/routes/types'
+import {s} from 'lib/styles'
+import {Text} from '../com/util/text/Text'
+import {ViewHeader} from '../com/util/ViewHeader'
+import {ScrollView} from '../com/util/Views'
 
 export function LogScreen({}: NativeStackScreenProps<
   CommonNavigatorParams,
@@ -22,6 +23,7 @@ export function LogScreen({}: NativeStackScreenProps<
   const {_} = useLingui()
   const setMinimalShellMode = useSetMinimalShellMode()
   const [expanded, setExpanded] = React.useState<string[]>([])
+  const timeAgo = useGetTimeAgo()
 
   useFocusEffect(
     React.useCallback(() => {
@@ -70,7 +72,7 @@ export function LogScreen({}: NativeStackScreenProps<
                     />
                   ) : undefined}
                   <Text type="sm" style={[styles.ts, pal.textLight]}>
-                    {ago(entry.timestamp)}
+                    {timeAgo(entry.timestamp)}
                   </Text>
                 </TouchableOpacity>
                 {expanded.includes(entry.id) ? (