Skip to main content

theia AI Access Guide

Verified AI Modules Installation

All theia AI modules are installed and loaded (v1.65.0):

Core AI:

  • @theia/ai-core - AI core functionality
  • @theia/ai-core-ui - AI UI components
  • @theia/ai-ide - Complete AI IDE integration

Chat & Agents:

  • @theia/ai-chat - Chat functionality
  • @theia/ai-chat-ui - Chat interface
  • Custom agents: V5 Code Generator, V5 UI Designer, V5 Code Reviewer

llm Integrations:

  • @theia/ai-openai - OpenAI-compatible API (used for LM Studio)
  • @theia/ai-ollama - Ollama integration
  • @theia/ai-mcp - Model Context Protocol

Features:

  • @theia/ai-code-completion - AI-powered code completion
  • @theia/ai-editor - AI editor features
  • @theia/ai-history - AI conversation history

How to Access AI Features

1. Open AI Chat View

Method 1: Menu

  • Go to ViewAI Chat

Method 2: Keyboard Shortcut

  • Press Ctrl+Alt+A (Linux/Windows) or Cmd+Alt+A (Mac)

Method 3: Command Palette

  • Press Ctrl+Shift+P (Linux/Windows) or Cmd+Shift+P (Mac)
  • Type "AI Chat" and select "AI Chat: Open Chat View"

2. Access AI Chat in Panel

The AI Chat should appear as a tab in the bottom panel alongside:

  • terminal
  • Problems
  • Output
  • Debug Console
  • AI Chat ← Look for this tab

3. Configure AI Settings

  1. Go to File → Preferences → Settings (or press Ctrl+,)
  2. Search for "AI" in the settings search bar
  3. You should see:
    • AI Features → Configuration Selection Settings
      • Selected Agents: v5-code-generator, v5-ui-designer, v5-code-reviewer, Universal
      • Selected Language Model Providers: lmstudio, anthropic
    • AI Features → Open AI Custom
      • API Endpoint: http://localhost:1234/v1
      • Provider ID: lmstudio
      • Provider Name: LM Studio
    • AI Features → MCP
      • Enable Logging: true
      • Log Level: debug

4. Select a Model

In the AI Chat view:

  1. Click the model dropdown at the top
  2. You should see 16+ LM Studio models:
    • QwQ 32B (Reasoning)
    • Llama 3.3 70B
    • DeepSeek Coder V2 236B
    • Qwen2.5 Coder 32B
    • ...and more

5. Select an Agent

In the AI Chat view:

  1. Click the agent dropdown
  2. You should see:
    • V5 Code Generator - TypeScript/React code generation
    • V5 UI Designer - Apple-quality UI design
    • V5 Code Reviewer - Security, performance, quality review
    • Universal - General-purpose agent

Verification Checklist

Run through this checklist in the theia IDE:

  • AI Chat view is accessible via View → AI Chat
  • AI Chat tab appears in bottom panel
  • Model dropdown shows LM Studio models
  • Agent dropdown shows custom V5 agents
  • Settings show AI configuration options
  • Can send a test message to an agent

Troubleshooting

AI Chat View Not Showing

Check 1: Verify modules loaded

# In browser console (F12)
grep -r "@theia/ai" /workspace/PROJECTS/t2/theia-app/lib/

Check 2: Check theia logs

tail -100 /tmp/theia-ai.log | grep -i "ai\|language"

You should see lines like:

Closing channel on service path '/services/mcpservermanager'.
Closing channel on service path '/services/open-ai/language-model-manager'.
Closing channel on service path '/services/ollama/language-model-manager'.
Closing channel on service path '/services/languageModelRegistryDelegatePath'.

Check 3: Hard refresh browser

  • Press Ctrl+Shift+R (Windows/Linux) or Cmd+Shift+R (Mac)
  • Or clear cache and reload

Check 4: Restart theia

pkill -9 -f "theia"
cd /workspace/PROJECTS/t2/theia-app
npm start

LM Studio Models Not Showing

Check 1: LM Studio is running

curl http://localhost:1234/v1/models

Check 2: Settings have correct endpoint

  • Settings → AI Features → Open AI Custom → API Endpoint
  • Should be: http://localhost:1234/v1

Check 3: LM Studio has models loaded

  • Open LM Studio on Windows
  • Go to "Local Server" tab
  • Ensure at least one model is loaded

Custom Agents Not Showing

Check 1: agents.yaml exists

cat /workspace/PROJECTS/t2/.theia/agents.yaml

Check 2: Settings point to agents.yaml

  • Settings → AI Features → Agents → Custom Agents Path
  • Should be: ${workspaceFolder}/.theia/agents.yaml

Check 3: Selected agents in settings

  • Settings → AI Features → Configuration Selection Settings → Selected Agents
  • Should include: v5-code-generator, v5-ui-designer, v5-code-reviewer

MCP Servers Not Working

Check 1: mcp-servers.json exists

cat /workspace/PROJECTS/t2/.theia/mcp-servers.json

Check 2: MCP logging enabled

  • Settings → AI Features → MCP → Enable Logging: true
  • Settings → AI Features → MCP → Log Level: debug

Check 3: Check MCP server logs

# Look for MCP-related logs
tail -100 /tmp/theia-ai.log | grep -i mcp

Testing AI Features

Test 1: Basic Chat

  1. Open AI Chat view
  2. Select "V5 Code Generator" agent
  3. Select "QwQ 32B" model
  4. Type: "Generate a simple React button component"
  5. Press Enter
  6. Should receive TypeScript/React code following V5 design system

Test 2: Code Review

  1. Open a TypeScript file in editor
  2. Select the code
  3. Open AI Chat
  4. Select "V5 Code Reviewer" agent
  5. Type: "Review the selected code"
  6. Should receive security, performance, quality analysis

Test 3: UI Design

  1. Open AI Chat
  2. Select "V5 UI Designer" agent
  3. Type: "Design a login form following Apple design principles"
  4. Should receive component breakdown, layout structure, and implementation guidance

Configuration Files

All AI configuration is in .theia/:

.theia/
├── agents.yaml # Custom agents (YAML format required)
├── mcp-servers.json # MCP server configs (LM Studio, filesystem, git)
├── settings.json # theia settings (models, providers, preferences)
└── prompts/ # Custom prompt templates
├── code-review.prompttemplate
├── generate-component.prompttemplate
└── ui-design.prompttemplate

Ports

Next Steps

  1. Test all three custom agents
  2. Try different LM Studio models
  3. Experiment with custom prompts in .theia/prompts/
  4. Review GCP deployment persistence strategy: docs/06-backend/theia-ai-gcp-persistence.md

Status: ✅ All AI modules installed and configured Version: theia 1.65.0 Custom Agents: 3 (V5 Code Generator, V5 UI Designer, V5 Code Reviewer) llm Providers: 2 (LM Studio, Anthropic Claude) MCP Servers: 4 (LM Studio, filesystem, git, sequential-thinking)