socket and badge

src/lib/SocketManagment.tsx

@@ -0,0 +1,37 @@
+import { useEmailWebSocketContext } from '@/contexts/EmailWebSocketContext';
+import { useEmailEvents } from '@/hooks/useEmailEvents';
+import { FC, useCallback, useEffect } from 'react'
+import { useQueryClient } from '@tanstack/react-query';
+
+const SocketManagment: FC = () => {
+    const { socket } = useEmailWebSocketContext();
+    const queryClient = useQueryClient();
+
+    useEffect(() => {
+        if (socket) {
+            socket.on('connect', () => {
+            });
+        }
+    }, [socket]);
+
+    const handleNewEmailEvent = useCallback(() => {
+        queryClient.invalidateQueries({ queryKey: ['mailbox-count'] });
+        queryClient.invalidateQueries({ queryKey: ['inbox'] });
+    }, []);
+
+    const handleEmailActionEvent = useCallback(() => {
+        queryClient.invalidateQueries({ queryKey: ['mailbox-count'] });
+        queryClient.invalidateQueries({ queryKey: ['inbox'] });
+    }, []);
+
+    useEmailEvents(socket, {
+        onNewEmail: handleNewEmailEvent,
+        onEmailRead: handleEmailActionEvent,
+        onEmailDeleted: handleEmailActionEvent,
+        // onMailboxUpdated: handleEmailActionEvent,
+    });
+
+    return null
+}
+
+export default SocketManagment