feat(#71): add notification bell + preferences UI
- NotificationBell.svelte: bell icon in header with unread badge, dropdown showing last 10 notifications, mark-all-read, click-outside close, keyboard Escape support, polls every PUBLIC_NOTIFICATION_POLL_MS ms - Wire NotificationBell into +layout.svelte between ThemeToggle and UserMenu (authenticated users only) - Profile page: add notification preferences card with notifyOnReply / notifyOnMention toggles, loaded via GET and saved via PUT /api/users/me/notification-preferences - i18n: de/en/es message keys for bell, notifications list, and preference labels Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -4,6 +4,7 @@ import { page } from '$app/state';
|
||||
import { onMount } from 'svelte';
|
||||
import LanguageSwitcher from '$lib/components/LanguageSwitcher.svelte';
|
||||
import ThemeToggle from '$lib/components/ThemeToggle.svelte';
|
||||
import NotificationBell from '$lib/components/NotificationBell.svelte';
|
||||
import AppNav from './AppNav.svelte';
|
||||
import UserMenu from './UserMenu.svelte';
|
||||
|
||||
@@ -52,6 +53,11 @@ const userInitials = $derived.by(() => {
|
||||
<!-- Theme toggle -->
|
||||
<ThemeToggle />
|
||||
|
||||
<!-- Notification bell (authenticated users only) -->
|
||||
{#if data?.user}
|
||||
<NotificationBell />
|
||||
{/if}
|
||||
|
||||
<!-- User menu -->
|
||||
<UserMenu userInitials={userInitials} />
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user