This commit is contained in:
Stijnus
2025-01-22 14:47:58 +01:00
parent 2b585c24fe
commit a286e3bf34
2 changed files with 103 additions and 106 deletions

View File

@@ -125,15 +125,15 @@ const NotificationsTab = () => {
return details.message ? <p className="text-sm text-gray-600 dark:text-gray-400">{details.message}</p> : null;
};
const filterOptions: { id: FilterType; label: string; icon: string }[] = [
{ id: 'all', label: 'All Notifications', icon: 'i-ph:bell' },
{ id: 'system', label: 'System', icon: 'i-ph:gear' },
{ id: 'update', label: 'Updates', icon: 'i-ph:arrow-circle-up' },
{ id: 'error', label: 'Errors', icon: 'i-ph:warning-circle' },
{ id: 'warning', label: 'Warnings', icon: 'i-ph:warning' },
{ id: 'info', label: 'Information', icon: 'i-ph:info' },
{ id: 'provider', label: 'Providers', icon: 'i-ph:robot' },
{ id: 'network', label: 'Network', icon: 'i-ph:wifi-high' },
const filterOptions: { id: FilterType; label: string; icon: string; color: string }[] = [
{ id: 'all', label: 'All Notifications', icon: 'i-ph:bell', color: '#9333ea' },
{ id: 'system', label: 'System', icon: 'i-ph:gear', color: '#6b7280' },
{ id: 'update', label: 'Updates', icon: 'i-ph:arrow-circle-up', color: '#9333ea' },
{ id: 'error', label: 'Errors', icon: 'i-ph:warning-circle', color: '#ef4444' },
{ id: 'warning', label: 'Warnings', icon: 'i-ph:warning', color: '#f59e0b' },
{ id: 'info', label: 'Information', icon: 'i-ph:info', color: '#3b82f6' },
{ id: 'provider', label: 'Providers', icon: 'i-ph:robot', color: '#10b981' },
{ id: 'network', label: 'Network', icon: 'i-ph:wifi-high', color: '#6366f1' },
];
return (
@@ -153,10 +153,8 @@ const NotificationsTab = () => {
)}
>
<span
className={classNames(
filterOptions.find((opt) => opt.id === filter)?.icon || 'i-ph:funnel',
'text-lg text-gray-500 dark:text-gray-400',
)}
className={classNames('text-lg', filterOptions.find((opt) => opt.id === filter)?.icon || 'i-ph:funnel')}
style={{ color: filterOptions.find((opt) => opt.id === filter)?.color }}
/>
{filterOptions.find((opt) => opt.id === filter)?.label || 'Filter Notifications'}
<span className="i-ph:caret-down text-lg text-gray-500 dark:text-gray-400" />
@@ -165,7 +163,7 @@ const NotificationsTab = () => {
<DropdownMenu.Portal>
<DropdownMenu.Content
className="min-w-[200px] bg-white dark:bg-gray-800 rounded-lg shadow-lg py-1 z-[250] animate-in fade-in-0 zoom-in-95"
className="min-w-[200px] bg-white dark:bg-[#0A0A0A] rounded-lg shadow-lg py-1 z-[250] animate-in fade-in-0 zoom-in-95 border border-[#E5E5E5] dark:border-[#1A1A1A]"
sideOffset={5}
align="start"
side="bottom"
@@ -178,10 +176,8 @@ const NotificationsTab = () => {
>
<div className="mr-3 flex h-5 w-5 items-center justify-center">
<div
className={classNames(
option.icon,
'text-gray-500 dark:text-gray-400 group-hover:text-purple-500 transition-colors',
)}
className={classNames(option.icon, 'text-lg group-hover:text-purple-500 transition-colors')}
style={{ color: option.color }}
/>
</div>
<span className="group-hover:text-purple-500 transition-colors">{option.label}</span>