)}
-
- {/* Notification Dialog */}
- {showNotifications && (
-
- )}
>
)
}
diff --git a/web/default/src/components/layout/components/authenticated-layout.tsx b/web/default/src/components/layout/components/authenticated-layout.tsx
index a39b4e19faf..129625eee04 100644
--- a/web/default/src/components/layout/components/authenticated-layout.tsx
+++ b/web/default/src/components/layout/components/authenticated-layout.tsx
@@ -45,6 +45,7 @@ export function AuthenticatedLayout(props: AuthenticatedLayoutProps) {
className={cn(
'@container/content',
'h-[calc(100svh-var(--app-header-height,0px))]',
+ 'min-h-0 overflow-hidden',
'peer-data-[variant=inset]:h-[calc(100svh-var(--app-header-height,0px)-(var(--spacing)*4))]'
)}
>
diff --git a/web/default/src/components/layout/components/public-header.tsx b/web/default/src/components/layout/components/public-header.tsx
index 4aca8365b70..5fad63703d3 100644
--- a/web/default/src/components/layout/components/public-header.tsx
+++ b/web/default/src/components/layout/components/public-header.tsx
@@ -35,8 +35,7 @@ import {
} from '@/components/ui/dialog'
import { Skeleton } from '@/components/ui/skeleton'
import { LanguageSwitcher } from '@/components/language-switcher'
-import { NotificationButton } from '@/components/notification-button'
-import { NotificationDialog } from '@/components/notification-dialog'
+import { NotificationPopover } from '@/components/notification-popover'
import { ProfileDropdown } from '@/components/profile-dropdown'
import { ThemeSwitch } from '@/components/theme-switch'
import { defaultTopNavLinks } from '../config/top-nav.config'
@@ -271,9 +270,15 @@ export function PublicHeader(props: PublicHeaderProps) {
{showLanguageSwitcher && }
{showThemeSwitch && }
{showNotifications && (
- notifications.openDialog()}
+ activeTab={notifications.activeTab}
+ onTabChange={notifications.setActiveTab}
+ notice={notifications.notice}
+ announcements={notifications.announcements}
+ loading={notifications.loading}
/>
)}
@@ -445,20 +450,6 @@ export function PublicHeader(props: PublicHeaderProps) {
-
- {/* Notification Dialog */}
- {showNotifications && (
-
- )}
>
)
}
diff --git a/web/default/src/components/notification-button.tsx b/web/default/src/components/notification-button.tsx
deleted file mode 100644
index b11ec535168..00000000000
--- a/web/default/src/components/notification-button.tsx
+++ /dev/null
@@ -1,63 +0,0 @@
-/*
-Copyright (C) 2023-2026 QuantumNous
-
-This program is free software: you can redistribute it and/or modify
-it under the terms of the GNU Affero General Public License as
-published by the Free Software Foundation, either version 3 of the
-License, or (at your option) any later version.
-
-This program is distributed in the hope that it will be useful,
-but WITHOUT ANY WARRANTY; without even the implied warranty of
-MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
-GNU Affero General Public License for more details.
-
-You should have received a copy of the GNU Affero General Public License
-along with this program. If not, see .
-
-For commercial licensing, please contact support@quantumnous.com
-*/
-import { Bell } from 'lucide-react'
-import { useTranslation } from 'react-i18next'
-import { cn } from '@/lib/utils'
-import { Badge } from '@/components/ui/badge'
-import { Button } from '@/components/ui/button'
-
-interface NotificationButtonProps {
- unreadCount: number
- onClick: () => void
- className?: string
-}
-
-/**
- * Notification bell button with unread badge
- * Displays in the app header next to theme switch and profile dropdown
- */
-export function NotificationButton({
- unreadCount,
- onClick,
- className,
-}: NotificationButtonProps) {
- const { t } = useTranslation()
- return (
-