add DashboardMessages component for real-time chat functionality

components/dashboard/DashboardMessages.tsx

@@ -53,16 +53,33 @@ const DashboardMessages = ({ onMessagesRead, initialConversationId }: DashboardM
     const [isMobileListVisible, setIsMobileListVisible] = useState(true);
     const [showArchived, setShowArchived] = useState(false);
     const messagesEndRef = useRef<HTMLDivElement>(null);
+    const initialSelectionDone = useRef(false);
 
     useEffect(() => {
-        fetchConversations();
-    }, []);
+        if (user?.id) {
+            fetchConversations();
 
-    useEffect(() => {
-        if (selectedConversation) {
-            fetchMessages(selectedConversation.id);
+            // Polling automatique de la liste des conversations toutes les 5 secondes
+            const interval = setInterval(() => {
+                fetchConversations();
+            }, 5000);
+
+            return () => clearInterval(interval);
         }
-    }, [selectedConversation]);
+    }, [user?.id]);
+
+    useEffect(() => {
+        if (selectedConversation?.id) {
+            fetchMessages(selectedConversation.id);
+
+            // Polling des messages toutes les 2.5 secondes pour une messagerie instantanée fluide
+            const interval = setInterval(() => {
+                fetchMessages(selectedConversation.id);
+            }, 2500);
+
+            return () => clearInterval(interval);
+        }
+    }, [selectedConversation?.id]);
 
     useEffect(() => {
         scrollToBottom();
@@ -81,12 +98,13 @@ const DashboardMessages = ({ onMessagesRead, initialConversationId }: DashboardM
             if (!data.error) {
                 setConversations(data);
                 
-                // Handle initial auto-selection
-                if (initialConversationId) {
+                // Handle initial auto-selection une seule fois
+                if (initialConversationId && !initialSelectionDone.current) {
                     const found = data.find((c: Conversation) => c.id === initialConversationId);
                     if (found) {
                         setSelectedConversation(found);
                         setIsMobileListVisible(false);
+                        initialSelectionDone.current = true;
                     }
                 }
             }
@@ -104,10 +122,18 @@ const DashboardMessages = ({ onMessagesRead, initialConversationId }: DashboardM
             });
             const data = await res.json();
             if (!data.error) {
-                setMessages(data);
-                // After fetching messages (which marks them as read in the backend),
-                // notify the parent to refresh the unread count badge
-                if (onMessagesRead) onMessagesRead();
+                setMessages(prev => {
+                    const hasChanged = prev.length !== data.length || 
+                        (prev.length > 0 && data.length > 0 && prev[prev.length - 1].id !== data[data.length - 1].id);
+
+                    if (hasChanged) {
+                        setTimeout(() => {
+                            if (onMessagesRead) onMessagesRead();
+                        }, 0);
+                        return data;
+                    }
+                    return prev;
+                });
             }
         } catch (error) {
             console.error('Error fetching messages:', error);