@agenticmail/enterprise 0.5.237 → 0.5.239

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (33) hide show
  1. package/dist/agent-heartbeat-FF6ASUZ4.js +510 -0
  2. package/dist/agent-heartbeat-QTYUXYH3.js +510 -0
  3. package/dist/agent-tools-X4H3KDRM.js +13855 -0
  4. package/dist/chunk-D5CKFCEL.js +2594 -0
  5. package/dist/chunk-DD36VGKL.js +3778 -0
  6. package/dist/chunk-FORLAPWB.js +4463 -0
  7. package/dist/chunk-J3J5XEWS.js +4463 -0
  8. package/dist/chunk-MCQ2Q4SC.js +3778 -0
  9. package/dist/chunk-T4DN77PH.js +1224 -0
  10. package/dist/chunk-TCQTHG7L.js +1224 -0
  11. package/dist/cli-agent-G4FLS4M5.js +1721 -0
  12. package/dist/cli-agent-HDEPHBZX.js +1721 -0
  13. package/dist/cli-serve-CO5UAKD2.js +114 -0
  14. package/dist/cli-serve-OHDYAC3L.js +114 -0
  15. package/dist/cli.js +3 -3
  16. package/dist/dashboard/docs/browser-providers.html +302 -0
  17. package/dist/dashboard/pages/agent-detail/meeting-browser.js +36 -23
  18. package/dist/index.js +3 -3
  19. package/dist/meetings-RR72OBSV.js +12 -0
  20. package/dist/routes-4YJNJJSS.js +13245 -0
  21. package/dist/routes-QU3MYXUG.js +13063 -0
  22. package/dist/runtime-2AQSHJKC.js +45 -0
  23. package/dist/runtime-A7DA7F74.js +45 -0
  24. package/dist/server-IQME5P6B.js +15 -0
  25. package/dist/server-VXVRSEFL.js +15 -0
  26. package/dist/setup-AEBSFYUE.js +20 -0
  27. package/dist/setup-OBCJB3R6.js +20 -0
  28. package/package.json +2 -2
  29. package/src/agent-tools/tools/browser.ts +375 -1
  30. package/src/dashboard/docs/browser-providers.html +302 -0
  31. package/src/dashboard/pages/agent-detail/meeting-browser.js +36 -23
  32. package/src/engine/agent-routes.ts +200 -13
  33. package/src/server.ts +12 -0
