diff --git a/src/frontend/apps/e2e/__tests__/app-impress/doc-search.spec.ts b/src/frontend/apps/e2e/__tests__/app-impress/doc-search.spec.ts index 97d36cc8..c9df5094 100644 --- a/src/frontend/apps/e2e/__tests__/app-impress/doc-search.spec.ts +++ b/src/frontend/apps/e2e/__tests__/app-impress/doc-search.spec.ts @@ -45,7 +45,7 @@ test.describe('Document search', () => { const listSearch = page.getByRole('listbox').getByRole('group'); const rowdoc = listSearch.getByRole('option').first(); await expect(rowdoc.getByText('keyboard_return')).toBeVisible(); - await expect(rowdoc.getByText(/seconds? ago/)).toBeVisible(); + await expect(rowdoc.getByText(/just now/)).toBeVisible(); await expect( listSearch.getByRole('option').getByText(doc1Title), diff --git a/src/frontend/apps/impress/src/features/docs/doc-management/components/SimpleDocItem.tsx b/src/frontend/apps/impress/src/features/docs/doc-management/components/SimpleDocItem.tsx index 8873f76b..1f8f6b71 100644 --- a/src/frontend/apps/impress/src/features/docs/doc-management/components/SimpleDocItem.tsx +++ b/src/frontend/apps/impress/src/features/docs/doc-management/components/SimpleDocItem.tsx @@ -1,9 +1,9 @@ -import { DateTime } from 'luxon'; import { useTranslation } from 'react-i18next'; import { css } from 'styled-components'; import { Box, Text } from '@/components'; import { useCunninghamTheme } from '@/cunningham'; +import { useDate } from '@/hooks/useDate'; import { useResponsiveStore } from '@/stores'; import ChildDocument from '../assets/child-document.svg'; @@ -38,6 +38,7 @@ export const SimpleDocItem = ({ const { isDesktop } = useResponsiveStore(); const { untitledDocument } = useTrans(); const { isChild } = useDocUtils(doc); + const { relativeDate } = useDate(); return ( )} diff --git a/src/frontend/apps/impress/src/features/docs/docs-grid/components/__tests__/DocsGridItemDate.test.tsx b/src/frontend/apps/impress/src/features/docs/docs-grid/components/__tests__/DocsGridItemDate.test.tsx index eb9546a8..1652e1e8 100644 --- a/src/frontend/apps/impress/src/features/docs/docs-grid/components/__tests__/DocsGridItemDate.test.tsx +++ b/src/frontend/apps/impress/src/features/docs/docs-grid/components/__tests__/DocsGridItemDate.test.tsx @@ -31,6 +31,10 @@ describe('DocsGridItemDate', () => { }); [ + { + updated_at: DateTime.now().minus({ seconds: 1 }).toISO(), + rendered: 'just now', + }, { updated_at: DateTime.now().minus({ minutes: 1 }).toISO(), rendered: '1 minute ago', diff --git a/src/frontend/apps/impress/src/hooks/useDate.tsx b/src/frontend/apps/impress/src/hooks/useDate.tsx index 14b09dbd..752cdced 100644 --- a/src/frontend/apps/impress/src/hooks/useDate.tsx +++ b/src/frontend/apps/impress/src/hooks/useDate.tsx @@ -10,7 +10,7 @@ const formatDefault: DateTimeFormatOptions = { }; export const useDate = () => { - const { i18n } = useTranslation(); + const { i18n, t } = useTranslation(); const formatDate = ( date: string, @@ -22,7 +22,19 @@ export const useDate = () => { }; const relativeDate = (date: string): string => { - return DateTime.fromISO(date).setLocale(i18n.language).toRelative() || ''; + const dateToCompare = DateTime.fromISO(date); + + if (!dateToCompare.isValid) { + return ''; + } + + const dateNow = DateTime.now(); + + const differenceInSeconds = dateNow.diff(dateToCompare).as('seconds'); + + return Math.abs(differenceInSeconds) >= 5 + ? dateToCompare.toRelative({ base: dateNow, locale: i18n.language }) + : t('just now'); }; const calculateDaysLeft = (date: string, daysLimit: number): number =>