diff --git a/README.md b/README.md index 37fd9cd9..afe6ea54 100644 --- a/README.md +++ b/README.md @@ -31,6 +31,7 @@ Give this prompt to a coding agent to get Dispatch installed as a persistent ser - Personalities — short system-prompt blocks appended to every agent for voice or standing preferences. - Keyboard shortcuts and a command palette (`Mod+K`) for fast navigation and actions. - GitHub integration — PR creation and CI status checks via MCP tools. +- Browser Feedback — a Chrome extension to select an element on any web page, comment, and send it with bounded DOM context to a running agent (paired under Settings → Connections). - Slack notifications with focus-aware suppression. - Activity analytics — heatmaps, daily status charts, working time by project. - Token usage tracking by day, project, and model. diff --git a/apps/web/src/components/app/docs-pane.tsx b/apps/web/src/components/app/docs-pane.tsx index 7b63bdbc..0a40d33c 100644 --- a/apps/web/src/components/app/docs-pane.tsx +++ b/apps/web/src/components/app/docs-pane.tsx @@ -9,6 +9,7 @@ import { Image, Keyboard, Monitor, + MousePointerClick, PlugZap, Signal, Sparkles, @@ -21,6 +22,7 @@ import { ScrollArea } from "@/components/ui/scroll-area"; import { AgentsContent, AutomationsContent, + BrowserFeedbackContent, EventsContent, MediaContent, NotificationsContent, @@ -42,6 +44,7 @@ export type DocsSection = | "personas" | "events" | "media" + | "browser-feedback" | "notifications" | "updates"; @@ -124,6 +127,13 @@ const SECTIONS: SectionDef[] = [ title: "Media & Sharing", content: , }, + { + id: "browser-feedback", + label: "Browser Feedback", + icon: MousePointerClick, + title: "Browser Feedback", + content: , + }, { id: "notifications", label: "Notifications", diff --git a/apps/web/src/components/app/docs-sections/browser-feedback.tsx b/apps/web/src/components/app/docs-sections/browser-feedback.tsx new file mode 100644 index 00000000..ef3d4b55 --- /dev/null +++ b/apps/web/src/components/app/docs-sections/browser-feedback.tsx @@ -0,0 +1,88 @@ +import { Code, H3, P, Section } from "./primitives"; + +export function BrowserFeedbackContent() { + return ( + <> +

+ The Dispatch Browser Feedback extension lets you select an element on + any web page, add a comment, and send it — along with bounded DOM + context for that element — straight to a running agent. It's a Chrome + extension you pair with your Dispatch instance under{" "} + Settings → Connections. +

+ +
+

Installing the extension

+

+ The extension is a developer preview, so Chrome loads it from an + unzipped folder. In Settings → Connections, download + the extension ZIP and unzip it somewhere Chrome can keep reading. Open{" "} + chrome://extensions, enable{" "} + Developer mode, choose Load unpacked + , and select the extracted folder. Click the extension's toolbar icon + to open its side panel. +

+
+ +
+

Pairing a browser

+

+ In the side panel, enter your Dispatch URL and start + the connection. Dispatch opens an approval prompt showing a six-digit + code; confirm it matches the code in the extension and approve. Once + the browser finishes connecting it appears under{" "} + Paired browsers in Settings. Each Chrome profile gets + its own revocable, 90-day token stored only in extension-local storage + — so pairing a new profile or machine is a separate request. +

+
+ +
+

Sending feedback

+

+ Open the side panel on the page you want to inspect and start element + selection — hover to highlight, click to select, or press{" "} + Escape to cancel. The panel previews the sanitized + context that will be shared. Add a Comment, pick one + of your running agents, and choose{" "} + Send to agent. The comment and page context are + delivered to that agent as a prompt. Only running agents are + selectable; use Refresh running agents if the list is + stale. +

+
+ +
+

Privacy and page access

+

+ The inspected page never has to share an origin with Dispatch. On + first use Chrome asks you to grant the extension access to HTTP and + HTTPS pages; this optional grant keeps the picker reliable as you move + between projects and can be revoked from Chrome at any time. + Browser-owned pages such as chrome:// and the Chrome Web + Store can't be inspected. +

+

+ Before previewing or sending, the extension strips form values, + editable content, scripts, inline event handlers, srcdoc, + and likely-secret URL parameters. The agent receives the page context + marked as untrusted observational data, not as instructions. HTTP + Dispatch URLs are supported for self-hosted setups but require an + explicit acknowledgement that HTTP sends without transport encryption. +

+
+ +
+

Managing connections

+

+ Settings → Connections lists every paired browser + with its device name and when it was last used. Each browser has its + own access — revoke one with Revoke and the others + stay connected. You can also Disconnect from the + extension itself, which removes the local token and the optional + Dispatch host permission. +

+
+ + ); +} diff --git a/apps/web/src/components/app/docs-sections/index.ts b/apps/web/src/components/app/docs-sections/index.ts index 4f5f4857..5415a53f 100644 --- a/apps/web/src/components/app/docs-sections/index.ts +++ b/apps/web/src/components/app/docs-sections/index.ts @@ -7,5 +7,6 @@ export { WorktreesContent } from "./worktrees"; export { PersonasContent } from "./personas"; export { EventsContent } from "./events"; export { MediaContent } from "./media"; +export { BrowserFeedbackContent } from "./browser-feedback"; export { NotificationsContent } from "./notifications"; export { UpdatesContent } from "./updates"; diff --git a/apps/web/src/lib/tips/tips.ts b/apps/web/src/lib/tips/tips.ts index 4a654551..653487cf 100644 --- a/apps/web/src/lib/tips/tips.ts +++ b/apps/web/src/lib/tips/tips.ts @@ -204,6 +204,14 @@ export const tips: Tip[] = [ since: "0.29.1", surfaces: ["inline"], }, + { + id: "browser-feedback", + title: "Browser Feedback", + body: "Select an element on any web page, add a comment, and send it to a running agent. Pair the Chrome extension from Settings → Connections.", + docsSection: "browser-feedback", + since: "0.29.3", + surfaces: ["ambient"], + }, { id: "job-webhook-trigger", title: "Job Webhook Triggers",