web-comments 1.0.1 → 1.0.2

package/README.md

@@ -165,6 +165,8 @@ claude mcp add --transport http comments https://app.example.com/__comments/mcp
 
 MCP clients sign in with OAuth 2.1, as the [MCP authorization spec](https://modelcontextprotocol.io/specification/2025-06-18/basic/authorization) describes: protected resource and authorization server metadata, dynamic client registration and client ID metadata documents, authorization codes with PKCE, rotating refresh tokens. The person approving a client is whoever your auth plugins already recognise in their browser, so it works with whatever sign-in you plugged in; someone not signed in is sent to the plugins' `loginUrl`. The agent then acts as that person, under their name with the client's in brackets ("Ada (Claude Code)"). Tokens are opaque and kept hashed in the store.
 
+`authorize` is asked again on every MCP request, so someone who may no longer use comments takes their agents with them. Each person's agents are listed in the widget's MCP panel, with the server's address and the `claude mcp add` line to copy; disconnecting one there ends all its tokens at once.
+
 The metadata is served under `{basePath}/mcp`, which is all a host has to route. Hosts that also send `/.well-known/oauth-protected-resource{basePath}/mcp` and its siblings (`matches()` says yes to them) serve them at the origin's root too. Requests your auth plugins recognise directly, such as a `bearerToken` for a CI agent, are let in without OAuth.
 
 | Option | |
@@ -177,6 +179,12 @@ The metadata is served under `{basePath}/mcp`, which is all a host has to route.
 
 `linear(options)`: every thread becomes an issue in a team, with the comment, a link back to the thread, the element, and both screenshots uploaded to Linear. Replies become issue comments; resolving the thread completes the issue (the team's first "completed" state) and reopening it moves the issue back (its first "unstarted" state). With a webhook, Linear's side comes back too: comments there become replies, and completing or cancelling the issue resolves the thread. Threads show their issue ("Linear ENG-123") in the widget.
 
+People are matched across the two:
+
+- **Connected**: with an OAuth app (`auth: { clientId, clientSecret }`, callback URL `{basePath}/linear/callback`), anyone can connect their own Linear account from the widget's Linear panel. What they do here then reaches Linear as them, and what they do in Linear comes back as them. They can disconnect there too, which revokes the token.
+- **Same email**: someone whose email is a Linear user's follows the issues they open, and their Linear comments come back as them; their comments still reach Linear under the app's name.
+- **Neither**: their Linear button carries a dot, and the panel asks them to connect.
+
 | Option | |
 | --- | --- |
 | `auth` | `{ apiKey }` (a personal key: the issues are that person's, and say who commented), `{ accessToken }` (OAuth), or `{ clientId, clientSecret }` (an OAuth app with client credentials: the issues are the app's, under each commenter's name and picture). |
@@ -195,6 +203,8 @@ interface Connector<Env> {
   onEvent?(event: CommentsEvent, context: ConnectorContext<Env>): void | Promise<void>;
   fetch?(request: Request, context: ConnectorRequestContext<Env>): Response | Promise<Response>;
   rootPaths?(basePath: string): string[];
+  panel?(who: Identity, context: ConnectorContext<Env>): Promise<ConnectorPanel | null>;
+  action?(action: string, who: Identity, input: Record<string, unknown>, context: ConnectorContext<Env>): Promise<void>;
 }
 ```
 
@@ -204,6 +214,7 @@ interface Connector<Env> {
 - `context.links` ties threads and comments to their counterparts elsewhere (`save`, `find(externalId)`, `forThread`); links with a URL show on the thread.
 - `context.storage` keeps the connector's own state (`get`, `set` with an optional TTL, `delete`), apart from other connectors'.
 - `context.screenshot(thread, kind)` reads a screenshot from the asset store; `context.threadUrl(thread)` is the page with the thread open.
+- `panel` gives the connector a button on the widget's toolbar, stacked upwards from the avatar, and a panel of its own: a title, a monochrome icon (an image URL, painted in the toolbar's icon colour), a dot when it wants attention, and blocks the widget draws (`text`, `status`, `code` to copy, `link`, `button`, `list`), so a connector needs no front-end code. A `button` calls `action`, signed in and checked like the API's own requests, and the panel is fetched again.
 
 ## Widget
 

package/dist/chunks/{chunk-RRSB326L.js → chunk-HN5V6BS6.js}

@@ -423,10 +423,11 @@ function createComments(options) {
       return void 0;
     }
   }
-  async function scopeFor(env, site, ctx, source) {
+  async function scopeFor(env, site, ctx, origin, source) {
     const store = await storeFor(env);
     const scope = {
       site,
+      origin,
       store,
       assets: options.assets?.(env) ?? null,
       waitUntil: (work) => keepAlive(ctx, work),
@@ -477,11 +478,12 @@ function createComments(options) {
     return {
       env,
       site,
+      origin: scope.origin,
       basePath,
       as(actor) {
-        own ??= scopeFor(env, site, ctx, connector.name);
-        const scope2 = own;
-        const act = (pick) => async (...args) => pick(actionsFor(await scope2, actor))(...args);
+        own ??= scopeFor(env, site, ctx, scope.origin, connector.name);
+        const mine = own;
+        const act = (pick) => async (...args) => pick(actionsFor(await mine, actor))(...args);
         return {
           listThreads: act((a) => a.listThreads),
           getThread: act((a) => a.getThread),
@@ -527,11 +529,12 @@ function createComments(options) {
       waitUntil: (work) => keepAlive(ctx, work)
     };
   }
+  async function allowed(who, request, env) {
+    return !options.authorize || await options.authorize(who, request, env);
+  }
   async function identifyAllowed(request, env) {
     const who = await identify(options.auth, request, env);
-    if (!who) return null;
-    if (options.authorize && !await options.authorize(who, request, env)) return null;
-    return who;
+    return who && await allowed(who, request, env) ? who : null;
   }
   function fail(status, code, message) {
     return Response.json({ error: { code, message } }, { status });
@@ -541,11 +544,13 @@ function createComments(options) {
     if (!connector.fetch) return fail(404, "not_found", "no such route");
     const request = c.req.raw;
     const ctx = executionOf(c);
-    const scope = await scopeFor(c.env, siteOf(request, c.env), ctx);
+    const scope = await scopeFor(c.env, siteOf(request, c.env), ctx, new URL(request.url).origin);
     const context2 = {
       ...contextFor(connector, c.env, scope, ctx),
       url: `${new URL(request.url).origin}${basePath}/${connector.name}`,
       identify: (other) => identifyAllowed(other, c.env),
+      signedIn: (other) => identify(options.auth, other, c.env),
+      allowed: (who, other) => allowed(who, other, c.env),
       loginUrl: (other) => loginUrlFor(options.auth, other)
     };
     return connector.fetch(request, context2);
@@ -604,7 +609,7 @@ function createComments(options) {
       return fail(403, "forbidden", `${who.email ?? who.name} may not use comments here`);
     }
     const ctx = executionOf(c);
-    const scope = await scopeFor(c.env, siteOf(c.req.raw, c.env), ctx);
+    const scope = await scopeFor(c.env, siteOf(c.req.raw, c.env), ctx, new URL(c.req.url).origin);
     const seen = Date.now();
     if (scope.store.saveUser && seen - (lastSeen.get(who.id) ?? 0) > SEEN_EVERY_MS) {
       lastSeen.set(who.id, seen);
@@ -629,6 +634,34 @@ function createComments(options) {
     return fail(500, "internal", "something went wrong");
   });
   api.get("/me", (c) => c.json({ me: c.var.who }));
+  api.get("/connectors", async (c) => {
+    const panels = await Promise.all(
+      connectors.filter((connector) => connector.panel).map(async (connector) => {
+        const context2 = contextFor(connector, c.env, c.var.scope, executionOf(c));
+        const panel = await Promise.resolve(connector.panel?.(c.var.who, context2)).catch(
+          (error) => {
+            console.error("web-comments:", error);
+            return null;
+          }
+        );
+        return panel && { connector: connector.name, ...panel };
+      })
+    );
+    return c.json({ connectors: panels.filter(Boolean) });
+  });
+  api.post("/connectors/:connector/actions/:action", async (c) => {
+    const connector = connectors.find((one) => one.name === c.req.param("connector"));
+    if (!connector?.action) return fail(404, "not_found", "no such action");
+    const input = c.req.header("content-type")?.includes("application/json") ? await readJson(c.req.raw) : {};
+    const context2 = contextFor(connector, c.env, c.var.scope, executionOf(c));
+    await connector.action(
+      c.req.param("action"),
+      c.var.who,
+      input && typeof input === "object" ? input : {},
+      context2
+    );
+    return c.json({ ok: true });
+  });
   api.get("/threads", async (c) => {
     const page = c.req.query("page");
     const threads = await service.list(c.var.scope, page === void 0 ? {} : { page });