From 610a82c1d566c9360793d9f2b33777e9e29c468d Mon Sep 17 00:00:00 2001 From: hamid zarghami Date: Thu, 11 Dec 2025 11:47:54 +0330 Subject: [PATCH] base notification socket --- .env | 2 +- src/components/Notification.tsx | 75 ++++++++++++++++++++++++++++++ src/pages/pager/hooks/useSocket.ts | 2 + src/router/Main.tsx | 3 ++ 4 files changed, 81 insertions(+), 1 deletion(-) create mode 100644 src/components/Notification.tsx diff --git a/.env b/.env index 4cf5cac..3548a85 100644 --- a/.env +++ b/.env @@ -3,4 +3,4 @@ VITE_REFRESH_TOKEN_NAME = 'dmnu-a-rt' VITE_BASE_URL = 'https://dmenuplus-api.dev.danakcorp.com' # VITE_BASE_URL = 'http://192.168.1.112:4001' # VITE_SOCKET_URL = 'https://dmenuplus-api.dev.danakcorp.com/pager' -VITE_SOCKET_URL = 'http://192.168.99.242:4000/pager' \ No newline at end of file +VITE_SOCKET_URL = 'http://192.168.99.242:4000' \ No newline at end of file diff --git a/src/components/Notification.tsx b/src/components/Notification.tsx new file mode 100644 index 0000000..b4189db --- /dev/null +++ b/src/components/Notification.tsx @@ -0,0 +1,75 @@ +import { getToken } from '@/config/func' +import { useSocket } from '@/pages/pager/hooks/useSocket' +import { type FC, useEffect, useCallback } from 'react' + +const Notification: FC = () => { + + // توکن بدون Bearer prefix (مثل کد HTML) + const token = getToken() + // اضافه کردن /notifications namespace به URL + const socketUrl = `${import.meta.env.VITE_SOCKET_URL}/notifications` + const { connect, socket, isConnected, error } = useSocket(socketUrl, token!) + + // لاگ کردن وضعیت اتصال + useEffect(() => { + console.log('🔄 Notification: وضعیت اتصال:', isConnected ? 'متصل ✅' : 'قطع ❌') + }, [isConnected]) + + // لاگ کردن خطاها + useEffect(() => { + if (error) { + console.error('❌ Notification: خطا در اتصال:', error) + } + }, [error]) + + + useEffect(() => { + console.log('🔌 Notification: تلاش برای اتصال...', socketUrl) + connect() + }, [connect]) + + const handleGetNotification = useCallback((data: unknown) => { + console.log('✅ Notification: دریافت نوتیفیکیشن‌ها:', data) + // alert('دریافت نوتیفیکیشن‌ها: ' + JSON.stringify(data)) + }, []) + + useEffect(() => { + if (isConnected) { + console.log('✅ Notification: متصل شد! ارسال درخواست...') + socket?.emit('get:notifications', { limit: 50 }) + } + }, [isConnected, socket]) + + useEffect(() => { + if (socket) { + console.log('📡 Notification: تنظیم listener برای notifications:list') + + const errorHandler = (error: unknown) => { + console.error('❌ Notification Error:', error) + } + + const exceptionHandler = (error: unknown) => { + console.error('❌ Notification Exception:', error) + } + + socket.on('notifications:list', handleGetNotification) + socket.on('error', errorHandler) + socket.on('exception', exceptionHandler) + + // cleanup function + return () => { + socket.off('notifications:list', handleGetNotification) + socket.off('error', errorHandler) + socket.off('exception', exceptionHandler) + } + } + }, [socket, handleGetNotification]) + + + + return ( +
+ ) +} + +export default Notification \ No newline at end of file diff --git a/src/pages/pager/hooks/useSocket.ts b/src/pages/pager/hooks/useSocket.ts index 95df3a4..4ddc407 100644 --- a/src/pages/pager/hooks/useSocket.ts +++ b/src/pages/pager/hooks/useSocket.ts @@ -74,6 +74,7 @@ export const useSocket = ( reconnection: boolean; reconnectionAttempts: number; reconnectionDelay: number; + transports: string[]; auth?: { token: string }; query?: Record; } = { @@ -81,6 +82,7 @@ export const useSocket = ( reconnection, reconnectionAttempts, reconnectionDelay, + transports: ["websocket", "polling"], // مثل کد HTML }; if (token) { diff --git a/src/router/Main.tsx b/src/router/Main.tsx index 6009e76..369705c 100644 --- a/src/router/Main.tsx +++ b/src/router/Main.tsx @@ -40,6 +40,7 @@ import ReviewsList from '@/pages/review/List' import DetailReview from '@/pages/review/Detail' import PagersList from '@/pages/pager/List' import NotificationsList from '@/pages/notifications/List' +import Notification from '@/components/Notification' const MainRouter: FC = () => { const { hasSubMenu } = useSharedStore() @@ -103,6 +104,8 @@ const MainRouter: FC = () => {