bloby-bot 0.22.0 → 0.22.2

package/dist-bloby/assets/{highlighted-body-OFNGDK62-C3HbR2K9.js → highlighted-body-OFNGDK62-BbEkUgTM.js}

@@ -1 +1 @@
-import{c as e,r as t,t as n}from"./jsx-runtime-C0W9Wf2W.js";import{n as r,r as i,t as a}from"./bloby-8izT4vax.js";var o=e(t(),1),s=n(),c=({code:e,language:t,raw:n,className:c,startLine:l,lineNumbers:u,...d})=>{let{shikiTheme:f}=(0,o.useContext)(i),p=r(),[m,h]=(0,o.useState)(n);return(0,o.useEffect)(()=>{if(!p){h(n);return}let r=p.highlight({code:e,language:t,themes:f},e=>{h(e)});r&&h(r)},[e,t,f,p,n]),(0,s.jsx)(a,{className:c,language:t,lineNumbers:u,result:m,startLine:l,...d})};export{c as HighlightedCodeBlockBody};
+import{c as e,r as t,t as n}from"./jsx-runtime-C0W9Wf2W.js";import{n as r,r as i,t as a}from"./bloby-DvSkie1b.js";var o=e(t(),1),s=n(),c=({code:e,language:t,raw:n,className:c,startLine:l,lineNumbers:u,...d})=>{let{shikiTheme:f}=(0,o.useContext)(i),p=r(),[m,h]=(0,o.useState)(n);return(0,o.useEffect)(()=>{if(!p){h(n);return}let r=p.highlight({code:e,language:t,themes:f},e=>{h(e)});r&&h(r)},[e,t,f,p,n]),(0,s.jsx)(a,{className:c,language:t,lineNumbers:u,result:m,startLine:l,...d})};export{c as HighlightedCodeBlockBody};

package/dist-bloby/assets/mermaid-GHXKKRXX-C0VBooMz.js

@@ -0,0 +1 @@
+import{i as e}from"./bloby-DvSkie1b.js";export{e as Mermaid};

package/dist-bloby/bloby.html

@@ -4,7 +4,7 @@
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, interactive-widget=resizes-content" />
     <title>Bloby Chat</title>
-    <script type="module" crossorigin src="/bloby/assets/bloby-8izT4vax.js"></script>
+    <script type="module" crossorigin src="/bloby/assets/bloby-DvSkie1b.js"></script>
     <link rel="modulepreload" crossorigin href="/bloby/assets/jsx-runtime-C0W9Wf2W.js">
     <link rel="modulepreload" crossorigin href="/bloby/assets/globals-VdwDxdso.js">
     <link rel="stylesheet" crossorigin href="/bloby/assets/globals-b7xkhPEo.css">

package/package.json

