claudeck 1.4.0 → 1.4.1

package/public/js/panels/memory.js

@@ -109,6 +109,7 @@ function renderMemories() {
       try {
         await fetchApi(`/${m.id}`, { method: 'DELETE' });
         memories = memories.filter(x => x.id !== m.id);
+        if ($.memoryTitle) $.memoryTitle.textContent = `Memory (${memories.length})`;
         renderMemories();
         loadStats();
       } catch { /* ignore */ }

package/public/js/ui/context-gauge.js

@@ -5,11 +5,13 @@ import { $ } from '../core/dom.js';
 const sbGaugeSep = document.getElementById("sb-gauge-sep");
 
 const MODEL_LIMITS = {
+  opus: 1_000_000,
   default: 200_000,
 };
 
 function getLimit() {
-  return MODEL_LIMITS.default;
+  const model = $.modelSelect?.value || '';
+  return MODEL_LIMITS[model] || MODEL_LIMITS.default;
 }
 
 function formatTokens(n) {
@@ -73,6 +75,13 @@ export function resetContextGauge() {
   if (sbGaugeSep) sbGaugeSep.classList.add('hidden');
 }
 
+// Re-render gauge when model changes (limit may differ)
+$.modelSelect?.addEventListener('change', () => {
+  const tokens = getState('sessionTokens');
+  const total = tokens.input + tokens.output + tokens.cacheRead + tokens.cacheCreation;
+  if (total > 0) renderGauge(tokens);
+});
+
 export async function loadContextGauge(sessionId) {
   if (!sessionId) return;
   try {

package/public/js/ui/header-dropdowns.js

@@ -70,3 +70,33 @@ document.addEventListener("keydown", (e) => {
     document.querySelectorAll(".header-dropdown.open").forEach((d) => d.classList.remove("open"));
   }
 });
+
+// Sync header dropdown display when hidden selects change programmatically
+function syncDropdownDisplay(selectId) {
+  const select = document.getElementById(selectId);
+  if (!select) return;
+
+  function sync() {
+    const val = select.value;
+    const items = document.querySelectorAll(`.header-submenu-item[data-target="${selectId}"]`);
+    let matchedText = null;
+    items.forEach((item) => {
+      const isMatch = item.dataset.value === val;
+      item.classList.toggle("active", isMatch);
+      if (isMatch) matchedText = item.textContent.trim();
+    });
+    if (matchedText) {
+      const parent = items[0]?.closest(".header-dropdown-item");
+      const display = parent?.querySelector(".header-dropdown-item-value");
+      if (display) display.textContent = matchedText;
+    }
+  }
+
+  select.addEventListener("change", sync);
+  // Initial sync for values restored from localStorage
+  sync();
+}
+
+syncDropdownDisplay("model-select");
+syncDropdownDisplay("perm-mode-select");
+syncDropdownDisplay("max-turns-select");

package/public/js/ui/input-meta.js

@@ -6,16 +6,23 @@ const elPerm  = document.getElementById("input-meta-perm");
 const elTurns = document.getElementById("input-meta-turns");
 
 const permLabels = {
-  bypass: "bypass",
-  confirmDangerous: "confirm dangerous",
-  confirmAll: "confirm all",
-  plan: "plan only",
+  bypass: "Bypass",
+  confirmDangerous: "Confirm Writes",
+  confirmAll: "Confirm All",
+  plan: "Plan Mode",
+};
+
+const modelLabels = {
+  "": "Auto",
+  sonnet: "Sonnet",
+  opus: "Opus",
+  haiku: "Haiku",
 };
 
 function updateModel() {
   if (!elModel) return;
   const val = $.modelSelect?.value || "";
-  elModel.textContent = val || "default model";
+  elModel.textContent = modelLabels[val] || val || "Auto";
 }
 
 function updatePerm() {
@@ -27,7 +34,7 @@ function updatePerm() {
 function updateTurns() {
   if (!elTurns) return;
   const val = $.maxTurnsSelect?.value || "30";
-  elTurns.textContent = val === "0" ? "unlimited turns" : `${val} turns`;
+  elTurns.textContent = val === "0" ? "Unlimited" : `${val} turns`;
 }
 
 // Also watch header dropdown display elements (used when dropdowns replace <select>)

package/public/js/ui/max-turns.js

@@ -9,13 +9,16 @@ export function getMaxTurns() {
 }
 
 function init() {
+  $.maxTurnsSelect?.addEventListener('change', () => {
+    localStorage.setItem(STORAGE_KEY, $.maxTurnsSelect.value);
+  });
   const saved = localStorage.getItem(STORAGE_KEY);
   if (saved && $.maxTurnsSelect) {
     $.maxTurnsSelect.value = saved;
+    queueMicrotask(() => {
+      $.maxTurnsSelect?.dispatchEvent(new Event('change', { bubbles: true }));
+    });
   }
-  $.maxTurnsSelect?.addEventListener('change', () => {
-    localStorage.setItem(STORAGE_KEY, $.maxTurnsSelect.value);
-  });
 }
 
 init();

package/public/js/ui/model-selector.js

@@ -11,6 +11,7 @@ function init() {
   const saved = localStorage.getItem(STORAGE_KEY);
   if (saved && $.modelSelect) {
     $.modelSelect.value = saved;
+    $.modelSelect.dispatchEvent(new Event('change', { bubbles: true }));
   }
   $.modelSelect?.addEventListener('change', () => {
     localStorage.setItem(STORAGE_KEY, $.modelSelect.value);

package/public/js/ui/permissions.js

@@ -153,6 +153,7 @@ function initPermissions() {
   const saved = localStorage.getItem(STORAGE_KEY);
   if (saved && $.permModeSelect) {
     $.permModeSelect.value = saved;
+    $.permModeSelect.dispatchEvent(new Event('change', { bubbles: true }));
   }
 
   // Persist mode changes