62 lines
1.4 KiB
Markdown
62 lines
1.4 KiB
Markdown
|
# Admin UI
|
||
|
|
|
||
|
|
A web-based dashboard for monitoring the MCP Hub in real-time.
|
||
|
|
|
||
|
|
## Setup
|
||
|
|
|
||
|
|
### 1. Get Your OBSERVE_SECRET
|
||
|
|
|
||
|
|
The `OBSERVE_SECRET` is stored in `/workspace/.env` on the hub server. Extract it:
|
||
|
|
|
||
|
|
```bash
|
||
|
|
# On the hub server:
|
||
|
|
grep OBSERVE_SECRET /workspace/.env
|
||
|
|
```
|
||
|
|
|
||
|
|
Copy the secret value (it's a long hex string).
|
||
|
|
|
||
|
|
### 2. Open the UI
|
||
|
|
|
||
|
|
#### Option A: Via https (production)
|
||
|
|
```
|
||
|
|
https://mcp.arik.work/admin-ui/
|
||
|
|
```
|
||
|
|
|
||
|
|
#### Option B: Local development with file:// (offline)
|
||
|
|
```bash
|
||
|
|
# Simply open the file in your browser:
|
||
|
|
file:///workspace/admin-ui/index.html
|
||
|
|
```
|
||
|
|
|
||
|
|
#### Option C: Local development with HTTP server
|
||
|
|
```bash
|
||
|
|
cd /workspace/admin-ui
|
||
|
|
python3 -m http.server 8080
|
||
|
|
# Then open http://localhost:8080
|
||
|
|
```
|
||
|
|
|
||
|
|
### 3. Connect to the Hub
|
||
|
|
|
||
|
|
In the UI, enter:
|
||
|
|
- **Hub URL**: `wss://mcp.arik.work/ws/observe` (production) or `ws://localhost:3000/ws/observe` (local dev)
|
||
|
|
- **OBSERVE_SECRET**: Paste the value from step 1
|
||
|
|
|
||
|
|
The status light will turn **green** when connected.
|
||
|
|
|
||
|
|
### 4. Monitor
|
||
|
|
|
||
|
|
- **Backends**: View connected MCP backends
|
||
|
|
- **Logs**: Real-time event stream from the hub
|
||
|
|
- **Status**: Connection indicator at the top
|
||
|
|
|
||
|
|
## Adding More Backends
|
||
|
|
|
||
|
|
To connect additional backends to the hub, edit `/workspace/.env` on the hub server:
|
||
|
|
|
||
|
|
```env
|
||
|
|
OBSERVE_SECRET=...
|
||
|
|
# Add new backends via environment config or the hub's register endpoint
|
||
|
|
```
|
||
|
|
|
||
|
|
Then restart the hub to pick up new backends.
|