@loupekit/mcp 0.8.1-next.29 → 0.9.0-next.30

package/dist/index.js

@@ -39,6 +39,17 @@ async function fetchImage(url) {
   }
 }
 var targetOf = (c) => c.kind === "free" ? "page-level note" : c.anchor.testid ? `[data-testid="${c.anchor.testid}"]` : c.anchor.cssPath;
+var titleOf = (c) => c.title || (c.body.split("\n")[0] ?? "").trim() || "(no title)";
+async function imageBlocks(attachments) {
+  const out = [];
+  for (const a of attachments ?? []) {
+    if (a.kind !== "image") continue;
+    const img = await fetchImage(a.url);
+    if (img) out.push(img);
+  }
+  return out;
+}
+var attachmentLines = (c) => (c.attachments ?? []).length ? ["", "**Attachments:**", ...(c.attachments ?? []).map((a) => `- ${a.kind === "video" ? "\u{1F3AC}" : "\u{1F5BC}"} ${a.name ?? "attachment"} \u2014 ${a.url}`)] : [];
 async function listComments({ status, url }) {
   const q = new URLSearchParams({ projectKey: PROJECT_KEY });
   if (url) q.set("url", url);
@@ -46,7 +57,7 @@ async function listComments({ status, url }) {
   if (status) comments = comments.filter((c) => c.status === status);
   if (!comments.length) return wrap("No comments match.");
   const lines = comments.map(
-    (c) => `- [${c.status}] #${c.id} \u2014 ${c.body}
+    (c) => `- [${c.status}] #${c.id} \u2014 ${titleOf(c)}: ${c.body}
     \u21B3 ${targetOf(c)} on ${c.url} (by ${c.author.name})`
   );
   return wrap(`${comments.length} comment(s):
@@ -58,24 +69,28 @@ Use get_comment(id) for the full element context.`);
 async function getComment({ id }) {
   const c = await api(`/v1/comments/${encodeURIComponent(id)}`);
   if (c.kind === "free") {
-    return wrap(
-      [
-        `# Feedback #${c.id} from ${c.author.name} (${c.status})`,
-        ``,
-        `**Note:** ${c.body}`,
-        `**Page:** ${c.url}`,
-        `**Type:** Free note \u2014 a page-level comment, not tied to a specific element (no screenshot).`
-      ].join("\n")
-    );
+    const text2 = [
+      `# Feedback #${c.id} from ${c.author.name} (${c.status})`,
+      ``,
+      `**Title:** ${titleOf(c)}`,
+      `**Note:** ${c.body}`,
+      `**Page:** ${c.url}`,
+      `**Type:** Free note \u2014 a page-level comment, not tied to a specific element.`,
+      ...attachmentLines(c)
+    ].join("\n");
+    const imgs = await imageBlocks(c.attachments);
+    return wrap(text2, ...imgs.map((i) => ({ type: "image", data: i.data, mimeType: i.mimeType })));
   }
   const text = [
     `# Feedback #${c.id} from ${c.author.name} (${c.status})`,
     ``,
+    `**Title:** ${titleOf(c)}`,
     `**Request:** ${c.body}`,
     `**Page:** ${c.url}`,
     `**Target element:** ${c.anchor.testid ? `[data-testid="${c.anchor.testid}"]` : `\`${c.anchor.cssPath}\``}`,
     c.screenshot ? `**Screenshot:** ${c.screenshot}` : ``,
     c.recording ? `**Screen recording (webm):** ${c.recording}` : ``,
+    ...attachmentLines(c),
     ``,
     `## Target element HTML`,
     "```html",
@@ -100,8 +115,11 @@ async function getComment({ id }) {
     `---`,
     `When you've rewritten this UI, call \`propose_change(id: "${c.id}", html, css?, notes?)\` so the dev team sees your modified HTML/CSS in the dashboard.`
   ].filter(Boolean).join("\n");
-  const img = c.screenshot ? await fetchImage(c.screenshot) : null;
-  return img ? wrap(text, { type: "image", data: img.data, mimeType: img.mimeType }) : wrap(text);
+  const images = [
+    ...c.screenshot ? [await fetchImage(c.screenshot)] : [],
+    ...await imageBlocks(c.attachments)
+  ].filter((i) => i !== null);
+  return wrap(text, ...images.map((i) => ({ type: "image", data: i.data, mimeType: i.mimeType })));
 }
 async function updateStatus({ id, status }) {
   await api(`/v1/comments/${encodeURIComponent(id)}`, { method: "PATCH", body: JSON.stringify({ status }) });
@@ -118,7 +136,7 @@ async function proposeChange({ id, html, css, notes }) {
   await api(`/v1/comments/${encodeURIComponent(id)}`, { method: "PATCH", body: JSON.stringify({ proposal }) });
   return wrap(`Proposal saved for #${id}. The dev team can now review your modified HTML/CSS in the dashboard.`);
 }
-var server = new McpServer({ name: "loupe", version: "0.8.1" });
+var server = new McpServer({ name: "loupe", version: "0.9.0" });
 server.tool(
   "list_comments",
   "List Loupe product-feedback comments for the project as a task backlog. Use this to see what a PM has flagged, then work through the items.",

package/package.json

@@ -5,7 +5,7 @@
     "email": "m.ashraf.saed@gmail.com",
     "url": "https://www.linkedin.com/in/mohamedashrafelsaed/"
   },
-  "version": "0.8.1-next.29",
+  "version": "0.9.0-next.30",
   "description": "MCP server that exposes Loupe comments to Claude Code as an actionable, fully-contextualized backlog.",
   "keywords": [
     "loupe",
@@ -46,6 +46,6 @@
     "zod": "^3.24.1"
   },
   "devDependencies": {
-    "@loupekit/shared": "0.8.1-next.29"
+    "@loupekit/shared": "0.9.0-next.30"
   }
 }