Implements the frontend notification client for TEC-2217: 1. notifications-api.ts — API client for list, unread-count, markAsRead, markAllAsRead endpoints 2. notifications-store.ts — Zustand store for notification state (recent list, unread count, dropdown open state) 3. use-socket-notifications.ts — Socket.IO hook that connects with httpOnly cookie auth, listens for notification:new events, auto-reconnects, and syncs unread count on (re)connect 4. notification-bell.tsx — Bell icon with unread badge + dropdown showing 10 most recent notifications with time-ago formatting, mark-as-read on click, mark-all-as-read, and "Xem tất cả" link 5. notifications-provider.tsx — Provider wired into locale layout (inside AuthProvider) to initialize Socket.IO connection 6. Dashboard header — NotificationBell placed before LanguageSwitcher Added socket.io-client dependency. Co-Authored-By: Paperclip <noreply@paperclip.ing>
17 lines
384 B
TypeScript
17 lines
384 B
TypeScript
'use client';
|
|
|
|
import { useSocketNotifications } from '@/lib/hooks/use-socket-notifications';
|
|
|
|
/**
|
|
* Provider component that initializes the Socket.IO connection
|
|
* for real-time notifications. Must be rendered inside AuthProvider.
|
|
*/
|
|
export function NotificationsProvider({
|
|
children,
|
|
}: {
|
|
children: React.ReactNode;
|
|
}) {
|
|
useSocketNotifications();
|
|
return <>{children}</>;
|
|
}
|