bunnyquery 1.0.7 → 1.0.9

package/bunnyquery.css

@@ -143,6 +143,23 @@
     white-space: nowrap;
 }
 
+.bq-ai-status {
+    display: inline-flex;
+    align-items: center;
+    max-width: min(56vw, 26rem);
+    padding: 0.12rem 0.45rem;
+    border: 1px solid var(--bq-line);
+    background: #f7f7f7;
+    color: var(--bq-muted);
+    font-size: 0.72rem;
+    font-weight: 600;
+    letter-spacing: 0.01em;
+    line-height: 1.25;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+}
+
 .bq-title-right {
     display: flex;
     align-items: center;
@@ -185,6 +202,40 @@
     font-size: 0.85rem;
 }
 
+.bq-link-button {
+    display: inline-flex;
+    align-items: center;
+    gap: 0.35rem;
+    padding: 0.35rem 0.65rem;
+    margin: 0.2rem 0.2rem 0.2rem 0;
+    border: 1px solid var(--bq-line);
+    border-radius: 0.15rem;
+    background: var(--bq-paper);
+    color: var(--bq-pink);
+    font-size: 0.78rem;
+    font-weight: 600;
+    text-decoration: none;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    max-width: 100%;
+    transition: background 0.15s, color 0.15s, border-color 0.15s;
+    cursor: pointer;
+}
+
+.bq-link-button:hover {
+    background: var(--bq-hover-bg);
+    border-color: var(--bq-pink);
+}
+
+.bq-link-button:visited {
+    color: #a01848;
+}
+
+.bq-link-button:visited:hover {
+    color: var(--bq-pink);
+}
+
 .bq-link {
     color: var(--bq-pink);
     text-decoration: none;

package/bunnyquery.js

@@ -50,7 +50,7 @@
         OPENAI_RESPONSES_API_URL: 'https://api.openai.com/v1/responses',
         MAX_TOKENS: 25000,
         POLL_INTERVAL: 1500,
-        PENDING_POLL_INTERVAL_MS: 4000,
+        PENDING_POLL_INTERVAL_MS: 1000,
         ATTACHMENT_URL_EXPIRES_SECONDS: 600, // 10 min
     };
 
@@ -66,6 +66,269 @@
     // init()) is reflected in subsequent send/auth calls.
     const _mcpBaseUrl = () => (global.BunnyQuery && global.BunnyQuery.MCP_BASE_URL) || DEFAULTS.MCP_BASE_URL;
 
