vibespot 0.7.0 → 0.7.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vibespot",
-  "version": "0.7.0",
+  "version": "0.7.1",
   "description": "AI-powered HubSpot CMS landing page builder — vibe coding & React converter",
   "type": "module",
   "bin": {

package/ui/chat.js

@@ -15,6 +15,8 @@ let streamTimerInterval = null;
 let lastStreamStatus = "";
 let currentSessionId = "";
 let currentTemplateId = "";
+let renderScheduled = false;
+let scrollScheduled = false;
 
 const messagesEl = document.getElementById("chat-messages");
 const inputEl = document.getElementById("chat-input");
@@ -47,11 +49,15 @@ function connectWebSocket() {
   };
 
   ws.onclose = () => {
+    stopStreamTimer();
+    if (isStreaming) finishStreaming();
     setStatus("Disconnected — reconnecting...");
     setTimeout(connectWebSocket, 2000);
   };
 
   ws.onerror = () => {
+    stopStreamTimer();
+    if (isStreaming) finishStreaming();
     setStatus("Connection error");
   };
 }
@@ -236,6 +242,16 @@ function handleStreamChunk(text) {
   if (!streamingMsgEl) return;
   streamBuffer += text;
 
+  if (!renderScheduled) {
+    renderScheduled = true;
+    requestAnimationFrame(flushStreamRender);
+  }
+}
+
+function flushStreamRender() {
+  renderScheduled = false;
+  if (!streamingMsgEl) return;
+
   // Hide incomplete code fences (AI is writing module code)
   let display = streamBuffer;
   const fenceCount = (display.match(/```/g) || []).length;
@@ -410,7 +426,16 @@ function escapeHtml(str) {
 }
 
 function scrollToBottom() {
-  messagesEl.scrollTop = messagesEl.scrollHeight;
+  if (scrollScheduled) return;
+  scrollScheduled = true;
+  requestAnimationFrame(() => {
+    scrollScheduled = false;
+    // Only auto-scroll if user is near the bottom (within 150px)
+    const gap = messagesEl.scrollHeight - messagesEl.scrollTop - messagesEl.clientHeight;
+    if (gap < 150) {
+      messagesEl.scrollTop = messagesEl.scrollHeight;
+    }
+  });
 }
 
 function setStatus(text) {
@@ -488,7 +513,11 @@ async function refreshHistoryPanel() {
     }
 
     list.innerHTML = toggleHtml;
-    for (const commit of data.commits) {
+    const HISTORY_LIMIT = 50;
+    const commits = data.commits.slice(0, HISTORY_LIMIT);
+    const frag = document.createDocumentFragment();
+
+    for (const commit of commits) {
       const isInitial = commit.message.startsWith("Initial ");
       const isRollback = commit.message.includes("Rollback to:");
 
@@ -507,7 +536,15 @@ async function refreshHistoryPanel() {
         <div class="history-item__msg">${escapeHtml(displayMsg)}</div>
         ${!isInitial ? `<button class="history-item__rollback" data-hash="${escapeHtml(commit.fullHash)}">Restore</button>` : ""}
       `;
-      list.appendChild(item);
+      frag.appendChild(item);
+    }
+    list.appendChild(frag);
+
+    if (data.commits.length > HISTORY_LIMIT) {
+      const more = document.createElement("div");
+      more.className = "history__show-more";
+      more.textContent = `Showing ${HISTORY_LIMIT} of ${data.commits.length} versions`;
+      list.appendChild(more);
     }
 
     list.querySelectorAll(".history-item__rollback").forEach((btn) => {

package/ui/dashboard.js

@@ -115,25 +115,20 @@ function renderTemplateList(templates) {
     list.appendChild(item);
   }
 
-  // Attach click handlers
-  list.querySelectorAll(".dashboard__template-open").forEach((btn) => {
-    btn.addEventListener("click", () => openTemplate(btn.dataset.id));
-  });
-  list.querySelectorAll(".dashboard__template-delete").forEach((btn) => {
-    btn.addEventListener("click", () => confirmDeleteTemplate(btn.dataset.id));
-  });
-
-  // Double-click on label to rename
-  list.querySelectorAll(".dashboard__template-label").forEach((labelEl) => {
+  // Event delegation — single listener handles all template actions
+  list.onclick = (e) => {
+    const openBtn = e.target.closest(".dashboard__template-open");
+    if (openBtn) return openTemplate(openBtn.dataset.id);
+    const delBtn = e.target.closest(".dashboard__template-delete");
+    if (delBtn) return confirmDeleteTemplate(delBtn.dataset.id);
+  };
+  list.ondblclick = (e) => {
+    const labelEl = e.target.closest(".dashboard__template-label");
+    if (!labelEl) return;
     const item = labelEl.closest(".dashboard__template-item");
     const templateId = item?.querySelector(".dashboard__template-open")?.dataset.id;
-    if (!templateId) return;
-
-    labelEl.addEventListener("dblclick", (e) => {
-      e.stopPropagation();
-      startTemplateRename(labelEl, templateId);
-    });
-  });
+    if (templateId) startTemplateRename(labelEl, templateId);
+  };
 }
 
 function startTemplateRename(labelEl, templateId) {

package/ui/dialog.js

@@ -6,10 +6,9 @@
 // HTML-escape helper (standalone so dialog.js has no load-order dependency)
 if (typeof esc === "undefined") {
   // eslint-disable-next-line no-var
+  var _escMap = { "&": "&amp;", "<": "&lt;", ">": "&gt;", '"': "&quot;", "'": "&#39;" };
   var esc = function (str) {
-    const el = document.createElement("span");
-    el.textContent = String(str);
-    return el.innerHTML;
+    return String(str).replace(/[&<>"']/g, function (c) { return _escMap[c]; });
   };
 }
 

package/ui/field-editor.js

@@ -38,6 +38,7 @@ async function openFieldEditor(moduleName) {
 }
 
 function closeFieldEditor() {
+  if (updateTimer) { clearTimeout(updateTimer); updateTimer = null; }
   currentEditModule = null;
   if (typeof showModuleListView === "function") {
     showModuleListView();

package/ui/upload-panel.js

@@ -354,11 +354,23 @@ function setUploadState(state, data) {
   }
 }
 
+let _logBuffer = "";
+let _logFlushScheduled = false;
+
 function appendUploadLog(text) {
-  const log = document.getElementById("upload-log");
-  if (!log) return;
-  log.textContent += text;
-  log.scrollTop = log.scrollHeight;
+  _logBuffer += text;
+  if (!_logFlushScheduled) {
+    _logFlushScheduled = true;
+    requestAnimationFrame(() => {
+      _logFlushScheduled = false;
+      const log = document.getElementById("upload-log");
+      if (log) {
+        log.textContent += _logBuffer;
+        log.scrollTop = log.scrollHeight;
+      }
+      _logBuffer = "";
+    });
+  }
 }
 
 function fixUploadWithAI() {