socket and badge

src/pages/received/List.tsx

@@ -1,5 +1,5 @@
 import Filters, { FilterValues } from '../../components/Filters';
-import { FC, useState, useEffect, useCallback } from 'react'
+import { FC, useState, useEffect } from 'react'
 import { useTranslation } from 'react-i18next'
 import Table from '../../components/Table';
 import { ColumnType } from '../../components/types/TableTypes';
@@ -11,10 +11,10 @@ import { InboxMessage } from './types/Types';
 import { formatDate } from '@/config/func';
 import MarkAsRead from '@/assets/images/mark_as_read.svg'
 import { useEmailActions } from '@/hooks/useEmailActions';
-import { useEmailWebSocketContext } from '@/contexts/EmailWebSocketContext';
-import { useEmailEvents } from '@/hooks/useEmailEvents';
+import { useQueryClient } from '@tanstack/react-query';
 
 const List: FC = () => {
+    const queryClient = useQueryClient();
     const navigate = useNavigate();
     const location = useLocation();
     const { t } = useTranslation();
@@ -28,31 +28,12 @@ const List: FC = () => {
         ...filters
     });
 
-    // WebSocket integration
-    const { socket } = useEmailWebSocketContext();
-
-    const handleNewEmailEvent = useCallback(() => {
-        // Refresh inbox when new email arrives
-        refetch();
-    }, [refetch]);
-
-    const handleEmailActionEvent = useCallback(() => {
-        // Refresh inbox when email actions occur
-        refetch();
-    }, [refetch]);
-
-    useEmailEvents(socket, {
-        onNewEmail: handleNewEmailEvent,
-        onEmailRead: handleEmailActionEvent,
-        onEmailDeleted: handleEmailActionEvent,
-        // onMailboxUpdated: handleEmailActionEvent,
-    });
-
     // Force refresh when component mounts or location changes
     useEffect(() => {
         // Refetch when coming back to inbox from other pages
         if (location.pathname === '/') {
             refetch();
+            queryClient.invalidateQueries({ queryKey: ['mailbox-count'] });
         }
     }, [location.pathname, refetch]);