Added the no conv thing

Author: Rehan959

LocalMind-Backend/src/chats/ChatList.jsx

@@ -2,7 +2,7 @@ import React, { useEffect, useRef } from 'react';
 import ChatMessage from './ChatMessage';
 import TypingIndicator from './TypingIndicator';
 
-export default function ChatList({ messages = [], isTyping = false, onStartNewChat }) {
+export default function ChatList({ messages = [], isTyping = false }) {
   const containerRef = useRef(null);
 
   useEffect(() => {
@@ -12,29 +12,19 @@ export default function ChatList({ messages = [], isTyping = false, onStartNewCh
     container.scrollTo({ top: container.scrollHeight, behavior: 'smooth' });
   }, [messages, isTyping]);
 
-  // Show empty state when no messages exist
-  if (messages.length === 0) {
-    return (
-      <main className="flex-1 flex flex-col items-center justify-center px-4 py-6">
-        <div className="text-center max-w-xs">
-          <p className="text-gray-500 mb-4">No chats yet. Start a new conversation!</p>
-          {onStartNewChat && (
-            <button
-              onClick={onStartNewChat}
-              className="px-4 py-2 bg-blue-500 text-white rounded-md hover:bg-blue-600 transition-colors"
-            >
-              New Chat
-            </button>
-          )}
-        </div>
-      </main>
-    );
-  }
-
   return (
     <main ref={containerRef} className="flex-1 overflow-y-auto px-4 py-6 space-y-4 scroll-smooth">
       <div className="flex flex-col gap-4">
-        {messages.map((m) => <ChatMessage key={m.id} message={m} />)}
+        {messages.length === 0 ? (
+          <div className="text-center text-gray-500 dark:text-gray-400">
+            <p>No messages yet.</p>
+            <p>Start a conversation with your friends.</p>
+          </div>
+        ) : (
+          messages.map((message, index) => (
+            <ChatMessage key={index} message={message} />
+          ))
+        )}
         {isTyping && (
           <div className="flex justify-start">
             <TypingIndicator />
@@ -43,4 +33,4 @@ export default function ChatList({ messages = [], isTyping = false, onStartNewCh
       </div>
     </main>
   );
-}
+}