fix: allow mock LLM in different ways

Author: pchalasani

README.md

@@ -118,12 +118,29 @@ async def websocket_endpoint(websocket: WebSocket):
    - `Entity.LLM` and `Entity.ASSISTANT`: Message sender types to filter
    - `ChatDocument`: Message format with content and metadata
    - `DONE` constant: Must be imported from `langroid.utils.constants`
+   - `MockLMConfig`: Allows testing without API keys using pattern-matched responses
 
 3. **WebSocket Considerations**:
    - Need robust session management
    - Must handle reconnections gracefully
    - Async message monitoring is complex with Langroid's sync model
 
+### MockLM Integration
+
+One positive outcome is the successful integration of Langroid's `MockLMConfig`, which allows the application to run without any API keys. The mock responses are pattern-matched based on keywords in the user input:
+
+```python
+MockLMConfig(
+    response_dict={
+        "hello": "Hello! I'm a mock Langroid agent...",
+        "5 + 7|5+7": "5 + 7 equals 12!",
+        "default": "That's interesting! As a mock agent..."
+    }
+)
+```
+
+This makes the project accessible for testing and development without requiring expensive API calls.
+
 ## Proposed Solutions (Not Yet Implemented)
 
 ### 1. Singleton Session Manager
@@ -176,14 +193,100 @@ class EventDrivenAgent(lr.ChatAgent):
 
 ### Setup
 
-1. **Backend**:
+**No API Keys Required!** The application uses Langroid's `MockLMConfig` by default, allowing you to test the chat interface without any API keys.
+
+#### Quick Start (Recommended)
+
+The easiest way to run both frontend and backend together:
+
+```bash
+# From the ui directory
+./run.sh
+```
+
+This script:
+- Starts the backend server on port 8000
+- Starts the frontend development server on port 5173
+- Handles graceful shutdown when you press Ctrl+C
+
+#### Manual Setup (Alternative)
+
+If you prefer to run each component separately or if `run.sh` doesn't work on your system:
+
+1. **Backend** (in one terminal):
    ```bash
    cd backend
    pip install -r requirements.txt
-   export OPENAI_API_KEY="your-key"  # Optional
    python main.py
    ```
 
