39 lines
1.4 KiB
TypeScript
39 lines
1.4 KiB
TypeScript
import formatDate from "../../utils/date/formatDate.js";
|
|
import formatTime from "../../utils/date/formatTime.js";
|
|
import styles from "./NotificationCard.module.css"
|
|
import Notification from "../../interfaces/notification.interface";
|
|
|
|
interface NotificationCardProps {
|
|
notifications: Notification[];
|
|
deleteNotification: (id: string) => void;
|
|
}
|
|
|
|
function NotificationCard({ notifications, deleteNotification }: NotificationCardProps) {
|
|
return (
|
|
notifications.map((notification, index) => (
|
|
<div className={`${styles.notificationCard} glassBorder`} key={index}>
|
|
<div className={styles.cardHeader}>
|
|
<span className={styles.timeTag}>
|
|
Le {formatDate(notification.created_at)} à {formatTime(notification.created_at)}
|
|
</span>
|
|
<button
|
|
className={styles.closeIconButton}
|
|
onClick={() => deleteNotification(notification.id)}
|
|
title="Supprimer"
|
|
>
|
|
✕
|
|
</button>
|
|
</div>
|
|
|
|
<div>
|
|
<p className={styles.message}>
|
|
{notification.data.message}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
))
|
|
);
|
|
}
|
|
|
|
export default NotificationCard;
|