'use client'; import { useEffect, useState, useCallback, useRef } from 'react'; import { SignalRConnectionManager } from '@/lib/signalr/ConnectionManager'; import { SIGNALR_CONFIG } from '@/lib/signalr/config'; import { useAuthStore } from '@/stores/authStore'; export interface Notification { message: string; type: 'info' | 'success' | 'warning' | 'error' | 'test'; timestamp: string; } export function useNotificationHub() { const isAuthenticated = useAuthStore((state) => state.isAuthenticated); const [connectionState, setConnectionState] = useState< 'disconnected' | 'connecting' | 'connected' | 'reconnecting' >('disconnected'); const [notifications, setNotifications] = useState([]); const managerRef = useRef(null); useEffect(() => { if (!isAuthenticated) return; const manager = new SignalRConnectionManager( SIGNALR_CONFIG.HUB_URLS.NOTIFICATION ); managerRef.current = manager; // 监听连接状态 const unsubscribe = manager.onStateChange(setConnectionState); // 监听通知事件 manager.on('Notification', (notification: Notification) => { console.log('[NotificationHub] Received notification:', notification); setNotifications((prev) => [notification, ...prev].slice(0, 50)); // 保留最近 50 条 }); manager.on( 'NotificationRead', (data: { NotificationId: string; ReadAt: string }) => { console.log('[NotificationHub] Notification read:', data); } ); // 启动连接 manager.start(); return () => { unsubscribe(); manager.stop(); }; }, [isAuthenticated]); const markAsRead = useCallback(async (notificationId: string) => { if (!managerRef.current) return; try { await managerRef.current.invoke('MarkAsRead', notificationId); } catch (error) { console.error( '[NotificationHub] Error marking notification as read:', error ); } }, []); const clearNotifications = useCallback(() => { setNotifications([]); }, []); return { connectionState, notifications, markAsRead, clearNotifications, isConnected: connectionState === 'connected', }; }