+2. **Frontend** (in another terminal):
+   ```bash
+   cd frontend
+   npm install
+   npm run dev
+   ```
+
+### Testing the Implementation
+
+Once both servers are running:
+
+1. **Open the UI**: Navigate to http://localhost:5173 in your browser
+2. **Test Basic Connectivity**:
+   - The UI should load without errors
+   - Check browser console for WebSocket connection messages
+   - You should see "Connected to chat server" in the UI
+
+3. **Test Message Flow**:
+   - Type a message like "hello" and press Enter
+   - The backend terminal should show the message was received
+   - Watch for agent response generation in the backend logs
+   - **Current Issue**: Agent responses are generated but don't appear in the UI
+
+4. **Monitor the Backend Console**:
+   - Look for `🤖 Using MockLM` or `🔑 Using OpenAI GPT` to confirm LLM mode
+   - Watch for any error messages or stack traces
+   - Agent responses will be visible in the console even if not in UI
+
+5. **Debug WebSocket Connection**:
+   - Browser DevTools → Network tab → WS filter
+   - Look for the WebSocket connection to `ws://localhost:8000/ws`
+   - Check the Messages tab to see data flow
+
+### Running with MockLM
+
+There are three ways to use the MockLM (no API keys needed):
+
+1. **Default behavior**: Just run without any API keys
+   ```bash
+   python main.py
+   ```
+
+2. **Environment variable**: Force mock mode even with API keys
+   ```bash
+   USE_MOCK_LLM=true python main.py
+   ```
+
+3. **Command line flag**: Use the --mock flag
+   ```bash
+   python main.py --mock
+   ```
+
+The backend will print which mode it's using:
+- `🤖 Using MockLM - no API keys required!`
+- `🔑 Using OpenAI GPT (API key: sk-proj...)`
+
+### Command Line Options
+
+```bash
+python main.py --help
+
+Options:
+  --mock        Force use of MockLM even if API keys are present
+  --port PORT   Port to run the server on (default: 8000)
+  --host HOST   Host to bind the server to (default: 0.0.0.0)
+```
+
 2. **Frontend**:
    ```bash
    cd frontend

backend/.env.example

@@ -1,12 +1,28 @@
-# Copy this file to .env and fill in your values
+# Configuration for Langroid Chat UI Backend
+# Copy this file to .env and optionally add API keys
 
-# Optional: OpenAI API Key
-# If not provided, the chat will use a mock model for local testing
+# ===== MOCK MODE =====
+# Force the use of MockLM even if API keys are present
+# Set to true/1/yes to always use mock responses
+USE_MOCK_LLM=false
+
+# ===== API KEYS (ALL OPTIONAL) =====
+# The application works WITHOUT any API keys using Langroid's MockLM
+# Add keys only if you want to use real LLM responses
+
+# OpenAI API Key (for GPT-3.5/GPT-4)
+# Leave empty to use MockLM for local testing
 OPENAI_API_KEY=
 
-# Optional: Other LLM providers
+# Anthropic API Key (for Claude)
+# Leave empty to use MockLM
 ANTHROPIC_API_KEY=
 
-# Session secret for JWT tokens (generate a random string)
-# You can generate one with: python -c "import secrets; print(secrets.token_urlsafe(32))"
-SESSION_SECRET=your-secret-key-here
+# ===== SERVER CONFIGURATION =====
+# Host and port for the backend server
+HOST=0.0.0.0
+PORT=8000
+
+# CORS allowed origins (comma-separated)
+# Add your frontend URL here for production
+ALLOWED_ORIGINS=http://localhost:5173,http://localhost:5174

backend/main.py

@@ -95,9 +95,34 @@ def __init__(self, session_id: str, websocket: WebSocket):
 
     def _create_agent(self) -> UIChatAgent:
         """Create agent with appropriate LLM config"""
+        # Check if we should force mock mode
+        use_mock = os.getenv("USE_MOCK_LLM", "").lower() in ["true", "1", "yes"]
         openai_key = os.getenv("OPENAI_API_KEY")
 
-        if openai_key:
+        # Use mock if explicitly requested OR if no API key is present
+        if use_mock or not openai_key:
+            print("🤖 Using MockLM - no API keys required!")
+            config = ChatAgentConfig(
+                llm=MockLMConfig(
+                    response_dict={
+                        "hello": "Hello! I'm a mock Langroid agent running locally without any API keys. How can I help you test the chat interface?",
+                        "hi": "Hi there! I'm the mock assistant. Try asking me to calculate something, or ask about the weather!",
+                        "help": "I can help you test the chat UI! Try these:\n- Basic math (e.g., 'What is 5 + 7?')\n- Weather queries\n- General conversation\n- Or just chat about anything!",
+                        "weather": "I'm a mock model, so I can't check real weather, but let's pretend it's sunny with a chance of debugging! ☀️",
+                        "coding": "I love talking about code! This UI is built with React and FastAPI. What would you like to know?",
+                        "math|calculate|what is": "Let me pretend to calculate that for you... The answer is 42! (I'm a mock, so I always give the same answer 😄)",
+                        "5 + 7|5+7": "5 + 7 equals 12! (Even a mock can do simple math sometimes)",
+                        "bye|goodbye": "Goodbye! Thanks for testing the Langroid Chat UI!",
+                        "langroid": "Langroid is an amazing framework for building LLM-powered applications! This chat UI demonstrates how to integrate it with web technologies.",
+                        "test": "Testing, testing, 1-2-3! The WebSocket connection seems to be working well!",
+                        "default": "That's interesting! As a mock agent, I have limited responses, but I'm here to help test the chat interface. What else would you like to try?",
+                    },
+                    default_response="I'm a mock Langroid agent with limited responses. Try asking about math, weather, or just say hello!"
+                ),
+                system_message="You are a mock assistant for testing the Langroid Chat UI without API keys."
+            )
+        else:
+            print(f"🔑 Using OpenAI GPT (API key: {openai_key[:8]}...)")
             config = ChatAgentConfig(
                 llm=OpenAIGPTConfig(
                     chat_model="gpt-4o-mini",
@@ -106,19 +131,6 @@ def _create_agent(self) -> UIChatAgent:
                 system_message="""You are a helpful AI assistant in a chat interface. 
                 Be concise and friendly in your responses. Remember our conversation history."""
             )
-        else:
-            config = ChatAgentConfig(
-                llm=MockLMConfig(
-                    response_dict={
-                        "greeting": "Hello! I'm a mock assistant. I can help you test the chat interface locally without an API key.",
-                        "help": "I can respond to basic queries. Try asking me about the weather, coding, or just say hello!",
-                        "weather": "I'm a mock model, so I can't check real weather, but let's pretend it's sunny with a chance of debugging! ☀️",
-                        "coding": "I love talking about code! What programming language are you working with?",
-                        "default": "That's interesting! Tell me more about what you're working on.",
-                    }
-                ),
-                system_message="You are a mock assistant for testing the chat UI."
-            )
 
         # Return our custom agent with queue-based input
         return UIChatAgent(config, self.input_queue, lambda: self.running)
@@ -287,15 +299,29 @@ async def websocket_endpoint(websocket: WebSocket):
 
 
 if __name__ == "__main__":
+    import argparse
+    
+    # Parse command line arguments
+    parser = argparse.ArgumentParser(description="Langroid Chat UI Backend")
+    parser.add_argument("--mock", action="store_true", help="Force use of MockLM even if API keys are present")
+    parser.add_argument("--port", type=int, default=8000, help="Port to run the server on (default: 8000)")
+    parser.add_argument("--host", default="0.0.0.0", help="Host to bind the server to (default: 0.0.0.0)")
+    args = parser.parse_args()
+    
     # Load environment variables
     from dotenv import load_dotenv
     load_dotenv()
 
+    # Override USE_MOCK_LLM if --mock flag is used
+    if args.mock:
+        os.environ["USE_MOCK_LLM"] = "true"
+        print("🎭 Mock mode enabled via CLI flag")
+    
     # Run the server
     uvicorn.run(
         "main:app",
-        host="0.0.0.0",
-        port=8000,
+        host=args.host,
+        port=args.port,
         reload=True,
         ws_ping_interval=30,
         ws_ping_timeout=30,