File size: 4,435 Bytes
6a7089a | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 205 206 207 208 209 210 211 212 213 214 215 216 217 218 219 220 221 222 223 224 225 226 | # Dashboard
PinchTab includes a built-in web dashboard for monitoring instances, managing profiles, and editing configuration.
The dashboard is part of the full server:
- `pinchtab` or `pinchtab server` starts the full server and serves the dashboard
- `pinchtab bridge` does not serve the dashboard
You can open the dashboard at:
- `http://localhost:9867`
- `http://localhost:9867/dashboard`
---
## Dashboard overview
The current dashboard exposes three main pages:
1. **Monitoring**
2. **Profiles**
3. **Settings**
The UI is a React SPA served by the Go server.
---
## Monitoring page
The Monitoring page is the default view.
It shows:
- running and stopped instances
- selected-instance details
- open tabs for the selected instance
- charted monitoring data
- optional memory metrics when enabled in settings
What you can do:
- select an instance
- inspect its port, mode, and status
- view its open tabs
- stop a running instance
Operational data comes from:
- SSE updates on `GET /api/events`
- instance lists from `GET /instances`
- tab data from `GET /instances/{id}/tabs`
- optional memory data from `GET /instances/metrics`
---
## Profiles page
The Profiles page manages saved browser profiles.
It shows:
- available profiles
- launch and stop actions
- profile metadata such as name, path, size, source, and account details
What you can do:
- create a new profile
- launch a profile as a managed instance
- stop the running instance for a profile
- edit profile metadata
- delete a profile
- open a profile details modal
The launch flow uses the server APIs behind the scenes:
```bash
curl -X POST http://localhost:9867/profiles \
-H "Content-Type: application/json" \
-d '{"name":"work","useWhen":"Team account workflows"}'
# Response
{
"status": "created",
"id": "prof_278be873",
"name": "work"
}
```
```bash
curl -X POST http://localhost:9867/instances/start \
-H "Content-Type: application/json" \
-d '{"profileId":"prof_278be873","mode":"headed"}'
# CLI Alternative
pinchtab instance start --profileId prof_278be873 --mode headed
# Response
{
"id": "inst_ea2e747f",
"profileId": "prof_278be873",
"profileName": "work",
"port": "9868",
"headless": false,
"status": "starting"
}
```
---
## Profile details modal
Profile details are shown in a modal, not as a separate top-level page.
The modal currently includes tabs for:
- **Profile**
- **Live**
- **Logs**
From there you can:
- view the profile ID and metadata
- edit name and `useWhen`
- inspect live tabs for a running instance
- open a screencast tile for tab previews
---
## Settings page
The Settings page combines local dashboard preferences with backend configuration.
It includes sections for:
- Dashboard
- Instance Defaults
- Orchestration
- Security
- Profiles
- Network & Attach
- Browser Runtime
- Timeouts
What you can do:
- change local dashboard preferences such as monitoring and screencast settings
- load backend config from `GET /api/config`
- save backend config through `PUT /api/config`
- see whether a restart is required for server-level changes
The health payload also surfaces summary info:
```bash
curl http://localhost:9867/health | jq .
# Response
{
"status": "ok",
"mode": "dashboard",
"profiles": 3,
"instances": 1,
"agents": 0,
"restartRequired": false
}
```
---
## Event stream
The dashboard uses Server-Sent Events, not WebSockets.
Primary stream endpoint:
```bash
curl http://localhost:9867/api/events
```
This stream carries:
- `init`
- `action`
- `system`
- `monitoring`
---
## Build note
If the React dashboard assets are not built into the binary, the server serves a fallback page telling you to build the dashboard bundle.
---
## Troubleshooting
### Dashboard not loading
```bash
curl http://localhost:9867/health
```
If the server is up, try:
- `http://localhost:9867`
- `http://localhost:9867/dashboard`
### No instances visible
Start one:
```bash
curl -X POST http://localhost:9867/instances/start \
-H "Content-Type: application/json" \
-d '{"mode":"headless"}'
# CLI Alternative
pinchtab instance start
```
### No live profile preview
The profile must have a running instance before the Live tab in the profile details modal can show live tab data.
|