+    // ----- link parsing helpers -----
+    // Matches markdown links `[label](url)` and bare https URLs.
+    // Handles balanced parentheses in URLs (e.g. for filenames like image (1).png).
+    const LINK_REGEX = /\[([^\]\n]+)\]\((https?:\/\/(?:[^\s()]+|\([^\s()]*\))+)\)|(https?:\/\/[^\s<>"']+)/g;
+
+    const normalizeBareUrl = (url) => {
+        if (!url) return '';
+        let out = url;
+
+        // Trim sentence punctuation that often trails pasted URLs.
+        out = out.replace(/[.,;:!?]+$/, '');
+
+        // Remove unmatched closing wrappers but preserve balanced pairs.
+        const trimUnmatched = (openCh, closeCh) => {
+            while (out.endsWith(closeCh)) {
+                const openCount = (out.match(new RegExp('\\' + openCh, 'g')) || []).length;
+                const closeCount = (out.match(new RegExp('\\' + closeCh, 'g')) || []).length;
+                if (closeCount > openCount) {
+                    out = out.slice(0, -1);
+                } else {
+                    break;
+                }
+            }
+        };
+
+        trimUnmatched('(', ')');
+        trimUnmatched('[', ']');
+        trimUnmatched('{', '}');
+
+        return out;
+    };
+
+    const truncateLabel = (label, maxLen = 50, options = {}) => {
+        const { stripTrailing = false } = options;
+        if (!label) return '';
+        const trimmed = label.trim();
+        const unwrapped = trimmed
+            .replace(/^\*\*(.*)\*\*$/, '$1')
+            .replace(/^__(.*)__$/, '$1');
+        const cleaned = stripTrailing
+            ? unwrapped.replace(/[`'"*\]\>.,;:!?]+$/, '')
+            : unwrapped;
+        if (cleaned.length <= maxLen) return cleaned;
+        return cleaned.slice(0, maxLen - 1) + '\u2026'; // ellipsis
+    };
+
+    // Helper: parse markdown links from a text segment
+    const parseMsgLinks = (text, offsetInContent, parts) => {
+        LINK_REGEX.lastIndex = 0;
+        let last = 0;
+        let lm;
+        while ((lm = LINK_REGEX.exec(text)) !== null) {
+            if (lm.index > last) {
+                const prevText = text.slice(last, lm.index);
+                if (parts.length && parts[parts.length - 1].type === 'text') {
+                    parts[parts.length - 1].text += prevText;
+                } else {
+                    parts.push({ type: 'text', text: prevText });
+                }
+            }
+
+            // Markdown link: [label](url)
+            if (lm[1] && lm[2]) {
+                const label = truncateLabel(lm[1]);
+                const href = lm[2];
+                parts.push({
+                    type: 'link',
+                    label: label,
+                    href: href,
+                });
+            }
+            // Bare URL
+            else if (lm[3]) {
+                const href = normalizeBareUrl(lm[3]);
+                const label = truncateLabel(href);
+                parts.push({
+                    type: 'link',
+                    label: label,
+                    href: href,
+                });
+            }
+
+            last = lm.index + lm[0].length;
+        }
+
+        if (last < text.length) {
+            const tail = text.slice(last);
+            if (parts.length && parts[parts.length - 1].type === 'text') {
+                parts[parts.length - 1].text += tail;
+            } else {
+                parts.push({ type: 'text', text: tail });
+            }
+        }
+    };
+
+    // ----- file-fence helpers (mirrors agent.vue) ---------------------------
+    // Bare language tags we treat as downloadable files. Maps to the
+    // extension used in the synthesized filename. Mirrors the file types the
+    // host agent (agent.vue) is known to emit as ```filename.ext fences.
+    const FENCE_LANGUAGE_EXTENSIONS = {
+        html: 'html',
+        htm: 'html',
+        csv: 'csv',
+        tsv: 'tsv',
+        json: 'json',
+        xml: 'xml',
+        svg: 'svg',
+        md: 'md',
+        markdown: 'md',
+        yaml: 'yaml',
+        yml: 'yml',
+        txt: 'txt',
+        sql: 'sql',
+        css: 'css',
+    };
+
+    const FENCE_MIME_TYPES = {
+        html: 'text/html',
+        csv: 'text/csv',
+        tsv: 'text/tab-separated-values',
+        json: 'application/json',
+        xml: 'application/xml',
+        svg: 'image/svg+xml',
+        md: 'text/markdown',
+        yaml: 'text/yaml',
+        yml: 'text/yaml',
+        txt: 'text/plain',
+        sql: 'application/sql',
+        css: 'text/css',
+    };
+
+    // Closed fences with `filename.ext` after the opening backticks.
+    const FENCE_FILENAME_RE = /```([\w.-]+\.[a-zA-Z0-9]+)\n([\s\S]*?)```/g;
+    // Closed fences whose info-string is one of the known language tags
+    // above. The model often emits ```html ... ``` or ```csv ... ``` instead
+    // of a full filename — surface those as downloadable files too.
+    const FENCE_LANG_RE = new RegExp(
+        '```(' + Object.keys(FENCE_LANGUAGE_EXTENSIONS).join('|') + ')[ \\t]*\\n([\\s\\S]*?)```',
+        'gi'
+    );
+    // Open (still-streaming) fences for either pattern, used to suppress the
+    // raw fence text mid-typewriter.
+    const OPEN_FENCE_FILENAME_RE = /```([\w.-]+\.[a-zA-Z0-9]+)\n?/;
+    const OPEN_FENCE_LANG_RE = new RegExp(
+        '```(' + Object.keys(FENCE_LANGUAGE_EXTENSIONS).join('|') + ')[ \\t]*\\n?',
+        'i'
+    );
+
+    // Cache blob URLs keyed by (filename + content) so re-renders don't leak
+    // a fresh ObjectURL on every tick of streaming text.
+    const _fileBlobCache = new Map();
+    const _getOrCreateFileHref = (filename, body) => {
+        const key = filename + '\u0000' + body;
+        const existing = _fileBlobCache.get(key);
+        if (existing) return existing;
+        const ext = (filename.split('.').pop() || '').toLowerCase();
+        const type = FENCE_MIME_TYPES[ext] || 'text/plain';
+        const blob = new Blob([body], { type });
+        const href = URL.createObjectURL(blob);
+        _fileBlobCache.set(key, href);
+        return href;
+    };
+
+    // Counter used to mint stable filenames for bare-language fences within
+    // a single rendered message ("download.html", "download-2.html", ...).
+    // Keyed by message identity so re-renders of the same message reuse the
+    // same names (which lets the blob cache hit).
+    const _bareFenceNameCounters = new WeakMap();
+    const _bareFilenameFor = (msgKey, ext, occurrence) => {
+        const base = 'download';
+        return occurrence === 0 ? `${base}.${ext}` : `${base}-${occurrence + 1}.${ext}`;
+    };
+
+    // Split message content into a sequence of {type:'text'|'file'} parts,
+    // mirroring agent.vue's parseMsgParts behavior for fenced code blocks.
+    // Bare-language fences (```html, ```csv, ...) are also lifted into
+    // downloadable file parts with a synthesized filename.
+    const parseMsgParts = (content, msgKey, isTyping) => {
+        const parts = [];
+        if (!content) return parts;
+
+        // First pass: extract file fences (existing logic)
+        const fenceParts = [];
+        const fenceMatches = [];
+        FENCE_FILENAME_RE.lastIndex = 0;
+        let mm;
+        while ((mm = FENCE_FILENAME_RE.exec(content)) !== null) {
+            fenceMatches.push({ index: mm.index, length: mm[0].length, filename: mm[1], body: mm[2], kind: 'filename' });
+        }
+        FENCE_LANG_RE.lastIndex = 0;
+        let bareCounters = _bareFenceNameCounters.get(msgKey);
+        if (!bareCounters) {
+            bareCounters = {};
+            if (msgKey) _bareFenceNameCounters.set(msgKey, bareCounters);
+        }
+        const bareSeen = {};
+        while ((mm = FENCE_LANG_RE.exec(content)) !== null) {
+            const lang = mm[1].toLowerCase();
+            const ext = FENCE_LANGUAGE_EXTENSIONS[lang];
+            const occurrence = bareSeen[ext] || 0;
+            bareSeen[ext] = occurrence + 1;
+            fenceMatches.push({
+                index: mm.index,
+                length: mm[0].length,
+                filename: _bareFilenameFor(msgKey, ext, occurrence),
+                body: mm[2],
+                kind: 'lang',
+            });
+        }
+        fenceMatches.sort((a, b) => a.index - b.index || (a.kind === 'filename' ? -1 : 1));
+        const dedupFences = [];
+        for (const m of fenceMatches) {
+            if (dedupFences.length && dedupFences[dedupFences.length - 1].index === m.index) continue;
+            dedupFences.push(m);
+        }
+
+        // Second pass: extract links from text segments between fences
+        let lastFenceEnd = 0;
+        for (const fence of dedupFences) {
+            // Parse links in text before this fence
+            const beforeFence = content.slice(lastFenceEnd, fence.index);
+            if (beforeFence) {
+                parseMsgLinks(beforeFence, lastFenceEnd, parts);
+            }
+            // Add the fence
+            parts.push({
+                type: 'file',
+                filename: fence.filename,
+                href: _getOrCreateFileHref(fence.filename, fence.body),
+            });
+            lastFenceEnd = fence.index + fence.length;
+        }
+
+        // Parse links in remaining text after last fence
+        let tail = content.slice(lastFenceEnd);
+        if (tail) {
+            parseMsgLinks(tail, lastFenceEnd, parts);
+        }
+
+        // Mid-typewriter: hide raw source for a still-open fence so the user
+        // doesn't watch literal code stream by character-by-character.
+        if (isTyping && tail) {
+            const fnOpen = tail.match(OPEN_FENCE_FILENAME_RE);
+            const langOpen = tail.match(OPEN_FENCE_LANG_RE);
+            const open = fnOpen && (!langOpen || fnOpen.index <= langOpen.index)
+                ? { match: fnOpen, label: fnOpen[1] }
+                : langOpen
+                    ? { match: langOpen, label: 'download.' + FENCE_LANGUAGE_EXTENSIONS[langOpen[1].toLowerCase()] }
+                    : null;
+            if (open) {
+                const before = tail.slice(0, open.match.index);
+                if (before && parts.length && parts[parts.length - 1].type === 'text') {
+                    parts[parts.length - 1].text += '\n[generating ' + open.label + '...]';
+                } else if (before) {
+                    parts.push({ type: 'text', text: before + '\n[generating ' + open.label + '...]' });
+                } else {
+                    parts.push({ type: 'text', text: '\n[generating ' + open.label + '...]' });
+                }
+            }
+        }
+        return parts;
+    };
+
     // ----- helpers ----------------------------------------------------------
     const $ = (tag, attrs, children) => {
         const el = document.createElement(tag);
@@ -359,7 +622,7 @@
         const msgList = messages && messages.length
             ? messages
             : [{ role: 'user', content: prompt }];
-        return skapi.clientSecretRequest({
+        const request = {
             clientSecretName: 'claude',
             poll: DEFAULTS.POLL_INTERVAL,
             queue: service,
@@ -399,7 +662,8 @@
                     },
                 ],
             },
-        });
+        };
+        return skapi.clientSecretRequest(request);
     }
 
     function buildOpenAIRequest(skapi, { service, owner, prompt, messages, system, model }) {
@@ -639,6 +903,8 @@
             this.pendingTimer = null;
             this._pollingPending = false;
             this._loadingOlder = false;
+            this._loadingFirstHistory = false;
+            this._initialHistoryLoaded = false;
 
             this.refs = {};
 
@@ -664,6 +930,16 @@
 
         // ---- bootstrap order ----------------------------------------------
         async _bootstrap() {
+            // 0. Refresh connection info to ensure latest configuration.
+            try {
+                const info = await this.skapi.getConnectionInfo({ refresh: true });
+                const ai = String(info.ai_agent || '').split('#');
+                this.platform = (ai[0] || '').toLowerCase(); // 'claude' | 'openai'
+                this.model = ai[1] || '';
+            } catch (_) {
+                // Non-fatal; continue with existing connection info
+            }
+
             // 1. Validate that the project has a configured AI platform.
             if (!this.platform) {
                 this._renderFatal('This project does not have an AI agent configured yet. Please ask the project owner to set up an AI agent in the project settings page.');
@@ -805,8 +1081,20 @@
             const titleText = this.projectName
                 ? this.projectName
                 : 'BunnyQuery';
+            const platformLabel = this.platform === 'claude'
+                ? 'Claude'
+                : this.platform === 'openai'
+                    ? 'OpenAI'
+                    : 'Unknown';
+            const modelLabel = this.model || (
+                this.platform === 'claude'
+                    ? DEFAULTS.DEFAULT_CLAUDE_MODEL
+                    : this.platform === 'openai'
+                        ? DEFAULTS.DEFAULT_OPENAI_MODEL
+                        : 'N/A'
+            );
             const titleLeft = $('div', { class: 'bq-title-left' }, [
-                $('h2', null, titleText),
+                $('span', { class: 'bq-ai-status', title: `AI: ${platformLabel} / ${modelLabel}` }, `${platformLabel} · ${modelLabel}`),
             ]);
 
             const clearIcon = $('button', {
@@ -849,7 +1137,7 @@
             const textarea = $('textarea', {
                 class: 'bq-input',
                 rows: '1',
-                placeholder: 'Ask anything about the project...',
+                placeholder: `Ask anything about ${this.projectName || 'the project'}...`,
                 oninput: (e) => this._autoGrow(e.target),
                 onkeydown: (e) => {
                     if (e.key === 'Enter' && !e.shiftKey) {
@@ -901,7 +1189,15 @@
                 box.scrollHeight - box.scrollTop - box.clientHeight < 80;
             box.innerHTML = '';
 
-            if (!this.messages.length) {
+            if (!this._initialHistoryLoaded) {
+                box.appendChild(
+                    $('div', { class: 'bq-message is-assistant bq-empty-greeting' }, [
+                        $('div', { class: 'bq-bubble' }, [
+                            $('span', { class: 'bq-loader' }, 'Loading chat history'),
+                        ]),
+                    ])
+                );
+            } else if (!this.messages.length) {
                 box.appendChild(
                     $('div', { class: 'bq-message is-assistant bq-empty-greeting' }, [
                         $('div', { class: 'bq-bubble' },
@@ -916,7 +1212,38 @@
                 if (msg.isPending) {
                     bubble.appendChild($('span', { class: 'bq-loader' }, 'Thinking'));
                 } else {
-                    bubble.textContent = msg.content || '';
+                    // Render fenced file blocks (```filename.ext``` or
+                    // ```html / ```csv / etc.) as inline download links;
+                    // everything else stays plain text. Mirrors the
+                    // behavior of agent.vue's parseMsgParts.
+                    const parts = parseMsgParts(msg.content || '', msg, !!this.typing);
+                    if (!parts.length) {
+                        bubble.textContent = msg.content || '';
+                    } else {
+                        for (const part of parts) {
+                            if (part.type === 'file') {
+                                const a = $('a', {
+                                    class: 'bq-file-download',
+                                    href: part.href,
+                                    target: '_blank',
+                                    rel: 'noopener noreferrer',
+                                    download: part.filename,
+                                }, '\u2197 ' + part.filename);
+                                bubble.appendChild(a);
+                                } else if (part.type === 'link') {
+                                    const a = $('a', {
+                                        class: 'bq-link-button',
+                                        href: part.href,
+                                        target: '_blank',
+                                        rel: 'noopener noreferrer',
+                                        title: part.href,
+                                    }, '\u2197 ' + part.label);
+                                    bubble.appendChild(a);
+                            } else {
+                                bubble.appendChild(document.createTextNode(part.text));
+                            }
+                        }
+                    }
                 }
                 const wrapper = $('div', {
                     class:
@@ -944,12 +1271,12 @@
         }
 
         _updateInputDisabled() {
-            const busy = this.sending || this.uploading || this._anyPending();
+            const busy = this.sending || this.uploading || this._anyPending() || this._loadingFirstHistory;
             if (this.refs.textarea) {
                 this.refs.textarea.disabled = busy;
                 this.refs.textarea.placeholder = busy
                     ? 'Request in process. Please wait...'
-                    : 'Ask anything about the project...';
+                    : `Ask anything about ${this.projectName || 'the project'}...`;
             }
             if (this.refs.sendBtn) this.refs.sendBtn.disabled = busy;
             if (this.refs.attachBtn) this.refs.attachBtn.disabled = busy;
@@ -1134,6 +1461,10 @@
 
         // ---- history ------------------------------------------------------
         async _loadFirstHistoryPage() {
+            this._loadingFirstHistory = true;
+            this._initialHistoryLoaded = false;
+            this._renderMessages();
+
             const fetchPage = () => getChatHistory(
                 this.skapi,
                 { service: this.serviceId, owner: this.ownerId, platform: this.platform },
@@ -1158,10 +1489,13 @@
                 // there are no older entries the user is allowed to see.
                 this.endOfList = !!(res && res.endOfList) || (this._getClearedAt() > 0 && list.length === 0);
                 this.messages = mapHistoryToMessages(list, this.platform);
-                this._renderMessages();
                 this._schedulePendingPoll();
             } catch (err) {
                 console.error('[BunnyQuery] history load failed', err);
+            } finally {
+                this._loadingFirstHistory = false;
+                this._initialHistoryLoaded = true;
+                this._renderMessages();
             }
         }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bunnyquery",
-  "version": "1.0.7",
+  "version": "1.0.9",
   "description": "BunnyQuery AI chat client",
   "main": "bunnyquery.js",
   "files": [