# Debug Network Error in Chat Assistant

## Issue
Frontend shows "Network error. Please check your connection." but backend logs show 200 OK.

## Root Cause Analysis

The backend is successfully processing requests (200 OK), but the frontend axios client is reporting a network error. This typically means:

1. **CORS Issue**: Response is blocked by browser CORS policy
2. **Response Format**: Response doesn't match expected format
3. **Timeout**: Request takes too long (>30s)
4. **Network Path**: Browser can't reach the backend URL

## Debugging Steps

### 1. Check Browser Console
Open browser DevTools (F12) and check:
- Console tab for error messages
- Network tab to see the actual request/response
- Look for CORS errors (red text)

### 2. Check API URL
The frontend should use:
- **Local development**: `http://localhost:4402`
- **Docker**: Should still use `http://localhost:4402` (browser makes request from host)

### 3. Test API Directly
```bash
# Test from your machine (not Docker)
curl -X POST http://localhost:4402/api/v1/chat \
  -H "Content-Type: application/json" \
  -d '{"message": "Hello"}'
```

### 4. Check CORS Headers
The backend should return CORS headers. Check in browser Network tab:
- `Access-Control-Allow-Origin: *`
- `Access-Control-Allow-Methods: *`
- `Access-Control-Allow-Headers: *`

### 5. Check Response Format
The backend returns:
```json
{
  "message": "AI response text",
  "model": "gemma3:270M",
  "tokens_used": 150
}
```

The frontend expects this format in `ChatResponse`.

## Quick Fixes

### Fix 1: Verify API URL
Check what URL the frontend is using:
1. Open browser console
2. Look for: `API Client initialized with baseURL: ...`
3. Should be: `http://localhost:4402`

### Fix 2: Check CORS
Backend has `allow_origins=["*"]` which should work, but verify:
1. Check browser Network tab
2. Look for OPTIONS preflight request
3. Should return 200 OK

### Fix 3: Test with curl
```bash
curl -v -X POST http://localhost:4402/api/v1/chat \
  -H "Content-Type: application/json" \
  -H "Origin: http://localhost:8081" \
  -d '{"message": "test"}'
```

### Fix 4: Check Response Time
The backend log shows 6.3 seconds. If axios timeout is shorter, it will fail. Current timeout is 30s, so should be fine.

## Expected Behavior

1. Browser makes POST to `http://localhost:4402/api/v1/chat`
2. Backend processes request (6-7 seconds for Ollama)
3. Backend returns 200 OK with JSON response
4. Frontend receives response and displays it

## Current Status

✅ Backend: Working (200 OK)
❌ Frontend: Network error
🔍 Need to check: Browser console, Network tab, CORS headers

## Next Steps

1. Open browser DevTools
2. Go to Network tab
3. Make a chat request
4. Check the request details:
   - URL
   - Status code
   - Response headers
   - Response body
5. Check Console tab for errors