refactor Notifications

This commit is contained in:
alma 2026-01-16 00:24:41 +01:00
parent c29ade92f8
commit dcb3e1fe9a

View File

@ -117,14 +117,14 @@ export const NotificationBadge = memo(function NotificationBadge({ className }:
</div>
{/* Filters and Sort */}
<div className="p-3 border-b bg-gray-50/50 space-y-2">
<div className="p-3 border-b bg-white space-y-2">
<div className="flex items-center gap-2">
<Filter className="h-4 w-4 text-muted-foreground" />
<Select value={filterBy} onValueChange={(v) => setFilterBy(v as FilterOption)}>
<SelectTrigger className="h-8 text-xs flex-1">
<SelectTrigger className="h-8 text-xs flex-1 bg-white border-gray-200">
<SelectValue />
</SelectTrigger>
<SelectContent>
<SelectContent className="bg-white">
<SelectItem value="all">Toutes les sources</SelectItem>
<SelectItem value="email">Courrier</SelectItem>
<SelectItem value="rocketchat">Parole</SelectItem>
@ -133,10 +133,10 @@ export const NotificationBadge = memo(function NotificationBadge({ className }:
</SelectContent>
</Select>
<Select value={sortBy} onValueChange={(v) => setSortBy(v as SortOption)}>
<SelectTrigger className="h-8 w-24 text-xs">
<SelectTrigger className="h-8 w-24 text-xs bg-white border-gray-200">
<SelectValue />
</SelectTrigger>
<SelectContent>
<SelectContent className="bg-white">
<SelectItem value="newest">Plus récent</SelectItem>
<SelectItem value="oldest">Plus ancien</SelectItem>
</SelectContent>
@ -176,8 +176,16 @@ export const NotificationBadge = memo(function NotificationBadge({ className }:
{sortedAndFilteredNotifications.map((notification) => (
<DropdownMenuItem
key={notification.id}
className="px-4 py-3 cursor-default hover:bg-gray-50"
onSelect={(e) => e.preventDefault()}
className="px-4 py-3 cursor-pointer hover:bg-gray-50"
onSelect={async (e) => {
e.preventDefault();
// Si on clique sur la notification elle-même et qu'elle a un lien, ouvrir et marquer comme lu
if (notification.link && !notification.isRead) {
await markAsRead(notification.id);
window.location.href = notification.link;
setIsOpen(false);
}
}}
>
<div className="w-full">
<div className="flex items-start justify-between gap-2">
@ -238,7 +246,16 @@ export const NotificationBadge = memo(function NotificationBadge({ className }:
</Button>
)}
{notification.link && (
<Link href={notification.link} onClick={() => setIsOpen(false)}>
<Link
href={notification.link}
onClick={async () => {
// Marquer comme lu automatiquement quand on ouvre
if (!notification.isRead) {
await markAsRead(notification.id);
}
setIsOpen(false);
}}
>
<Button variant="ghost" size="sm" className="h-6 w-6 p-0" title="Ouvrir">
<ExternalLink className="h-3.5 w-3.5" />
</Button>