fix(messaging): remove @ts-nocheck and fully type useMessaging hook (#934)

- Remove the @ts-nocheck suppression from useMessaging.tsx so TypeScript
  enforces type safety over the entire real-time messaging hook.

- Drop the unused useWebSocket call: the store (messagingStore.ts) owns the
  socket lifecycle via wsManager; there is no need for a second WebSocket
  abstraction layer in the hook.

- Replace NodeJS.Timeout with ReturnType<typeof setTimeout> so the file
  compiles correctly in both browser and Node runtime contexts.

- Remove isReconnecting / connectionError from the hook's return value;
  reconnection state is tracked inside the store (isConnected flag).

- Extend MessagingState interface with all actions that useMessaging was
  consuming but that were absent from the interface:
    · loadMoreMessages     - paginate older messages
    · setSearchQuery       - filter conversation list
    · setSelectedFiles     - replace selected-file list
    · removeSelectedFile   - remove a file by index
    · uploadAttachments    - upload Files, return Attachment[]
    · createConversation   - start a new conversation by participantId
    · getTotalUnreadCount  - aggregate unread badge count

- Provide stub implementations for all new store actions so they satisfy
  the interface; real server integration can replace the stubs without
  changing any consumer types.

- Verified: npx tsc --noEmit exits 0 with no errors across the project.

Closes #934

Author: eogenyi23-creator

src/app/hooks/useMessaging.tsx

@@ -1,12 +1,9 @@
-// eslint-disable-next-line @typescript-eslint/ban-ts-comment
-// @ts-nocheck
 'use client';
 
 import { useCallback, useEffect, useRef } from 'react';
 import toast from 'react-hot-toast';
 import { useMessagingStore } from '@/app/store/messagingStore';
 import type { Attachment } from '@/app/store/messagingStore';
-import { useWebSocket } from '@/hooks/useWebSocket';
 
 export function useMessaging() {
   const {
@@ -38,13 +35,9 @@ export function useMessaging() {
     getTotalUnreadCount,
   } = useMessagingStore();
 
-  const typingTimeoutRef = useRef<NodeJS.Timeout | null>(null);
+  const typingTimeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);
 
-  const { status } = useWebSocket('messaging', {
-    onDisconnect: () => disconnectSocket(),
-  });
-
-  // Initialize socket on mount
+  // Initialize socket on mount; clean up on unmount
   useEffect(() => {
     initializeSocket();
     return () => {
@@ -58,12 +51,10 @@ export function useMessaging() {
       setTyping(true);
     }
 
-    // Clear existing timeout
     if (typingTimeoutRef.current) {
       clearTimeout(typingTimeoutRef.current);
     }
 
-    // Set new timeout to stop typing after 2 seconds of inactivity
     typingTimeoutRef.current = setTimeout(() => {
       setTyping(false);
     }, 2000);
@@ -93,7 +84,7 @@ export function useMessaging() {
     [selectedFiles, uploadAttachments, sendMessage, handleTypingStop],
   );
 
-  // Select a conversation
+  // Select a conversation by id
   const handleSelectConversation = useCallback(
     (conversationId: string) => {
       const conversation = conversations.find((c) => c.id === conversationId);
@@ -104,18 +95,20 @@ export function useMessaging() {
     [conversations, setCurrentConversation],
   );
 
-  // Handle file selection
+  // Handle file selection with 10 MB size guard
   const handleFileSelect = useCallback(
     (files: FileList) => {
       const fileArray = Array.from(files);
-      const maxSize = 10 * 1024 * 1024; // 10MB limit
+      const maxSize = 10 * 1024 * 1024; // 10 MB
       const rejectedFiles = fileArray.filter((file) => file.size > maxSize);
+
       if (rejectedFiles.length > 0) {
         const names = rejectedFiles.map((f) => f.name).join(', ');
         toast.error(
-          `Skipped ${rejectedFiles.length} file(s): ${names}. Max file size is 10MB.`,
+          `Skipped ${rejectedFiles.length} file(s): ${names}. Max file size is 10 MB.`,
         );
       }
+
       const validFiles = fileArray.filter((file) => file.size <= maxSize);
       setSelectedFiles([...selectedFiles, ...validFiles]);
     },
@@ -131,24 +124,24 @@ export function useMessaging() {
     );
   });
 
-  // Get the other participant in a conversation
+  // Return the other participant in a one-to-one conversation
   const getOtherParticipant = useCallback(
     (conversationId: string) => {
       const conversation = conversations.find((c) => c.id === conversationId);
       if (!conversation) return null;
-      return conversation.participants.find((p) => p.id !== 'current-user') || null;
+      return conversation.participants.find((p) => p.id !== 'current-user') ?? null;
     },
     [conversations],
   );
 
-  // Get typing user names for current conversation
-  const getTypingUserNames = useCallback(() => {
+  // Build a human-readable typing indicator string for the current conversation
+  const getTypingUserNames = useCallback((): string => {
     if (!currentConversation || typingUsers.size === 0) return '';
 
     const names = Array.from(typingUsers)
       .map((userId) => {
         const participant = currentConversation.participants.find((p) => p.id === userId);
-        return participant?.name || 'Someone';
+        return participant?.name ?? 'Someone';
       })
       .join(', ');
 
@@ -162,8 +155,6 @@ export function useMessaging() {
     currentConversation,
     messages,
     isConnected,
-    isReconnecting: status.isReconnecting,
-    connectionError: status.lastError,
     isTyping,
     typingUsers,
     isLoadingMessages,

src/app/store/messagingStore.ts

@@ -70,6 +70,13 @@ interface MessagingState {
   removeTypingUser: (userId: string) => void;
   initializeSocket: () => void;
   disconnectSocket: () => void;
+  loadMoreMessages: () => void;
+  setSearchQuery: (query: string) => void;
+  setSelectedFiles: (files: File[]) => void;
+  removeSelectedFile: (index: number) => void;
+  uploadAttachments: (files: File[]) => Promise<Attachment[]>;
+  createConversation: (participantId: string) => Promise<Conversation | null>;
+  getTotalUnreadCount: () => number;
 }
 
 export const useMessagingStore = create<MessagingState>((set, get) => ({
@@ -206,4 +213,70 @@ export const useMessagingStore = create<MessagingState>((set, get) => ({
     wsManager.disconnect('messaging');
     set({ socket: null, isConnected: false });
   },
+
+  loadMoreMessages: () => {
+    const state = get();
+    if (!state.hasMoreMessages || state.isLoadingMessages) return;
+    set({ isLoadingMessages: true, currentPage: state.currentPage + 1 });
+    // Actual pagination logic would fetch messages for currentPage from the server.
+    // Stub: mark loading done after a tick until a real fetch layer exists.
+    setTimeout(() => set({ isLoadingMessages: false }), 0);
+  },
+
+  setSearchQuery: (query) => set({ searchQuery: query }),
+
+  setSelectedFiles: (files) => set({ selectedFiles: files }),
+
+  removeSelectedFile: (index) => {
+    set((state) => ({
+      selectedFiles: state.selectedFiles.filter((_, i) => i !== index),
+    }));
+  },
+
+  uploadAttachments: async (files) => {
+    set({ uploadingFiles: true });
+    try {
+      // Upload each file and build Attachment records.
+      // Real implementation would POST to a media endpoint; this stub creates
+      // local object-URL-based records so the types are fully satisfied.
+      const attachments: Attachment[] = files.map((file) => ({
+        id: `${Date.now()}-${file.name}`,
+        name: file.name,
+        url: URL.createObjectURL(file),
+        type: file.type,
+        size: file.size,
+      }));
+      return attachments;
+    } finally {
+      set({ uploadingFiles: false });
+    }
+  },
+
+  createConversation: async (participantId) => {
+    const existing = get().conversations.find((c) =>
+      c.participants.some((p) => p.id === participantId),
+    );
+    if (existing) {
+      get().setCurrentConversation(existing);
+      return existing;
+    }
+
+    const newConversation: Conversation = {
+      id: `conv-${Date.now()}`,
+      participants: [
+        { id: 'current-user', name: 'You', avatar: '', role: 'student', online: true },
+        { id: participantId, name: participantId, avatar: '', role: 'student', online: false },
+      ],
+      unreadCount: 0,
+      createdAt: new Date(),
+      updatedAt: new Date(),
+    };
+
+    set((state) => ({ conversations: [...state.conversations, newConversation] }));
+    get().setCurrentConversation(newConversation);
+    return newConversation;
+  },
+
+  getTotalUnreadCount: () =>
+    get().conversations.reduce((total, conv) => total + conv.unreadCount, 0),
 }));