@arjun-shah/agentbar-cli 0.1.9 → 0.1.11

package/README.md

@@ -24,7 +24,13 @@ agentbar stats
 ```
 
 The CLI writes `agentbar.config.json` in your project directory. `agentbar init` only asks
-for your site URL.
+for your site URL and syncs settings to the hosted dashboard so your embed is a single line:
+
+```html
+<script src="https://agent-pug.vercel.app/agentbar.js" data-site-key="your-site-key"></script>
+```
+
+Open the deployed dashboard to edit settings and copy the snippet again.
 
 ## Customization
 

package/bin/agentbar.js

@@ -1,12 +1,15 @@
 #!/usr/bin/env node
+import { spawn } from "node:child_process";
 import fs from "node:fs";
 import path from "node:path";
-import readline from "node:readline";
 import process from "node:process";
+import readline from "node:readline";
 
 const CONFIG_FILE = "agentbar.config.json";
 const DEFAULT_CONFIG = {
   apiBase: "https://agent-pug.vercel.app",
+  authToken: "",
+  accountEmail: "",
   siteUrl: "",
   siteKey: "",
   depth: 1,
@@ -119,202 +122,72 @@ const resolveSiteKey = (config) => {
   }
 };
 
+const authHeaders = (config) =>
+  config.authToken
+    ? {
+        Authorization: `Bearer ${config.authToken}`,
+      }
+    : {};
+
 const renderSnippet = (config) => {
-  const lines = [
-    "<script",
-    `  src=\"${config.apiBase.replace(/\/$/, "")}/agentbar.js\"`,
-    `  data-site=\"${config.siteUrl || "https://your-site.com"}\"`,
-    `  data-api=\"${config.apiBase.replace(/\/$/, "")}\"`,
-    `  data-depth=\"${config.depth}\"`,
-    `  data-max-pages=\"${config.maxPages}\"`,
-  ];
-  if (config.siteKey) {
-    lines.push(`  data-site-key=\"${config.siteKey}\"`);
-  }
-  if (config.themeColor) {
-    lines.push(`  data-theme-color=\"${config.themeColor}\"`);
-  }
-  if (config.position) {
-    lines.push(`  data-position=\"${config.position}\"`);
-  }
-  if (config.title) {
-    lines.push(`  data-title=\"${config.title}\"`);
-  }
-  if (config.subtitle) {
-    lines.push(`  data-subtitle=\"${config.subtitle}\"`);
-  }
-  if (config.buttonLabel) {
-    lines.push(`  data-button-label=\"${config.buttonLabel}\"`);
-  }
-  if (config.fontFamily) {
-    lines.push(`  data-font-family=\"${config.fontFamily}\"`);
-  }
-  if (config.panelBackground) {
-    lines.push(`  data-panel-background=\"${config.panelBackground}\"`);
-  }
-  if (config.textColor) {
-    lines.push(`  data-text-color=\"${config.textColor}\"`);
-  }
-  if (config.mutedTextColor) {
-    lines.push(`  data-muted-text-color=\"${config.mutedTextColor}\"`);
-  }
-  if (config.borderColor) {
-    lines.push(`  data-border-color=\"${config.borderColor}\"`);
-  }
-  if (config.buttonBackground) {
-    lines.push(`  data-button-background=\"${config.buttonBackground}\"`);
-  }
-  if (config.buttonTextColor) {
-    lines.push(`  data-button-text-color=\"${config.buttonTextColor}\"`);
-  }
-  if (config.accentTextColor) {
-    lines.push(`  data-accent-text-color=\"${config.accentTextColor}\"`);
-  }
-  if (config.buttonShadow) {
-    lines.push(`  data-button-shadow=\"${config.buttonShadow}\"`);
-  }
-  if (config.panelShadow) {
-    lines.push(`  data-panel-shadow=\"${config.panelShadow}\"`);
-  }
-  if (config.badgeLabel) {
-    lines.push(`  data-badge-label=\"${config.badgeLabel}\"`);
-  }
-  if (config.badgeBackground) {
-    lines.push(`  data-badge-background=\"${config.badgeBackground}\"`);
-  }
-  if (config.badgeTextColor) {
-    lines.push(`  data-badge-text-color=\"${config.badgeTextColor}\"`);
-  }
-  if (config.userBubbleBackground) {
-    lines.push(`  data-user-bubble-background=\"${config.userBubbleBackground}\"`);
-  }
-  if (config.userBubbleText) {
-    lines.push(`  data-user-bubble-text=\"${config.userBubbleText}\"`);
-  }
-  if (config.userBubbleBorder) {
-    lines.push(`  data-user-bubble-border=\"${config.userBubbleBorder}\"`);
-  }
-  if (config.assistantBubbleBackground) {
-    lines.push(`  data-assistant-bubble-background=\"${config.assistantBubbleBackground}\"`);
-  }
-  if (config.assistantBubbleText) {
-    lines.push(`  data-assistant-bubble-text=\"${config.assistantBubbleText}\"`);
-  }
-  if (config.assistantBubbleBorder) {
-    lines.push(`  data-assistant-bubble-border=\"${config.assistantBubbleBorder}\"`);
-  }
-  if (config.panelWidth) {
-    lines.push(`  data-panel-width=\"${config.panelWidth}\"`);
-  }
-  if (config.panelMaxHeight) {
-    lines.push(`  data-panel-max-height=\"${config.panelMaxHeight}\"`);
-  }
-  if (config.panelRadius) {
-    lines.push(`  data-panel-radius=\"${config.panelRadius}\"`);
-  }
-  if (config.buttonRadius) {
-    lines.push(`  data-button-radius=\"${config.buttonRadius}\"`);
-  }
-  if (typeof config.offsetX === "number") {
-    lines.push(`  data-offset-x=\"${config.offsetX}\"`);
-  }
-  if (typeof config.offsetY === "number") {
-    lines.push(`  data-offset-y=\"${config.offsetY}\"`);
-  }
-  if (config.inputPlaceholder) {
-    lines.push(`  data-input-placeholder=\"${config.inputPlaceholder}\"`);
-  }
-  if (config.sendLabel) {
-    lines.push(`  data-send-label=\"${config.sendLabel}\"`);
-  }
-  if (config.suggestions?.length) {
-    lines.push(`  data-suggestions=\"${config.suggestions.join(" | ")}\"`);
-  }
-  if (config.greeting) {
-    lines.push(`  data-greeting=\"${config.greeting}\"`);
-  }
-  if (typeof config.draggable === "boolean") {
-    lines.push(`  data-draggable=\"${config.draggable}\"`);
-  }
-  if (typeof config.dragOffset === "number" && config.dragOffset !== 0) {
-    lines.push(`  data-drag-offset=\"${config.dragOffset}\"`);
-  }
-  if (typeof config.persistPosition === "boolean") {
-    lines.push(`  data-persist-position=\"${config.persistPosition}\"`);
-  }
-  if (config.positionKey) {
-    lines.push(`  data-position-key=\"${config.positionKey}\"`);
-  }
-  if (config.openOnLoad) {
-    lines.push(`  data-open=\"${config.openOnLoad}\"`);
-  }
-  if (config.showReset) {
-    lines.push(`  data-show-reset=\"${config.showReset}\"`);
-  }
-  if (config.persist) {
-    lines.push(`  data-persist=\"${config.persist}\"`);
-  }
-  if (config.storageKey) {
-    lines.push(`  data-storage-key=\"${config.storageKey}\"`);
-  }
-  if (typeof config.showTypingIndicator === "boolean") {
-    lines.push(`  data-show-typing-indicator=\"${config.showTypingIndicator}\"`);
-  }
-  if (typeof config.showExport === "boolean") {
-    lines.push(`  data-show-export=\"${config.showExport}\"`);
-  }
-  if (config.exportLabel) {
-    lines.push(`  data-export-label=\"${config.exportLabel}\"`);
-  }
-  if (typeof config.showScrollButton === "boolean") {
-    lines.push(`  data-show-scroll-button=\"${config.showScrollButton}\"`);
-  }
-  if (config.scrollLabel) {
-    lines.push(`  data-scroll-label=\"${config.scrollLabel}\"`);
-  }
-  if (typeof config.showMinimize === "boolean") {
-    lines.push(`  data-show-minimize=\"${config.showMinimize}\"`);
-  }
-  if (typeof config.minimizedOnLoad === "boolean") {
-    lines.push(`  data-minimized-on-load=\"${config.minimizedOnLoad}\"`);
-  }
-  if (config.minimizeLabel) {
-    lines.push(`  data-minimize-label=\"${config.minimizeLabel}\"`);
-  }
-  if (config.expandLabel) {
-    lines.push(`  data-expand-label=\"${config.expandLabel}\"`);
-  }
-  if (typeof config.showTimestamps === "boolean") {
-    lines.push(`  data-show-timestamps=\"${config.showTimestamps}\"`);
-  }
-  if (config.timestampLocale) {
-    lines.push(`  data-timestamp-locale=\"${config.timestampLocale}\"`);
-  }
-  if (typeof config.autoScroll === "boolean") {
-    lines.push(`  data-auto-scroll=\"${config.autoScroll}\"`);
-  }
-  if (typeof config.autoScrollThreshold === "number") {
-    lines.push(`  data-auto-scroll-threshold=\"${config.autoScrollThreshold}\"`);
-  }
-  if (config.messageMaxWidth) {
-    lines.push(`  data-message-max-width=\"${config.messageMaxWidth}\"`);
-  }
-  if (config.launcherTooltip) {
-    lines.push(`  data-launcher-tooltip=\"${config.launcherTooltip}\"`);
+  const apiBase = (config.apiBase || DEFAULT_CONFIG.apiBase).replace(/\/$/, "");
+  const siteKey = resolveSiteKey(config) || "your-site-key";
+  return `<script src="${apiBase}/agentbar.js" data-site-key="${siteKey}"></script>`;
+};
+
+const openBrowser = (url) => {
+  try {
+    if (process.platform === "darwin") {
+      spawn("open", [url], { stdio: "ignore", detached: true }).unref();
+      return true;
+    }
+    if (process.platform === "win32") {
+      spawn("cmd", ["/c", "start", "", url], { stdio: "ignore", detached: true }).unref();
+      return true;
+    }
+    if (process.platform === "linux") {
+      spawn("xdg-open", [url], { stdio: "ignore", detached: true }).unref();
+      return true;
+    }
+  } catch {
+    return false;
   }
-  if (typeof config.autoIngest === "boolean") {
-    lines.push(`  data-auto-ingest=\"${config.autoIngest}\"`);
+  return false;
+};
+
+const sleep = (ms) => new Promise((resolve) => setTimeout(resolve, ms));
+
+const syncConfig = async (config) => {
+  const apiBase = (config.apiBase || DEFAULT_CONFIG.apiBase).replace(/\/$/, "");
+  const siteKey = resolveSiteKey(config);
+  if (!siteKey || !config.authToken) {
+    return;
   }
-  if (typeof config.closeOnOutsideClick === "boolean") {
-    lines.push(`  data-close-on-outside-click=\"${config.closeOnOutsideClick}\"`);
+  try {
+    const response = await fetch(`${apiBase}/api/config`, {
+      method: "POST",
+      headers: {
+        "Content-Type": "application/json",
+        ...authHeaders(config),
+      },
+      body: JSON.stringify({
+        siteKey,
+        config: { ...config, siteKey },
+      }),
+    });
+    if (!response.ok) {
+      const data = await response.json().catch(() => ({}));
+      throw new Error(data?.error || "Could not sync hosted settings.");
+    }
+  } catch (_error) {
+    console.warn("Could not sync settings to the hosted dashboard.");
   }
-  lines.push("></script>");
-  return lines.join("\n");
 };
 
 const printHelp = () => {
   console.log("Agent Plugin Bar CLI\n");
   console.log("Commands:");
+  console.log("  agentbar login          Open the web login flow and save an auth token");
   console.log("  agentbar init           Interactive setup and snippet output");
   console.log("  agentbar snippet        Print current embed snippet");
   console.log("  agentbar set <key> <v>  Update config value");
@@ -323,7 +196,7 @@ const printHelp = () => {
   console.log("  agentbar help           Show help\n");
   console.log("Config keys:");
   console.log(
-    "  siteUrl, apiBase, depth, maxPages, siteKey, themeColor, position, title, subtitle,"
+    "  siteUrl, apiBase, authToken, accountEmail, depth, maxPages, siteKey, themeColor, position, title, subtitle,"
   );
   console.log(
     "  buttonLabel, fontFamily, panelBackground, textColor, mutedTextColor, borderColor,"
@@ -365,8 +238,60 @@ const ask = (rl, prompt, fallback) =>
     });
   });
 
+const login = async (existingConfig = loadConfig()) => {
+  const config = { ...existingConfig };
+  const apiBase = (config.apiBase || DEFAULT_CONFIG.apiBase).replace(/\/$/, "");
+
+  const response = await fetch(`${apiBase}/api/auth/device/start`, {
+    method: "POST",
+    headers: { "Content-Type": "application/json" },
+  });
+  const data = await response.json().catch(() => ({}));
+  if (!response.ok) {
+    throw new Error(data?.error || "Failed to start login.");
+  }
+
+  console.log(`User code: ${data.userCode}`);
+  console.log(`Verification URL: ${data.verificationUrl}`);
+  if (!openBrowser(data.verificationUrl)) {
+    console.log("Open that URL in your browser to continue.");
+  }
+  console.log("Waiting for approval...\n");
+
+  const intervalMs = Math.max(1000, Number(data.interval || 2) * 1000);
+  const expiresAt = Number(data.expiresAt || 0);
+
+  while (!expiresAt || Date.now() < expiresAt) {
+    await sleep(intervalMs);
+    const pollResponse = await fetch(`${apiBase}/api/auth/device/poll`, {
+      method: "POST",
+      headers: { "Content-Type": "application/json" },
+      body: JSON.stringify({ deviceCode: data.deviceCode }),
+    });
+    const pollData = await pollResponse.json().catch(() => ({}));
+    if (!pollResponse.ok) {
+      throw new Error(pollData?.error || "Login polling failed.");
+    }
+    if (!pollData.approved) {
+      continue;
+    }
+    config.authToken = pollData.accessToken || "";
+    config.accountEmail = pollData.user?.email || "";
+    saveConfig(config);
+    console.log(`Logged in as ${config.accountEmail || "your account"}.`);
+    return config;
+  }
+
+  throw new Error("Login request expired before approval.");
+};
+
 const init = async () => {
-  const config = loadConfig();
+  let config = loadConfig();
+  if (!config.authToken) {
+    console.log("No saved login found. Opening the web login flow...\n");
+    config = await login(config);
+  }
+
   const rl = readline.createInterface({
     input: process.stdin,
     output: process.stdout,
@@ -384,9 +309,11 @@ const init = async () => {
   }
 
   saveConfig(config);
+  await syncConfig(config);
   console.log("\nSaved config to", configPath);
   console.log("\nEmbed snippet:\n");
   console.log(renderSnippet(config));
+  console.log(`\nDashboard: ${(config.apiBase || DEFAULT_CONFIG.apiBase).replace(/\/$/, "")}\n`);
 };
 
 const printStats = async () => {
@@ -399,8 +326,15 @@ const printStats = async () => {
     process.exit(1);
   }
 
+  if (!config.authToken) {
+    console.error("Missing auth token. Run `agentbar login` first.");
+    process.exit(1);
+  }
+
   try {
-    const response = await fetch(`${apiBase}/api/status`);
+    const response = await fetch(`${apiBase}/api/status`, {
+      headers: authHeaders(config),
+    });
     if (!response.ok) {
       const data = await response.json().catch(() => ({}));
       throw new Error(data?.error || `Status request failed (${response.status})`);
@@ -410,7 +344,7 @@ const printStats = async () => {
     const matched = items.filter((item) => item.key === siteKey);
     if (!matched.length) {
       console.log("No indexed content found for", siteKey);
-      console.log("Send a message in the widget to trigger ingest.");
+      console.log("Save the site config and run reindex from the console first.");
       return;
     }
     matched.forEach((item) => {
@@ -427,7 +361,7 @@ const printStats = async () => {
   }
 };
 
-const setValue = (key, value) => {
+const setValue = async (key, value) => {
   if (!key || typeof value === "undefined") {
     console.error("Usage: agentbar set <key> <value>");
     process.exit(1);
@@ -448,7 +382,7 @@ const setValue = (key, value) => {
       process.exit(1);
     }
     config[key] = parsed;
-  } else if (key === "offsetX" || key === "offsetY") {
+  } else if (key === "offsetX" || key === "offsetY" || key === "dragOffset") {
     const parsed = Number(value);
     if (!Number.isFinite(parsed)) {
       console.error(`${key} must be a number.`);
@@ -472,23 +406,20 @@ const setValue = (key, value) => {
     key === "autoScroll"
   ) {
     config[key] = value === "true" || value === true;
-  } else if (key === "dragOffset") {
-    const parsed = Number(value);
-    if (!Number.isFinite(parsed)) {
-      console.error(`${key} must be a number.`);
-      process.exit(1);
-    }
-    config[key] = parsed;
   } else if (key === "suggestions") {
     config[key] = String(value)
       .split(/[|,]/)
       .map((item) => item.trim())
       .filter(Boolean);
+  } else if (key === "siteUrl") {
+    config[key] = normalizeUrl(value);
+    config.siteKey = resolveSiteKey(config);
   } else {
     config[key] = value;
   }
 
   saveConfig(config);
+  await syncConfig(config);
   console.log("Updated", key, "in", configPath);
 };
 
@@ -496,6 +427,9 @@ const main = async () => {
   const [command, arg1, arg2] = process.argv.slice(2);
 
   switch (command) {
+    case "login":
+      await login();
+      return;
     case "init":
       await init();
       return;
@@ -508,7 +442,7 @@ const main = async () => {
       await printStats();
       return;
     case "set":
-      setValue(arg1, arg2);
+      await setValue(arg1, arg2);
       return;
     case "config":
       console.log(JSON.stringify(loadConfig(), null, 2));
@@ -525,4 +459,7 @@ const main = async () => {
   }
 };
 
-main();
+main().catch((error) => {
+  console.error(error instanceof Error ? error.message : "Unknown error");
+  process.exit(1);
+});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@arjun-shah/agentbar-cli",
-  "version": "0.1.9",
+  "version": "0.1.11",
   "type": "module",
   "description": "Agent Plugin Bar CLI helper.",
   "bin": {