# Tidewave AI MCP Setup

Tidewave is an AI assistant that understands your Phoenix application through the Model Context Protocol (MCP).

## Installation ✅

1. **Dependency**: Already added to `mix.exs` as a dev-only dependency:
   ```elixir
   {:tidewave, "~> 0.2", only: :dev}
   ```

2. **Phoenix Integration**: Added to `lib/da_product_app_web/endpoint.ex` above the code reloading block:
   ```elixir
   if Code.ensure_loaded?(Tidewave) do
     plug Tidewave, 
       allow_remote_access: true,
       allowed_origins: [
         "http://demo.ctrmv.com:4040",
         "http://localhost:4040",
         "http://127.0.0.1:4040"
       ]
   end
   ```

## Usage

1. **Start your Phoenix application**:
   ```bash
   mix phx.server
   ```

2. **Access Tidewave**: 
   - **Web Interface**: http://localhost:4040/tidewave
   - **MCP Endpoint**: http://localhost:4040/tidewave/mcp

## Verification Steps

### 1. Check if Tidewave is Running
```bash
curl -X POST -H "Content-Type: application/json" \
  -d '{"jsonrpc": "2.0", "method": "initialize", "id": 1, "params": {"protocolVersion": "2024-11-05", "capabilities": {"roots": {"listChanged": true}}, "clientInfo": {"name": "test-client", "version": "1.0.0"}}}' \
  http://localhost:4040/tidewave/mcp
```

If successful, you should get a JSON response with initialization details.

### 2. Access Web Interface
Open your browser to: http://localhost:4040/tidewave

### 3. Test VS Code Integration
The VS Code settings have been configured in `.vscode/settings.json`. Restart VS Code to ensure MCP integration is active.

## VS Code Configuration ✅

The VS Code settings have been configured in `.vscode/settings.json` to connect to the Tidewave MCP server on the correct port (4040).

## Claude Desktop Configuration

If you're using Claude Desktop, you can use the `mcp-config.json` file to configure the MCP connection:

1. Copy the contents of `mcp-config.json` to your Claude Desktop configuration
2. Restart Claude Desktop
3. The Tidewave MCP server will be available when your Phoenix app is running

## Features

Tidewave provides:
- Understanding of your Phoenix application structure
- Access to your routes, controllers, and views
- Database schema information
- Live code inspection and modification capabilities
- Context-aware assistance based on your actual running application

## Configuration Details

Your current Tidewave configuration:
- **Port**: 4040 (matching your Phoenix application)
- **Remote Access**: Enabled for development
- **Allowed Origins**: 
  - http://demo.ctrmv.com:4040
  - http://localhost:4040
  - http://127.0.0.1:4040

## Troubleshooting

- ✅ **Phoenix Server**: Running on localhost:4040
- ✅ **Tidewave MCP**: Accessible at http://localhost:4040/tidewave/mcp
- ✅ **Remote Access**: Configured for your environment
- ✅ **VS Code Settings**: Configured for port 4040

### Common Issues:
1. **Permission denied**: Fixed by updating build directory permissions
2. **Remote connection blocked**: Fixed by adding allowed origins
3. **Wrong port**: Updated all configurations to use port 4040

## Next Steps

1. **VS Code**: Restart VS Code to ensure MCP integration is active
2. **Test Integration**: Use Copilot or other MCP-compatible tools
3. **Explore**: Visit http://localhost:4040/tidewave to explore the web interface

For more information, visit: https://github.com/tidewave-ai/tidewave_phoenix