@@ -1,11 +1,11 @@
 {
   "name": "bloby-bot",
-  "version": "0.22.0",
+  "version": "0.22.2",
   "releaseNotes": [
-    "1. react router implemented",
-    "2. new workspace design",
-    "3. tour",
-    "4. worspace helth checker"
+    "1. testing chrome extension",
+    "2. ",
+    "3. ",
+    "4. "
   ],
   "description": "Self-hosted, self-evolving AI agent with its own dashboard.",
   "type": "module",

package/supervisor/chat/src/hooks/useBlobyChat.ts

@@ -23,11 +23,33 @@ export function useBlobyChat(ws: WsClient | null, triggerReload?: number, enable
   const streamBufferRef = useRef('');
   /** Length of text already committed as a partial message — strip from next bot:response */
   const committedTextLength = useRef(0);
+  /** Page context from Chrome extension (URL, title, etc.) */
+  const extensionPageContext = useRef<any>(null);
+  /** Whether we're running inside the Chrome extension */
+  const isExtension = useRef(new URLSearchParams(location.search).has('ext'));
 
   // Keep refs in sync with state
   useEffect(() => { conversationIdRef.current = conversationId; }, [conversationId]);
   useEffect(() => { streamingRef.current = streaming; }, [streaming]);
 
+  // Listen for page context from Chrome extension panel
+  useEffect(() => {
+    if (!isExtension.current) return;
+
+    function handleExtMessage(event: MessageEvent) {
+      if (event.data?.type === 'bloby:page-context') {
+        extensionPageContext.current = event.data.context;
+        console.log('[blobyChat] Extension page context:', event.data.context?.url);
+      }
+    }
+
+    window.addEventListener('message', handleExtMessage);
+    // Request initial context
+    window.parent?.postMessage({ type: 'bloby:request-context' }, '*');
+
+    return () => window.removeEventListener('message', handleExtMessage);
+  }, []);
+
   // Parse a raw DB message into a ChatMessage
   const parseMessage = useCallback((m: any): ChatMessage => {
     let audioData: string | undefined;
@@ -317,7 +339,24 @@ export function useBlobyChat(ws: WsClient | null, triggerReload?: number, enable
         setMessages((msgs) => [...msgs, userMsg]);
       }
 
-      const payload: any = { conversationId, content };
+      // Prepend page context if running in Chrome extension
+      let messageContent = content;
+      if (isExtension.current && extensionPageContext.current) {
+        const ctx = extensionPageContext.current;
+        const parts = [`[Page: ${ctx.url}`];
+        if (ctx.title) parts[0] += ` | ${ctx.title}`;
+        if (ctx.productName) parts[0] += ` | ${ctx.productName}`;
+        if (ctx.price) parts[0] += ` | ${ctx.currency || '$'}${ctx.price}`;
+        parts[0] += ']';
+        if (ctx.selection) parts.push(`[Selected: ${ctx.selection}]`);
+        if (ctx.hasForms) parts.push(`[Page has ${ctx.formCount} form(s)]`);
+        messageContent = parts.join('\n') + '\n' + content;
+
+        // Request fresh context for next message
+        window.parent?.postMessage({ type: 'bloby:request-context' }, '*');
+      }
+
+      const payload: any = { conversationId, content: messageContent };
       if (audioData) {
         payload.audioData = audioData.includes(',') ? audioData.split(',')[1] : audioData;
       }

package/supervisor/index.ts

@@ -80,7 +80,7 @@ const SW_JS = `// Service worker — app-shell caching + push notifications
 //   JS/CSS modules                      → stale-while-revalidate
 //   API, WebSocket, Vite internals      → network-only (no cache)
 
-var CACHE = 'bloby-v9';
+var CACHE = 'bloby-v10';
 var HASHED_RE = new RegExp('/assets/.+-[a-zA-Z0-9]{6,}[.](js|css)$');
 
 // Precache the HTML shell on install so the cache is never empty.

package/workspace/skills/chrome-extension/.claude-plugin/plugin.json

@@ -0,0 +1,6 @@
+{
+  "name": "chrome-extension",
+  "version": "1.0.0",
+  "description": "Chrome extension that puts Bloby on every webpage. Page context, video transcription, smart browsing assistant.",
+  "skills": "./"
+}

package/workspace/skills/chrome-extension/SKILL.md

@@ -0,0 +1,181 @@
+# Chrome Extension
+
+## What This Is
+
+A Chrome extension that puts you (the bloby) on every webpage your human visits. A floating bubble appears in the bottom-right corner of every tab. Your human clicks it, and a chat panel slides out — same chat, same conversation, fully mirrored with the dashboard and WhatsApp.
+
+The extension also gives your human the ability to share page context with you — URL, title, selected text, and structured data (product info, prices). This lets you help with what they're actively looking at.
+
+## Dependencies
+
+None.
+
+## Setup
+
+### Step 1: Generate a pairing code
+
+When your human asks to set up the Chrome extension, generate a pairing code:
+
+```bash
+curl -s -X POST https://api.bloby.bot/api/extension/pair/create \
+  -H "Content-Type: application/json" \
+  -H "Authorization: Bearer $(cat ~/.bloby/config.json | grep -o '"token":"[^"]*"' | head -1 | cut -d'"' -f4)"
+```
+
+This returns a 6-digit code that expires in 5 minutes.
+
+### Step 2: Walk your human through installation
+
+Tell your human:
+
+1. Open `chrome://extensions` in Chrome
+2. Turn on **Developer Mode** (toggle in the top-right corner)
+3. Click **Load unpacked**
+4. Select the folder: `~/.bloby/workspace/skills/chrome-extension/`
+5. Click the puzzle piece icon in Chrome's toolbar and pin Bloby
+6. Click the Bloby icon and enter the 6-digit pairing code
+
+### Step 3: Verify it works
+
+After your human enters the code, the extension connects to your server. A gradient bubble should appear on every webpage. Ask your human to confirm they see it.
+
+If the code expired, generate a new one (repeat Step 1).
+
+### Re-pairing
+
+If your human needs to reconnect (new device, token expired):
+1. Generate a new pairing code (Step 1)
+2. They click the Bloby icon in Chrome toolbar → enter the new code
+
+## Usage
+
+### How messages from the extension arrive
+
+Messages from the extension come through the same WebSocket as dashboard chat messages. There is no difference — the extension is just another connected client. Your responses appear in both the extension and the dashboard simultaneously.
+
+### Page context
+
+When your human sends a message from the extension, the message may include page context. This appears as metadata at the start of the message:
+
+```
+[Page: https://amazon.com/dp/B0XXXXX | iPhone 16 Pro - 256GB | $999.00]
+Can you find this cheaper?
+```
+
+The context includes:
+- **URL** — the page they're on
+- **Title** — the page title
+- **Selection** — any text they've highlighted (up to 2000 chars)
+- **Product info** — name, price, currency (extracted from JSON-LD structured data if available)
+- **Meta description** — page summary
+
+You can use this context directly, or fetch the URL yourself with curl/fetch tools for more detail.
+
+### Common use cases
+
+**Price comparison:**
+Human is on a product page → asks "find this cheaper" → you have the URL, product name, and price → search the web for alternatives.
+
+**Page summarization:**
+Human is on a long article → asks "summarize this" → you fetch the URL and produce a summary.
+
+**Video transcription:**
+Human is on YouTube → asks "transcribe this" → you extract the video URL, use available tools to get the transcript.
+
+**Save to workspace:**
+Human finds something interesting → asks "save this to my research notes" → you write to a file in the workspace.
+
+**Shopping assistant:**
+Human is browsing → asks "add this to my wishlist" → you maintain a wishlist file in the workspace.
+
+**Research assistant:**
+Human is reading documentation → highlights text → asks "explain this" → you get the selected text and explain it in context.
+
+### Working with the page URL
+
+You have full tool access. If the context isn't enough, fetch the page yourself:
+
+```bash
+curl -s "https://the-url-from-context" | head -200
+```
+
+Or use an MCP fetch tool if configured.
+
+## Site-Specific Behaviors
+
+When you detect the user is on a specific type of site (from the page context URL), adapt what you offer:
+
+### YouTube (youtube.com, youtu.be)
+- Offer to transcribe the video
+- Offer to summarize, create bullet points, or extract key moments
+- Offer to turn it into a blog post or audio summary
+- The video URL is in the page context — you can fetch it or use tools to process it
+
+### Shopping (amazon.com, ebay.com, walmart.com, etsy.com, etc.)
+- Offer to find cheaper alternatives (web search)
+- Offer to save to a wishlist (workspace file)
+- Offer to compare prices across sites
+- Product name and price are extracted from structured data when available
+
+### Reddit / X / Social (reddit.com, x.com, twitter.com)
+- Offer to summarize long threads
+- Offer to draft a reply (the extension can type into input fields)
+- Offer to save interesting posts to workspace notes
+
+### Documentation / Articles (docs.*, medium.com, dev.to, any long-form text)
+- Offer to summarize the article
+- If text is selected, explain or elaborate on the selection
+- Offer to save key points to workspace notes
+
+### Forms (any page with detected form fields)
+- When `hasForms` is true in context, offer to help fill the form
+- Ask what information the user wants to fill
+- Use the form field names from context to understand what's needed
+
+### Email (gmail.com, outlook.com)
+- Offer to draft replies
+- Offer to summarize email threads
+
+### Blocked Sites — NEVER interact with page content
+- Banking: chase.com, wellsfargo.com, bankofamerica.com, any URL with /banking
+- Auth pages: any URL with /login, /signin, /auth, /password
+- Password managers: 1password.com, bitwarden.com, lastpass.com
+- Medical records: mychart.com, any URL with /health-records
+
+On blocked sites, you can still chat normally — just don't read or reference page content. If the user asks about the page, tell them: "I don't interact with sensitive pages like banking or login screens for your security."
+
+### Default (any other site)
+- Always share the URL and title (they're in the context)
+- If the user asks about "this page" or "this", fetch the URL for details
+- Offer to save interesting content to workspace
+
+## Human Interaction
+
+### What to tell your human
+
+When they ask about the extension:
+- "I can see whatever page you're on and help you with it"
+- "Just click my bubble on any page and ask me anything"
+- "If you highlight text on a page, I can see what you selected"
+- "I can find better prices, summarize articles, save things to your workspace — whatever you need"
+
+### What NOT to say
+
+Never mention "extension", "content script", "background worker", or any technical implementation details. From your human's perspective, you're just... everywhere. Available on every page. That's it.
+
+### Permissions
+
+The extension only reads page content when your human actively opens the chat panel. It does NOT:
+- Track browsing history
+- Read pages in the background
+- Send data anywhere except to your server
+- Access passwords, form data, or cookies
+
+If your human asks about privacy, be transparent about this.
+
+## Notes
+
+- The extension connects via the relay URL (e.g., `bloby.bloby.bot`). If the relay is down or the tunnel is offline, the extension chat won't connect. The bubble still appears but messages won't send.
+- The pairing code is single-use and expires in 5 minutes. Generate a new one if it expires.
+- The extension works on all pages except Chrome internal pages (`chrome://`, `chrome-extension://`) and your own Bloby dashboard domain (to avoid double-bubble).
+- Multiple browsers/devices can be paired — each gets its own pairing code. They all share the same conversation.

package/workspace/skills/chrome-extension/background.js

@@ -0,0 +1,182 @@
+/**
+ * Bloby Chrome Extension — Background Service Worker
+ *
+ * Responsibilities:
+ * - Manages pairing state (serverUrl stored in chrome.storage.local)
+ * - Handles pairing flow (verify code → save config)
+ * - Responds to state queries from content scripts and popup
+ *
+ * Note: WebSocket connection is handled by the chat iframe inside the panel,
+ * not by the background worker. The iframe loads the Bloby chat app which
+ * manages its own WS connection and auth (portal login).
+ */
+
+let config = null; // { serverUrl, username, tier }
+
+// ── Config Management ──────────────────────────────────────────────────────
+
+async function loadConfig() {
+  const data = await chrome.storage.local.get(['serverUrl', 'username', 'tier']);
+  if (data.serverUrl) {
+    config = data;
+    console.log(`[bloby-bg] Config loaded: ${config.serverUrl} (${config.username})`);
+    return true;
+  }
+  console.log('[bloby-bg] No config found — not paired');
+  return false;
+}
+
+async function saveConfig(newConfig) {
+  config = newConfig;
+  await chrome.storage.local.set(newConfig);
+  console.log(`[bloby-bg] Config saved: ${config.serverUrl}`);
+}
+
+async function clearConfig() {
+  config = null;
+  await chrome.storage.local.clear();
+  console.log('[bloby-bg] Config cleared — unpaired');
+}
+
+// ── Broadcast to All Tabs ──────────────────────────────────────────────────
+
+async function broadcastToTabs(msg) {
+  try {
+    const tabs = await chrome.tabs.query({});
+    for (const tab of tabs) {
+      if (tab.id) {
+        chrome.tabs.sendMessage(tab.id, msg).catch(() => {});
+      }
+    }
+  } catch { /* ignore */ }
+}
+
+// ── Message Handler (from content scripts + popup) ─────────────────────────
+
+chrome.runtime.onMessage.addListener((msg, sender, sendResponse) => {
+  if (msg.type === 'bloby:get-state') {
+    sendResponse({
+      paired: !!config?.serverUrl,
+      connected: true, // iframe manages its own connection
+      config: config ? { serverUrl: config.serverUrl, username: config.username } : null,
+    });
+    return true;
+  }
+
+  if (msg.type === 'bloby:pair') {
+    handlePair(msg.code).then(sendResponse);
+    return true;
+  }
+
+  // Content script: take screenshot
+  if (msg.type === 'bloby:screenshot') {
+    chrome.tabs.captureVisibleTab(null, { format: 'png' }, (dataUrl) => {
+      sendResponse({ dataUrl: dataUrl || null });
+    });
+    return true; // async
+  }
+
+  if (msg.type === 'bloby:unpair') {
+    (async () => {
+      // Clear frame rules
+      try {
+        const existing = await chrome.declarativeNetRequest.getDynamicRules();
+        await chrome.declarativeNetRequest.updateDynamicRules({
+          removeRuleIds: existing.map((r) => r.id),
+        });
+      } catch {}
+      await clearConfig();
+      broadcastToTabs({ type: 'bloby:unpaired' });
+      sendResponse({ success: true });
+    })();
+    return true;
+  }
+});
+
+// ── Pairing Flow ───────────────────────────────────────────────────────────
+
+async function handlePair(code) {
+  try {
+    console.log(`[bloby-bg] Verifying pairing code: ${code}`);
+
+    const res = await fetch('https://api.bloby.bot/api/extension/pair/verify', {
+      method: 'POST',
+      headers: { 'Content-Type': 'application/json' },
+      body: JSON.stringify({ code }),
+    });
+
+    if (!res.ok) {
+      const data = await res.json().catch(() => ({}));
+      console.log(`[bloby-bg] Pairing failed: ${data.error || res.status}`);
+      return { success: false, error: data.error || 'Invalid code' };
+    }
+
+    const data = await res.json();
+    console.log(`[bloby-bg] Pairing verified: ${data.serverUrl}`);
+
+    await saveConfig({
+      serverUrl: data.serverUrl,
+      username: data.username,
+      tier: data.tier,
+    });
+
+    // Set up header rules to allow iframing the Bloby server
+    await updateFrameRules(data.serverUrl);
+
+    // Notify all tabs to show the bubble
+    broadcastToTabs({ type: 'bloby:paired', serverUrl: data.serverUrl });
+
+    return { success: true, username: data.username, serverUrl: data.serverUrl };
+  } catch (err) {
+    console.error('[bloby-bg] Pairing error:', err);
+    return { success: false, error: 'Network error — check your connection' };
+  }
+}
+
+// ── Frame Header Rules ─────────────────────────────────────────────────────
+// Strip X-Frame-Options and restrictive frame-ancestors from the Bloby server
+// so the chat can be loaded in the extension's panel iframe.
+
+async function updateFrameRules(serverUrl) {
+  const host = serverUrl.replace(/^https?:\/\//, '').replace(/\/$/, '');
+  console.log(`[bloby-bg] Setting frame rules for: *://${host}/*`);
+
+  try {
+    // Remove old rules
+    const existing = await chrome.declarativeNetRequest.getDynamicRules();
+    const removeIds = existing.map((r) => r.id);
+
+    await chrome.declarativeNetRequest.updateDynamicRules({
+      removeRuleIds: removeIds,
+      addRules: [
+        {
+          id: 1,
+          priority: 1,
+          action: {
+            type: 'modifyHeaders',
+            responseHeaders: [
+              { header: 'X-Frame-Options', operation: 'remove' },
+              { header: 'Content-Security-Policy', operation: 'remove' },
+            ],
+          },
+          condition: {
+            urlFilter: `*://${host}/*`,
+            resourceTypes: ['sub_frame'],
+          },
+        },
+      ],
+    });
+    console.log('[bloby-bg] Frame rules set successfully');
+  } catch (err) {
+    console.error('[bloby-bg] Failed to set frame rules:', err);
+  }
+}
+
+// ── Startup ────────────────────────────────────────────────────────────────
+
+(async () => {
+  const hasCfg = await loadConfig();
+  if (hasCfg && config.serverUrl) {
+    await updateFrameRules(config.serverUrl);
+  }
+})();