Use correct, custom formatter in Age component

.changelog/1230.bugfix.md

@@ -0,0 +1 @@
+Use correct, custom formatter in Age component

src/app/components/Age/__tests__/index.test.tsx

@@ -0,0 +1,20 @@
+import { screen } from '@testing-library/react'
+import { renderWithProviders } from '../../../utils/renderWithProviders'
+import { Age } from '../'
+
+describe('RuntimeBlockDetailView', () => {
+  beforeEach(() => {
+    jest.useFakeTimers()
+    jest.setSystemTime(new Date('2024-02-05T10:14:35.000Z'))
+  })
+
+  afterEach(() => {
+    jest.useRealTimers()
+  })
+
+  it('should display formatted values', () => {
+    renderWithProviders(<Age sinceTimestamp={'2024-02-05T10:14:40.000Z'} />)
+    expect(screen.getByText('5 sec')).toBeInTheDocument()
+    expect(screen.queryByText('less than a minute')).not.toBeInTheDocument()
+  })
+})

src/app/components/Age/index.tsx

@@ -1,6 +1,6 @@
 import { FC } from 'react'
 import Tooltip from '@mui/material/Tooltip'
-import { formatDistanceToNow } from 'date-fns'
+import { formatDistanceToNow } from '../../utils/dateFormatter'
 import Box from '@mui/material/Box'
 import { useFormattedTimestamp } from '../../hooks/useFormattedTimestamp'
 import { tooltipDelay } from '../../../styles/theme'