package/src/dashboard/docs/browser-providers.html ADDED
@@ -0,0 +1,302 @@
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Browser Provider Setup Guide — AgenticMail Enterprise</title>
7
+ <style>
8
+ /* ── Inherit from the main dashboard theme via CSS custom properties ── */
9
+ :root {
10
+ --bg-primary: #0f172a; --bg-secondary: #1e293b; --bg-tertiary: #334155;
11
+ --text-primary: #e2e8f0; --text-secondary: #cbd5e1; --text-muted: #94a3b8;
12
+ --accent: #3b82f6; --accent-soft: rgba(59,130,246,0.12);
13
+ --border: #334155; --radius: 10px;
14
+ --success: #15803d; --warning: #f59e0b; --danger: #ef4444;
15
+ --info-soft: rgba(59,130,246,0.08);
16
+ }
17
+ /* Light theme (warm golden — matches dashboard) */
18
+ [data-theme="light"] {
19
+ --bg-primary: #d0c5a0; --bg-secondary: #ddd3b2; --bg-tertiary: #c8bc94;
20
+ --text-primary: #2c2410; --text-secondary: #3d3520; --text-muted: #6b5e42;
21
+ --accent: #2563eb; --accent-soft: rgba(37,99,235,0.1);
22
+ --border: #b8ad8a; --info-soft: rgba(37,99,235,0.06);
23
+ }
24
+ * { box-sizing: border-box; margin: 0; padding: 0; }
25
+ body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; background: var(--bg-primary); color: var(--text-primary); line-height: 1.7; padding: 32px; max-width: 900px; margin: 0 auto; }
26
+ h1 { font-size: 28px; margin-bottom: 8px; }
27
+ h2 { font-size: 20px; margin: 32px 0 12px; padding-bottom: 8px; border-bottom: 1px solid var(--border); }
28
+ h3 { font-size: 16px; margin: 20px 0 8px; color: var(--accent); }
29
+ p { margin-bottom: 12px; color: var(--text-secondary); }
30
+ code { background: var(--bg-primary); border: 1px solid var(--border); padding: 2px 6px; border-radius: 4px; font-size: 13px; color: var(--accent); }
31
+ pre { background: var(--bg-primary); border: 1px solid var(--border); padding: 16px; border-radius: var(--radius); overflow-x: auto; margin: 12px 0; font-size: 13px; line-height: 1.5; color: var(--text-secondary); }
32
+ pre code { background: none; border: none; padding: 0; }
33
+ .card { background: var(--bg-secondary); border: 1px solid var(--border); border-radius: var(--radius); padding: 20px; margin: 16px 0; }
34
+ .tip { background: var(--info-soft); border: 1px solid rgba(59,130,246,0.3); padding: 12px 16px; border-radius: var(--radius); margin: 12px 0; font-size: 13px; color: var(--text-secondary); }
35
+ .warning { background: rgba(245,158,11,0.08); border: 1px solid rgba(245,158,11,0.3); padding: 12px 16px; border-radius: var(--radius); margin: 12px 0; font-size: 13px; color: var(--text-secondary); }
36
+ .danger { background: rgba(239,68,68,0.08); border: 1px solid rgba(239,68,68,0.3); padding: 12px 16px; border-radius: var(--radius); margin: 12px 0; font-size: 13px; color: var(--text-secondary); }
37
+ table { width: 100%; border-collapse: collapse; margin: 12px 0; font-size: 13px; }
38
+ th, td { text-align: left; padding: 8px 12px; border: 1px solid var(--border); color: var(--text-secondary); }
39
+ th { background: var(--bg-secondary); font-weight: 600; color: var(--text-primary); }
40
+ ul, ol { padding-left: 24px; margin-bottom: 12px; color: var(--text-secondary); }
41
+ li { margin-bottom: 6px; }
42
+ .badge { display: inline-block; padding: 2px 8px; border-radius: 4px; font-size: 11px; font-weight: 600; }
43
+ .badge-easy { background: rgba(21,128,61,0.2); color: var(--success); }
44
+ .badge-medium { background: rgba(245,158,11,0.2); color: var(--warning); }
45
+ .badge-advanced { background: rgba(239,68,68,0.2); color: var(--danger); }
46
+ a { color: var(--accent); }
47
+ .back { display: inline-block; margin-bottom: 20px; font-size: 13px; color: var(--text-muted); text-decoration: none; }
48
+ .back:hover { color: var(--text-primary); }
49
+ strong { color: var(--text-primary); }
50
+ </style>
51
+ <script>
52
+ // Sync theme with dashboard preference
53
+ (function() {
54
+ var saved = localStorage.getItem('em-theme');
55
+ if (saved === 'light') document.documentElement.setAttribute('data-theme', 'light');
56
+ else if (saved === 'dark') document.documentElement.setAttribute('data-theme', 'dark');
57
+ else if (window.matchMedia && window.matchMedia('(prefers-color-scheme: light)').matches) {
58
+ document.documentElement.setAttribute('data-theme', 'light');
59
+ }
60
+ })();
61
+ </script>
62
+ </head>
63
+ <body>
64
+
65
+ <a class="back" href="/dashboard/agents">&#8592; Back to Dashboard</a>
66
+
67
+ <h1>Browser Provider Setup Guide</h1>
68
+ <p style="color: var(--text-muted); margin-bottom: 24px;">Complete reference for connecting your AI agents to browsers — local, remote, or cloud-hosted.</p>
69
+
70
+ <div class="card">
71
+ <h3 style="margin-top: 0;">Quick Comparison</h3>
72
+ <table>
73
+ <tr><th>Provider</th><th>Best For</th><th>Video Calls</th><th>Difficulty</th><th>Cost</th></tr>
74
+ <tr><td><strong>Local Chromium</strong></td><td>Web scraping, form filling, screenshots</td><td>No (headless) / Yes (headed + display)</td><td><span class="badge badge-easy">Easy</span></td><td>Free</td></tr>
75
+ <tr><td><strong>Remote CDP</strong></td><td>Video calls, persistent sessions, full control</td><td>Yes</td><td><span class="badge badge-medium">Medium</span></td><td>VM cost only</td></tr>
76
+ <tr><td><strong>Browserless.io</strong></td><td>Scalable scraping, stealth, managed infra</td><td>No</td><td><span class="badge badge-easy">Easy</span></td><td>Free tier available</td></tr>
77
+ <tr><td><strong>Browserbase</strong></td><td>AI automation, session replay, anti-detection</td><td>No</td><td><span class="badge badge-easy">Easy</span></td><td>Free tier available</td></tr>
78
+ <tr><td><strong>Steel.dev</strong></td><td>Self-hostable, AI-native, open-source</td><td>No</td><td><span class="badge badge-medium">Medium</span></td><td>Free (self-hosted)</td></tr>
79
+ <tr><td><strong>ScrapingBee</strong></td><td>Proxy rotation, CAPTCHA solving</td><td>No</td><td><span class="badge badge-easy">Easy</span></td><td>Free tier available</td></tr>
80
+ </table>
81
+ </div>
82
+
83
+ <h2 id="local">1. Local Chromium (Default)</h2>
84
+ <p>The simplest option. A headless Chromium browser runs on the same machine as AgenticMail. No external services needed.</p>
85
+ <h3>When to use</h3>
86
+ <ul>
87
+ <li>Web scraping and data extraction</li>
88
+ <li>Taking screenshots of web pages</li>
89
+ <li>Filling out forms and automating websites</li>
90
+ <li>Any task that doesn't need camera, microphone, or visible display</li>
91
+ </ul>
92
+ <h3>Setup</h3>
93
+ <p>No setup needed — it's the default. Chromium is auto-detected (Google Chrome, system Chromium, or Playwright's bundled Chromium). If none found, we install Playwright Chromium automatically on first launch.</p>
94
+ <div class="tip"><strong>Headed mode:</strong> If your server has a display (desktop machine, not headless server), switch to "Headed" in the dashboard to see the browser window. Useful for debugging.</div>
95
+ <h3>Troubleshooting</h3>
96
+ <table>
97
+ <tr><th>Issue</th><th>Solution</th></tr>
98
+ <tr><td>Chromium not found</td><td>We auto-install on first use. If it fails, check disk space (~300MB needed).</td></tr>
99
+ <tr><td>Missing dependencies on Linux</td><td><code>apt-get install -y libnss3 libatk1.0-0 libatk-bridge2.0-0 libdrm2 libxcomposite1 libxdamage1 libxrandr2 libgbm1 libpango-1.0-0 libasound2</code></td></tr>
100
+ <tr><td>"Display not available" in headed mode</td><td>Headed mode requires X11/Wayland. Use headless on servers, or install Xvfb: <code>apt-get install xvfb && Xvfb :99 &</code></td></tr>
101
+ <tr><td>Timeout on navigation</td><td>Increase timeout in browser settings. Some sites need longer with JS rendering.</td></tr>
102
+ </table>
103
+
104
+ <h2 id="remote-cdp">2. Remote Browser (CDP)</h2>
105
+ <p>Connect to a Chrome browser running on another machine. The agent controls it remotely via Chrome DevTools Protocol. This is the <strong>only option that supports video calls</strong> (Google Meet, Teams, Zoom) because it can access a real camera, microphone, and display.</p>
106
+ <h3>When to use</h3>
107
+ <ul>
108
+ <li>Video calls and meetings (Google Meet, Microsoft Teams, Zoom)</li>
109
+ <li>Persistent browser sessions (stay logged in across restarts)</li>
110
+ <li>When you need a real display, camera, or microphone</li>
111
+ <li>Agent on headless server but needs browser GUI</li>
112
+ </ul>
113
+ <h3>What you need</h3>
114
+ <ol>
115
+ <li>A machine with Google Chrome installed (any OS)</li>
116
+ <li>Chrome launched with remote debugging enabled</li>
117
+ <li>Network access between your AgenticMail server and that machine</li>
118
+ </ol>
119
+
120
+ <h3>Setup: macOS</h3>
121
+ <div class="card">
122
+ <p><strong>Step 1:</strong> Open Terminal on the Mac where Chrome should run.</p>
123
+ <p><strong>Step 2:</strong> Launch Chrome with remote debugging:</p>
124
+ <pre><code>/Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome \
125
+ --remote-debugging-port=9222 \
126
+ --remote-debugging-address=0.0.0.0 \
127
+ --user-data-dir=/tmp/chrome-remote \
128
+ --no-first-run</code></pre>
129
+ <p><strong>Step 3:</strong> In AgenticMail dashboard, enter: <code>192.168.x.x:9222</code> (the Mac's IP)</p>
130
+ <p><strong>Step 4:</strong> Click "Test Connection" — you should see the Chrome version.</p>
131
+ </div>
132
+ <div class="tip"><strong>Run at startup:</strong> Add the command to Login Items in System Settings, or create a Launch Agent plist at <code>~/Library/LaunchAgents/com.chrome.remote.plist</code>.</div>
133
+
134
+ <h3>Setup: Linux (Ubuntu/Debian)</h3>
135
+ <div class="card">
136
+ <p><strong>Step 1:</strong> Install Chrome:</p>
137
+ <pre><code>wget -q -O - https://dl.google.com/linux/linux_signing_key.pub | sudo gpg --dearmor -o /usr/share/keyrings/google-chrome.gpg
138
+ echo "deb [arch=amd64 signed-by=/usr/share/keyrings/google-chrome.gpg] http://dl.google.com/linux/chrome/deb/ stable main" | sudo tee /etc/apt/sources.list.d/google-chrome.list
139
+ sudo apt-get update && sudo apt-get install -y google-chrome-stable</code></pre>
140
+ <p><strong>Step 2:</strong> For headless servers (no display), install virtual display:</p>
141
+ <pre><code>sudo apt-get install -y xvfb pulseaudio
142
+ Xvfb :99 -screen 0 1920x1080x24 &
143
+ export DISPLAY=:99
144
+ pulseaudio --start</code></pre>
145
+ <p><strong>Step 3:</strong> Launch Chrome:</p>
146
+ <pre><code>google-chrome-stable \
147
+ --remote-debugging-port=9222 \
148
+ --remote-debugging-address=0.0.0.0 \
149
+ --no-sandbox --disable-gpu \
150
+ --user-data-dir=/tmp/chrome-remote \
151
+ --no-first-run &</code></pre>
152
+ <p><strong>Step 4:</strong> Enter <code>your-server-ip:9222</code> in the dashboard.</p>
153
+ </div>
154
+ <div class="tip"><strong>For video calls on Linux:</strong> Virtual camera: <code>sudo apt install v4l2loopback-dkms</code>. Virtual audio: PulseAudio virtual sinks.</div>
155
+
156
+ <h3>Setup: Windows</h3>
157
+ <div class="card">
158
+ <p><strong>Step 1:</strong> Open PowerShell:</p>
159
+ <pre><code>& "C:\Program Files\Google\Chrome\Application\chrome.exe" `
160
+ --remote-debugging-port=9222 `
161
+ --remote-debugging-address=0.0.0.0 `
162
+ --user-data-dir="$env:TEMP\chrome-remote" `
163
+ --no-first-run</code></pre>
164
+ <p><strong>Step 2:</strong> Allow Chrome through Windows Firewall when prompted.</p>
165
+ <p><strong>Step 3:</strong> Enter the Windows machine's IP:9222 in the dashboard.</p>
166
+ </div>
167
+
168
+ <h3>Setup: Cloud VMs</h3>
169
+ <div class="card">
170
+ <table>
171
+ <tr><th>Provider</th><th>Recommended</th><th>Notes</th></tr>
172
+ <tr><td>AWS</td><td>EC2 Ubuntu Desktop / WorkSpaces</td><td>t3.medium+. Open port 9222 in security group (restrict to your AgenticMail IP).</td></tr>
173
+ <tr><td>Azure</td><td>Virtual Desktop or VM</td><td>B2s+. Open port 9222 in NSG.</td></tr>
174
+ <tr><td>Google Cloud</td><td>Compute Engine with Desktop</td><td>e2-medium+. Open port 9222 in firewall.</td></tr>
175
+ <tr><td>Hetzner</td><td>Cloud Server with Ubuntu Desktop</td><td>Cost-effective (~&#8364;4/mo). Open port 9222.</td></tr>
176
+ <tr><td>DigitalOcean</td><td>Droplet with Desktop</td><td>2GB+ RAM. Open port 9222.</td></tr>
177
+ </table>
178
+ <p style="margin-top: 8px;">Follow the Linux setup above, then configure firewall to only allow your AgenticMail server's IP.</p>
179
+ </div>
180
+
181
+ <h3>Securing the Connection</h3>
182
+ <div class="warning"><strong>Security:</strong> Chrome's debug port has NO authentication by default. Anyone who reaches port 9222 has full browser control. Always restrict access.</div>
183
+ <p><strong>Option A: Firewall (simplest)</strong></p>
184
+ <pre><code># Linux (ufw)
185
+ sudo ufw allow from YOUR_AGENTICMAIL_IP to any port 9222
186
+
187
+ # Linux (iptables)
188
+ sudo iptables -A INPUT -p tcp --dport 9222 -s YOUR_AGENTICMAIL_IP -j ACCEPT
189
+ sudo iptables -A INPUT -p tcp --dport 9222 -j DROP</code></pre>
190
+ <p><strong>Option B: SSH Tunnel (most secure)</strong></p>
191
+ <ol>
192
+ <li>Don't expose port 9222 publicly</li>
193
+ <li>In the dashboard, set Remote Browser Address to <code>localhost:9222</code></li>
194
+ <li>In SSH Tunnel field, enter: <code>user@remote-host</code></li>
195
+ <li>We auto-create the tunnel before connecting — all traffic encrypted</li>
196
+ </ol>
197
+
198
+ <h3>Troubleshooting</h3>
199
+ <table>
200
+ <tr><th>Issue</th><th>Solution</th></tr>
201
+ <tr><td>"Cannot connect to CDP"</td><td>Check: Chrome running with --remote-debugging-port, firewall allows it, IP/port correct</td></tr>
202
+ <tr><td>"Connection refused"</td><td>Ensure <code>--remote-debugging-address=0.0.0.0</code> is set, or use SSH tunnel</td></tr>
203
+ <tr><td>"WebSocket handshake failed"</td><td>Use host:port format (e.g. <code>192.168.1.100:9222</code>) — we auto-discover the WebSocket URL</td></tr>
204
+ <tr><td>No camera in video call</td><td>Remote machine needs a camera (physical or virtual). Linux: <code>sudo modprobe v4l2loopback</code></td></tr>
205
+ <tr><td>No audio</td><td>Install PulseAudio on Linux. macOS/Windows: works automatically.</td></tr>
206
+ <tr><td>SSH tunnel fails</td><td>Check: SSH key configured (no password), host reachable, user has access</td></tr>
207
+ </table>
208
+
209
+ <h2 id="browserless">3. Browserless.io</h2>
210
+ <p>Managed cloud browser service. Chrome in the cloud, connect via API token. Scalable and maintenance-free.</p>
211
+ <h3>Setup</h3>
212
+ <ol>
213
+ <li>Sign up at <a href="https://www.browserless.io" target="_blank">browserless.io</a></li>
214
+ <li>Copy your API token from the <a href="https://www.browserless.io/dashboard" target="_blank">dashboard</a></li>
215
+ <li>Paste in AgenticMail → Browser → Browserless → API Token</li>
216
+ <li>Click "Test Connection"</li>
217
+ </ol>
218
+ <h3>Self-hosted</h3>
219
+ <pre><code>docker run -d --name browserless -p 3000:3000 -e TOKEN=your-secret ghcr.io/browserless/chromium</code></pre>
220
+ <p>Set endpoint to <code>ws://your-server:3000</code>.</p>
221
+ <div class="warning"><strong>No video calls.</strong> Cloud browsers don't have camera/mic. Use Remote CDP for meetings.</div>
222
+
223
+ <h2 id="browserbase">4. Browserbase</h2>
224
+ <p>AI-native cloud browser. Session replay, anti-detection, built for agent automation.</p>
225
+ <h3>Setup</h3>
226
+ <ol>
227
+ <li>Sign up at <a href="https://www.browserbase.com" target="_blank">browserbase.com</a></li>
228
+ <li>Copy API key from <a href="https://www.browserbase.com/settings" target="_blank">Settings</a></li>
229
+ <li>Copy Project ID from dashboard</li>
230
+ <li>Enter both in AgenticMail → Browser → Browserbase</li>
231
+ <li>"Test Connection"</li>
232
+ </ol>
233
+ <div class="tip"><strong>Session replay:</strong> Watch exactly what your agent did at browserbase.com.</div>
234
+
235
+ <h2 id="steel">5. Steel.dev</h2>
236
+ <p>Open-source browser API for AI agents. Self-host for free or use managed cloud.</p>
237
+ <h3>Cloud setup</h3>
238
+ <ol>
239
+ <li>Sign up at <a href="https://app.steel.dev" target="_blank">app.steel.dev</a></li>
240
+ <li>Copy API key</li>
241
+ <li>Enter in AgenticMail → Browser → Steel</li>
242
+ </ol>
243
+ <h3>Self-hosted</h3>
244
+ <pre><code>docker run -d --name steel -p 3000:3000 ghcr.io/nichochar/steel-browser:latest</code></pre>
245
+ <p>Set endpoint to <code>http://your-server:3000</code>.</p>
246
+
247
+ <h2 id="scrapingbee">6. ScrapingBee</h2>
248
+ <p>Scraping API with proxy rotation and CAPTCHA solving. Routes your browser through their network for anti-detection.</p>
249
+ <h3>Setup</h3>
250
+ <ol>
251
+ <li>Sign up at <a href="https://www.scrapingbee.com" target="_blank">scrapingbee.com</a></li>
252
+ <li>Copy API key from <a href="https://www.scrapingbee.com/dashboard" target="_blank">dashboard</a></li>
253
+ <li>Enter in AgenticMail → Browser → ScrapingBee</li>
254
+ <li>"Test Connection" — shows remaining credits</li>
255
+ </ol>
256
+ <div class="warning"><strong>Proxy-based:</strong> Works differently from other providers. Some advanced Playwright features (file uploads, complex interactions) may not work through the proxy. Use Browserless or Browserbase for those.</div>
257
+
258
+ <h2 id="security">Security Best Practices</h2>
259
+ <div class="card">
260
+ <h3 style="margin-top: 0;">All providers</h3>
261
+ <ul>
262
+ <li><strong>Domain allowlists:</strong> Restrict which websites agents can visit</li>
263
+ <li><strong>Page limits:</strong> Limit concurrent pages to prevent runaway browsing</li>
264
+ <li><strong>SSRF protection:</strong> Blocks navigation to internal IPs (enabled by default)</li>
265
+ <li><strong>Rotate API keys:</strong> Change cloud provider keys periodically</li>
266
+ </ul>
267
+ <h3>Remote CDP</h3>
268
+ <ul>
269
+ <li><strong>Never expose port 9222 publicly</strong> without firewall or SSH tunnel</li>
270
+ <li><strong>Use SSH tunnels</strong> for encrypted connections</li>
271
+ <li><strong>Dedicated Chrome profile</strong> (--user-data-dir) — don't use your personal browser</li>
272
+ <li><strong>Non-root user</strong> on Linux</li>
273
+ <li><strong>Keep Chrome updated</strong></li>
274
+ </ul>
275
+ <h3>Cloud providers</h3>
276
+ <ul>
277
+ <li><strong>Credentials encrypted</strong> in AgenticMail vault</li>
278
+ <li><strong>IP allowlists</strong> on provider dashboards</li>
279
+ <li><strong>Usage alerts</strong> for unusual activity</li>
280
+ </ul>
281
+ </div>
282
+
283
+ <h2 id="faq">FAQ</h2>
284
+ <div class="card">
285
+ <h3 style="margin-top: 0;">Can I use video calls with cloud providers?</h3>
286
+ <p>No. Cloud providers don't have camera/mic. Use <strong>Remote CDP</strong> for meetings.</p>
287
+ <h3>Which provider is fastest?</h3>
288
+ <p>Local Chromium (no network latency). For cloud: Browserless and Steel are fastest.</p>
289
+ <h3>Can I switch providers without losing anything?</h3>
290
+ <p>Yes. Sessions are independent. Switching takes effect on next browser action. Cookies don't transfer between providers.</p>
291
+ <h3>What if cloud provider goes down?</h3>
292
+ <p>Agent falls back to local Chromium automatically.</p>
293
+ <h3>Multiple browsers for different tasks?</h3>
294
+ <p>Each agent has its own browser config. Create different agents for different purposes.</p>
295
+ </div>
296
+
297
+ <p style="margin-top: 32px; color: var(--text-muted); font-size: 12px; text-align: center;">
298
+ AgenticMail Enterprise — Browser Provider Setup Guide
299
+ </p>
300
+
301
+ </body>
302
+ </html>
package/src/dashboard/pages/agent-detail/meeting-browser.js CHANGED
@@ -442,47 +442,60 @@ export function BrowserConfigCard(props) {
442
442
  sectionTitle(I.globe(), 'Remote Browser Connection'),
443
443
  h('div', { style: { padding: '10px 14px', background: 'var(--info-soft)', borderRadius: 'var(--radius)', marginBottom: 12, fontSize: 12, lineHeight: 1.5 } },
444
444
  h('strong', null, 'How it works: '),
445
- 'The agent connects to a Chrome/Chromium browser running on another machine via the Chrome DevTools Protocol (CDP). ',
446
- 'This is required for video calls (Google Meet, Teams, Zoom) where the browser needs a camera, microphone, and display. ',
445
+ 'The agent connects to a Chrome browser running on another machine (a VM, cloud desktop, or remote server). ',
446
+ 'This is ideal for video calls (Google Meet, Teams, Zoom) where the browser needs a camera, microphone, and display.',
447
447
  h('br', null), h('br', null),
448
- h('strong', null, 'Setup options:'), h('br', null),
449
- '\u2022 Run Chrome with --remote-debugging-port=9222 on a VM/desktop', h('br', null),
450
- '\u2022 Use a cloud desktop (AWS WorkSpaces, Azure Virtual Desktop, Hetzner)', h('br', null),
451
- '\u2022 Set up a dedicated browser VM with virtual camera/audio for meetings', h('br', null),
452
- '\u2022 Use SSH tunneling to expose Chrome DevTools securely'
448
+ h('strong', null, 'What you need: '), 'A machine with Chrome installed and remote debugging enabled. ',
449
+ 'Just enter the connection URL below — we handle everything else automatically, including SSH tunneling if needed.',
450
+ h('br', null), h('br', null),
451
+ h('strong', null, 'Connection format: '), 'Enter either:',
452
+ h('br', null),
453
+ '\u2022 A hostname and port (e.g., ', h('code', { style: { fontSize: 11, color: 'var(--accent)' } }, '192.168.1.100:9222'), ') — we auto-discover the WebSocket URL',
454
+ h('br', null),
455
+ '\u2022 A full WebSocket URL (e.g., ', h('code', { style: { fontSize: 11, color: 'var(--accent)' } }, 'ws://192.168.1.100:9222/devtools/browser/...'), ')',
456
+ h('br', null), h('br', null),
457
+ h('strong', null, 'Don\'t have a remote browser yet? '), h('a', { href: '/docs/browser-providers', target: '_blank', style: { color: 'var(--accent)' } }, 'Read our setup guide'),
458
+ ' for step-by-step instructions on setting up Chrome for remote access on any machine (Mac, Linux, Windows, cloud VMs).'
453
459
  ),
454
460
  h('div', { style: { display: 'grid', gap: 12 } },
455
461
  h('div', { className: 'form-group' },
456
- h('label', { style: labelStyle }, 'CDP WebSocket URL *'),
457
- h('input', { className: 'input', placeholder: 'ws://192.168.1.100:9222/devtools/browser/...',
462
+ h('label', { style: labelStyle }, 'Remote Browser Address *'),
463
+ h('input', { className: 'input', placeholder: '192.168.1.100:9222 or ws://host:9222/devtools/browser/...',
458
464
  value: cfg.cdpUrl || '',
459
465
  onChange: function(e) { update('cdpUrl', e.target.value); }
460
466
  }),
461
- h('div', { style: helpStyle }, 'WebSocket URL from chrome://inspect or --remote-debugging-port output. Format: ws://host:port/devtools/browser/<id>')
467
+ h('div', { style: helpStyle }, 'IP address and port of the remote Chrome browser. We auto-detect the connection details.')
462
468
  ),
463
469
  h('div', { style: { display: 'grid', gap: 12, gridTemplateColumns: '1fr 1fr' } },
464
470
  h('div', { className: 'form-group' },
465
471
  h('label', { style: labelStyle }, 'Auth Token'),
466
- h('input', { className: 'input', type: 'password', placeholder: 'Optional — for authenticated CDP endpoints',
472
+ h('input', { className: 'input', type: 'password', placeholder: 'Optional — for authenticated endpoints',
467
473
  value: cfg.cdpAuthToken || '',
468
474
  onChange: function(e) { update('cdpAuthToken', e.target.value || undefined); }
469
- })
475
+ }),
476
+ h('div', { style: helpStyle }, 'Only needed if the remote browser requires authentication.')
470
477
  ),
471
478
  h('div', { className: 'form-group' },
472
- h('label', { style: labelStyle }, 'Connection Timeout (ms)'),
473
- h('input', { className: 'input', type: 'number', min: 5000, max: 60000,
474
- value: cfg.cdpTimeout || 30000,
475
- onChange: function(e) { update('cdpTimeout', parseInt(e.target.value) || 30000); }
476
- })
479
+ h('label', { style: labelStyle }, 'Connection Timeout'),
480
+ h('select', { className: 'input', value: String(cfg.cdpTimeout || 30000),
481
+ onChange: function(e) { update('cdpTimeout', parseInt(e.target.value)); }
482
+ },
483
+ h('option', { value: '10000' }, '10 seconds'),
484
+ h('option', { value: '30000' }, '30 seconds (recommended)'),
485
+ h('option', { value: '60000' }, '60 seconds (slow networks)')
486
+ )
477
487
  )
478
488
  ),
479
489
  h('div', { className: 'form-group' },
480
- h('label', { style: labelStyle }, 'SSH Tunnel (auto-connect)'),
481
- h('input', { className: 'input', placeholder: 'ssh -L 9222:localhost:9222 user@remote-host (optional)',
482
- value: cfg.sshTunnel || '',
483
- onChange: function(e) { update('sshTunnel', e.target.value || undefined); }
484
- }),
485
- h('div', { style: helpStyle }, 'SSH command to establish tunnel before connecting. Agent will run this automatically.')
490
+ h('label', { style: labelStyle }, 'SSH Tunnel'),
491
+ h('div', { style: { display: 'grid', gap: 8, gridTemplateColumns: '1fr auto' } },
492
+ h('input', { className: 'input', placeholder: 'user@remote-host (we handle the rest automatically)',
493
+ value: cfg.sshTunnel || '',
494
+ onChange: function(e) { update('sshTunnel', e.target.value || undefined); }
495
+ }),
496
+ cfg.sshTunnel && h('span', { style: { display: 'flex', alignItems: 'center', fontSize: 11, color: 'var(--success)', whiteSpace: 'nowrap' } }, I.check(), ' Auto-connect enabled')
497
+ ),
498
+ h('div', { style: helpStyle }, 'Optional. If the remote browser is behind a firewall, enter the SSH user@host and we\'ll automatically create a secure tunnel before connecting. The SSH key must be configured on this server.')
486
499
  )
487
500
  )
488
501
  ),