Skip to content

Commit

Permalink
feat: use relative time on the notification panel
Browse files Browse the repository at this point in the history
  • Loading branch information
faouziMohamed committed Nov 17, 2023
1 parent 16f4cd6 commit f8dacb8
Showing 1 changed file with 13 additions and 2 deletions.
15 changes: 13 additions & 2 deletions src/app/(app)/topNavbar/NotificationLine.tsx
Original file line number Diff line number Diff line change
@@ -1,7 +1,10 @@
import { Box, Icon, MenuItem, Stack, Text } from '@chakra-ui/react';
import dayjs from 'dayjs';
import relativeTime from 'dayjs/plugin/relativeTime';
import Link from 'next/link';
import { BiSolidError } from 'react-icons/bi';
import { IoInformationCircleSharp } from 'react-icons/io5';
import 'dayjs/locale/fr';

import { CODES_PAGE } from '@/lib/client-route';
import { getSeverityColor } from '@/lib/utils';
Expand All @@ -13,6 +16,9 @@ type Props = {
notification: AppNotification;
};

dayjs.locale('fr');
dayjs.extend(relativeTime);

export function NotificationLine({ notification }: Props) {
const {
description,
Expand All @@ -21,6 +27,7 @@ export function NotificationLine({ notification }: Props) {
severity,

action,
timestamp,
} = notification;
const iconColor = getSeverityColor(severity);
const clickable = action === 'CODE_IMPORT';
Expand Down Expand Up @@ -64,10 +71,14 @@ export function NotificationLine({ notification }: Props) {
{description}
</Text>
<Text fontSize='0.7rem' color='blackAlpha.600' fontWeight='400'>
{/* display elapsed time in good way */}
Il y a 2 jours
{/* display elapsed time */}
{formatDate(timestamp)}
</Text>
</Stack>
</MenuItem>
);
}

export function formatDate(date: Date | string) {
return dayjs().to(dayjs(date));
}

1 comment on commit f8dacb8

@vercel
Copy link

@vercel vercel bot commented on f8dacb8 Nov 17, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Please sign in to comment.