story-research-zapwall/components/NotificationCenter.tsx
2025-12-22 09:48:57 +01:00

44 lines
1.2 KiB
TypeScript

import { useNotifications } from '@/hooks/useNotifications'
import { useNotificationCenter } from '@/hooks/useNotificationCenter'
import { NotificationBadgeButton } from './NotificationBadgeButton'
import { NotificationPanel } from './NotificationPanel'
interface NotificationCenterProps {
userPubkey: string | null
onClose?: () => void
}
export function NotificationCenter({ userPubkey, onClose }: NotificationCenterProps) {
const {
notifications,
unreadCount,
markAsRead,
markAllAsRead,
deleteNotification: deleteNotificationHandler,
} = useNotifications(userPubkey)
const { isOpen, handleToggle, handleNotificationClick } = useNotificationCenter(
markAsRead,
onClose
)
if (!userPubkey) {
return null
}
return (
<div className="relative">
<NotificationBadgeButton unreadCount={unreadCount} onClick={handleToggle} />
{isOpen && (
<NotificationPanel
notifications={notifications}
unreadCount={unreadCount}
onNotificationClick={handleNotificationClick}
onDelete={deleteNotificationHandler}
onMarkAllAsRead={markAllAsRead}
onClose={handleClose}
/>
)}
</div>
)
}