codetrap 0.1.7 → 0.1.9

package/src/web/client-script.ts

@@ -1,4 +1,6 @@
 import { WEB_TEXT_JSON } from "./client-text";
+import { WEB_REVIEW_CLIENT_SCRIPT } from "./client-review";
+import { WEB_SHELL_CLIENT_SCRIPT } from "./client-shell";
 
 export function webClientScript(textJson = WEB_TEXT_JSON): string {
   return `    const qs = new URLSearchParams(location.search);
@@ -6,6 +8,13 @@ export function webClientScript(textJson = WEB_TEXT_JSON): string {
     if (token) sessionStorage.setItem("codetrap-token", token);
     const savedLocale = localStorage.getItem("codetrap-locale");
     const initialLocale = savedLocale === "zh" ? "zh" : "en";
+    const savedSidebarCollapsed = localStorage.getItem("codetrap-sidebar-collapsed") === "true";
+    const savedQueueCollapsed = localStorage.getItem("codetrap-queue-collapsed") === "true";
+    const EMBEDDING_DEFAULTS = {
+      endpoint: "http://127.0.0.1:11434",
+      model: "qwen3-embedding:0.6b",
+      dimensions: "1024"
+    };
 
     const TEXT = ${textJson};
 
@@ -14,6 +23,7 @@ export function webClientScript(textJson = WEB_TEXT_JSON): string {
       mainView: "review",
       projects: [],
       sessions: [],
+      candidateReview: null,
       candidates: [],
       traps: [],
       trapKey: null,
@@ -24,16 +34,25 @@ export function webClientScript(textJson = WEB_TEXT_JSON): string {
       trapSort: "updated",
       insightTraps: [],
       insightFilters: { scope: "", status: "all" },
+      embeddingStatus: null,
+      embeddingSettings: null,
+      embeddingProviderDraft: "ollama",
+      embeddingOllama: { ...EMBEDDING_DEFAULTS },
+      embeddingReindexing: null,
       projectRoot: null,
       sessionId: null,
       candidateId: null,
       candidateView: "inbox",
+      candidateDirty: false,
+      sidebarCollapsed: savedSidebarCollapsed,
+      queueCollapsed: savedQueueCollapsed,
       options: { categories: [], severities: [], scopes: [] },
       conflicts: []
     };
 
     const el = (id) => document.getElementById(id);
-
+${WEB_SHELL_CLIENT_SCRIPT}
+${WEB_REVIEW_CLIENT_SCRIPT}
     function t(key, params = {}) {
       const text = TEXT[state.locale]?.[key] ?? TEXT.en[key] ?? key;
       return Object.entries(params).reduce((value, [name, replacement]) =>
@@ -62,9 +81,11 @@ export function webClientScript(textJson = WEB_TEXT_JSON): string {
       document.querySelector("[data-main-view='review']").textContent = t("nav.review");
       document.querySelector("[data-main-view='library']").textContent = t("nav.library");
       document.querySelector("[data-main-view='insights']").textContent = t("nav.insights");
+      document.querySelector("[data-main-view='embeddings']").textContent = t("nav.embeddings");
       document.querySelectorAll("[data-locale]").forEach((button) => {
         button.classList.toggle("active", button.dataset.locale === state.locale);
       });
+      renderSidebarToggle();
     }
 
     function setLocale(locale) {
@@ -113,23 +134,27 @@ export function webClientScript(textJson = WEB_TEXT_JSON): string {
     async function loadSessions() {
       if (!state.projectRoot) {
         state.sessions = [];
+        state.candidateReview = null;
         state.candidates = [];
         state.traps = [];
         state.insightTraps = [];
+        state.embeddingStatus = null;
+        state.embeddingSettings = null;
         renderSessions();
         renderActiveView();
         return;
       }
       const data = await api("/api/sessions?project=" + encodeURIComponent(state.projectRoot));
       state.sessions = data.sessions;
-      if (!state.sessionId || !state.sessions.some((s) => s.id === state.sessionId)) {
-        state.sessionId = state.sessions[0]?.id || null;
-      }
+      state.candidateReview = data.candidate_review || null;
+      state.sessionId = selectedReviewSessionId(state.sessions, state.sessionId);
       renderSessions();
       if (state.mainView === "library") {
         await loadTraps();
       } else if (state.mainView === "insights") {
         await loadInsightTraps();
+      } else if (state.mainView === "embeddings") {
+        await loadEmbeddings();
       } else {
         await loadCandidates();
       }
@@ -146,7 +171,12 @@ export function webClientScript(textJson = WEB_TEXT_JSON): string {
       }
       const data = await api("/api/candidates?project=" + encodeURIComponent(state.projectRoot) + "&session=" + encodeURIComponent(state.sessionId));
       state.candidates = data.candidates;
-      selectVisibleCandidate();
+      state.candidateId = reviewQueueModel({
+        candidates: state.candidates,
+        candidateView: state.candidateView,
+        candidateId: state.candidateId,
+        candidateReview: state.candidateReview
+      }).selectedCandidateId;
       if (state.mainView === "review") {
         renderCandidates();
         renderDetail();
@@ -198,6 +228,26 @@ export function webClientScript(textJson = WEB_TEXT_JSON): string {
       }
     }
 
+    async function loadEmbeddings() {
+      if (!state.projectRoot) {
+        state.embeddingStatus = null;
+        state.embeddingSettings = null;
+        if (state.mainView === "embeddings") {
+          renderEmbeddingsView();
+          renderEmbeddingsDetail();
+        }
+        return;
+      }
+      const data = await api("/api/embeddings?project=" + encodeURIComponent(state.projectRoot));
+      state.embeddingStatus = data;
+      state.embeddingSettings = data.settings || null;
+      syncEmbeddingDraftFromStatus(data);
+      if (state.mainView === "embeddings") {
+        renderEmbeddingsView();
+        renderEmbeddingsDetail();
+      }
+    }
+
     function renderMainViewButtons() {
       document.querySelectorAll("[data-main-view]").forEach((button) => {
         button.classList.toggle("active", button.dataset.mainView === state.mainView);
@@ -210,14 +260,23 @@ export function webClientScript(textJson = WEB_TEXT_JSON): string {
         el("queue-title").textContent = t("title.trapLibrary");
         el("detail-title").textContent = t("title.trapDetail");
         el("candidate-tabs").classList.add("hidden");
+        hideReviewSummary();
         renderLibrary();
         renderTrapDetail();
       } else if (state.mainView === "insights") {
         el("queue-title").textContent = t("title.growthInsights");
         el("detail-title").textContent = t("title.insightDetail");
         el("candidate-tabs").classList.add("hidden");
+        hideReviewSummary();
         renderInsightsView();
         renderInsightDetail();
+      } else if (state.mainView === "embeddings") {
+        el("queue-title").textContent = t("title.embeddings");
+        el("detail-title").textContent = t("title.embeddingDetail");
+        el("candidate-tabs").classList.add("hidden");
+        hideReviewSummary();
+        renderEmbeddingsView();
+        renderEmbeddingsDetail();
       } else {
         el("queue-title").textContent = t("title.candidateInbox");
         el("detail-title").textContent = t("title.candidateDetail");
@@ -242,6 +301,8 @@ export function webClientScript(textJson = WEB_TEXT_JSON): string {
           state.trapKey = null;
           state.trapDetails = {};
           state.insightTraps = [];
+          state.embeddingStatus = null;
+          state.embeddingSettings = null;
           renderProjects();
           await loadSessions();
         });
@@ -255,6 +316,7 @@ export function webClientScript(textJson = WEB_TEXT_JSON): string {
             <span class="row-title">\${escapeHtml(session.goal)}</span>
             <span class="meta">
               <span class="pill">\${escapeHtml(valueLabel(session.status))}</span>
+              <span class="pill \${session.pending_count ? "warn" : ""}">\${escapeHtml(t("pill.pending", { count: session.pending_count || 0 }))}</span>
               <span class="pill">\${escapeHtml(t("pill.candidates", { count: session.candidate_count || 0 }))}</span>
               <span class="pill accepted">\${escapeHtml(t("pill.accepted", { count: session.accepted_count || 0 }))}</span>
             </span>
@@ -315,14 +377,21 @@ export function webClientScript(textJson = WEB_TEXT_JSON): string {
 
     function renderCandidates() {
       if (state.mainView !== "review") return;
-      const pendingCount = state.candidates.filter((candidate) => candidate.status === "proposed").length;
-      const reviewedCount = state.candidates.length - pendingCount;
-      const sorted = sortedVisibleCandidates();
-      selectVisibleCandidate(sorted);
+      const model = reviewQueueModel({
+        candidates: state.candidates,
+        candidateView: state.candidateView,
+        candidateId: state.candidateId,
+        candidateReview: state.candidateReview
+      });
+      const pendingCount = model.pendingCount;
+      const reviewedCount = model.reviewedCount;
+      const sorted = model.visibleCandidates;
+      state.candidateId = model.selectedCandidateId;
       const session = state.sessions.find((item) => item.id === state.sessionId);
       el("queue-meta").textContent = session
         ? t("meta.sessionCounts", { goal: session.goal, pending: pendingCount, reviewed: reviewedCount })
         : t("meta.noSession");
+      renderReviewSummary(model.summary);
       renderCandidateViewTabs(pendingCount, reviewedCount);
       el("candidates").innerHTML = sorted.length ? sorted.map((candidate) => \`
         <div class="row \${candidate.id === state.candidateId ? "active" : ""} \${candidate.status} \${reviewCssClass(candidate)}">
@@ -596,6 +665,267 @@ export function webClientScript(textJson = WEB_TEXT_JSON): string {
       \`).join("") : '<div class="empty">' + escapeHtml(t("empty.noTraps")) + '</div>';
     }
 
+    function syncEmbeddingDraftFromStatus(status) {
+      const settings = status?.settings || null;
+      const runtime = status?.runtime || null;
+      const provider = settings?.provider || runtime?.provider || "ollama";
+      state.embeddingProviderDraft = provider === "jina" ? "jina" : "ollama";
+      if (state.embeddingProviderDraft === "ollama") {
+        state.embeddingOllama = {
+          endpoint: settings?.endpoint || EMBEDDING_DEFAULTS.endpoint,
+          model: settings?.model || runtime?.model || EMBEDDING_DEFAULTS.model,
+          dimensions: String(settings?.dimensions || runtime?.dimensions || EMBEDDING_DEFAULTS.dimensions)
+        };
+      }
+    }
+
+    function renderEmbeddingsView() {
+      if (state.mainView !== "embeddings") return;
+      const status = state.embeddingStatus;
+      const runtime = status?.runtime || null;
+      const project = status?.project || null;
+      const global = status?.global || null;
+      const provider = runtime?.provider || state.embeddingProviderDraft || "";
+      const providerLabel = provider ? valueLabel(provider) : t("embedding.notConfigured");
+      el("queue-title").textContent = t("title.embeddings");
+      el("candidate-tabs").classList.add("hidden");
+      el("queue-meta").textContent = state.projectRoot && status
+        ? t("meta.embeddingCounts", {
+            provider: providerLabel,
+            projectFresh: project?.fresh ?? 0,
+            projectTotal: project?.total ?? 0,
+            globalFresh: global?.fresh ?? 0,
+            globalTotal: global?.total ?? 0
+          })
+        : t(state.projectRoot ? "embedding.notConfigured" : "meta.noProject");
+
+      if (!state.projectRoot) {
+        el("candidates").innerHTML = '<div class="empty">' + escapeHtml(t("meta.selectProject")) + '</div>';
+        return;
+      }
+
+      el("candidates").innerHTML = \`
+        <div class="summary-grid">
+          \${metric(t("metric.activeProvider"), providerLabel, runtimeStateLabel(runtime))}
+          \${metric(t("metric.activeProfile"), shortProfileId(runtime?.profile_id), runtime?.profile_id || t("embedding.noProfile"))}
+          \${metric(t("metric.projectFresh"), embeddingFreshValue(project), embeddingNeedsReindex(project))}
+          \${metric(t("metric.globalFresh"), embeddingFreshValue(global), embeddingNeedsReindex(global))}
+        </div>
+        <form class="settings-form" id="embedding-form">
+          <div class="status-line">
+            <span class="status-dot \${runtime?.available ? "available" : "unavailable"}" aria-hidden="true"></span>
+            <span class="pill \${runtime?.available ? "accepted" : "warn"}">\${escapeHtml(runtimeStateLabel(runtime))}</span>
+            \${runtime?.profile_id ? '<span class="pill scope">' + escapeHtml(t("embedding.activeProfile")) + '</span>' : ''}
+          </div>
+          <div class="segmented" id="embedding-provider-tabs" aria-label="\${escapeAttr(t("label.provider"))}">
+            <button type="button" data-embedding-provider="ollama" class="\${state.embeddingProviderDraft === "ollama" ? "active" : ""}">\${escapeHtml(valueLabel("ollama"))}</button>
+            <button type="button" data-embedding-provider="jina" class="\${state.embeddingProviderDraft === "jina" ? "active" : ""}">\${escapeHtml(valueLabel("jina"))}</button>
+          </div>
+          <div class="provider-fields \${state.embeddingProviderDraft === "ollama" ? "" : "hidden"}">
+            <div class="field"><label for="embedding-endpoint">\${escapeHtml(t("label.endpoint"))}</label><input id="embedding-endpoint" value="\${escapeAttr(state.embeddingOllama.endpoint)}" placeholder="\${escapeAttr(t("placeholder.endpoint"))}"></div>
+            <div class="field"><label for="embedding-model">\${escapeHtml(t("label.model"))}</label><input id="embedding-model" value="\${escapeAttr(state.embeddingOllama.model)}" placeholder="\${escapeAttr(t("placeholder.model"))}"></div>
+            <div class="field"><label for="embedding-dimensions">\${escapeHtml(t("label.dimensions"))}</label><input id="embedding-dimensions" type="number" min="1" step="1" value="\${escapeAttr(state.embeddingOllama.dimensions)}"></div>
+          </div>
+          <div class="warning \${state.embeddingProviderDraft === "jina" ? "" : "hidden"}">\${escapeHtml(t("hint.jinaEnv"))}</div>
+          <button type="submit" class="primary">\${escapeHtml(t("action.useProvider"))}</button>
+        </form>
+        <div class="section">
+          <div class="title">\${escapeHtml(t("title.reindex"))}</div>
+          <div class="subtle">\${escapeHtml(t("hint.reindexAfterSwitch"))}</div>
+          <div class="actions" style="padding:0;border-top:0;background:transparent">
+            <button type="button" id="embedding-reindex-project" \${state.embeddingReindexing ? "disabled" : ""}>\${escapeHtml(t("action.reindexProject"))}</button>
+            <button type="button" id="embedding-reindex-global" \${state.embeddingReindexing ? "disabled" : ""}>\${escapeHtml(t("action.reindexGlobal"))}</button>
+          </div>
+        </div>
+      \`;
+      bindEmbeddingsControls();
+    }
+
+    function renderEmbeddingsDetail() {
+      if (state.mainView !== "embeddings") return;
+      const status = state.embeddingStatus;
+      const runtime = status?.runtime || null;
+      el("detail-title").textContent = t("title.embeddingDetail");
+      el("detail-meta").textContent = state.projectRoot
+        ? t("meta.embeddingDetail", {
+            profile: runtime?.profile_id || t("embedding.noProfile"),
+            state: runtimeStateLabel(runtime)
+          })
+        : t("meta.selectProject");
+
+      if (!state.projectRoot) {
+        el("detail").innerHTML = '<div class="empty">' + escapeHtml(t("meta.selectProject")) + '</div>';
+        return;
+      }
+      if (!status) {
+        el("detail").innerHTML = '<div class="empty">' + escapeHtml(t("empty.noData")) + '</div>';
+        return;
+      }
+
+      el("detail").innerHTML = \`
+        <div class="scroll">
+          <div class="section">
+            <div class="title">\${escapeHtml(t("title.currentProfile"))}</div>
+            <div class="detail-kv">
+              \${kv(t("label.provider"), runtime?.provider ? valueLabel(runtime.provider) : t("embedding.notConfigured"))}
+              \${kv(t("label.model"), runtime?.model || "-")}
+              \${kv(t("label.dimensions"), runtime?.dimensions ?? "-")}
+              \${kv(t("label.profileId"), runtime?.profile_id || t("embedding.noProfile"))}
+              \${kv(t("label.available"), runtimeStateLabel(runtime))}
+              \${kv(t("label.setupAction"), runtime?.setup_action?.command || "-")}
+            </div>
+            \${runtime?.setup_action ? '<div class="warning">' + escapeHtml(runtime.setup_action.reason) + '</div>' : ''}
+          </div>
+          \${renderEmbeddingScopeDetail("project", status.project)}
+          \${renderEmbeddingScopeDetail("global", status.global)}
+        </div>
+      \`;
+    }
+
+    function bindEmbeddingsControls() {
+      document.querySelectorAll("[data-embedding-provider]").forEach((button) => {
+        button.addEventListener("click", () => {
+          state.embeddingProviderDraft = button.dataset.embeddingProvider === "jina" ? "jina" : "ollama";
+          renderEmbeddingsView();
+        });
+      });
+      const endpoint = el("embedding-endpoint");
+      if (endpoint) endpoint.addEventListener("input", () => state.embeddingOllama.endpoint = endpoint.value);
+      const model = el("embedding-model");
+      if (model) model.addEventListener("input", () => state.embeddingOllama.model = model.value);
+      const dimensions = el("embedding-dimensions");
+      if (dimensions) dimensions.addEventListener("input", () => state.embeddingOllama.dimensions = dimensions.value);
+      const form = el("embedding-form");
+      if (form) {
+        form.addEventListener("submit", async (event) => {
+          event.preventDefault();
+          await useEmbeddingProvider();
+        });
+      }
+      const project = el("embedding-reindex-project");
+      if (project) project.addEventListener("click", () => reindexEmbeddings("project"));
+      const global = el("embedding-reindex-global");
+      if (global) global.addEventListener("click", () => reindexEmbeddings("global"));
+    }
+
+    async function useEmbeddingProvider() {
+      if (!state.projectRoot) return;
+      const body = {
+        projectRoot: state.projectRoot,
+        provider: state.embeddingProviderDraft
+      };
+      if (state.embeddingProviderDraft === "ollama") {
+        const dimensions = Number.parseInt(state.embeddingOllama.dimensions, 10);
+        if (!Number.isInteger(dimensions) || dimensions <= 0) {
+          showStatus(t("status.invalidDimensions"), true);
+          return;
+        }
+        body.endpoint = state.embeddingOllama.endpoint || EMBEDDING_DEFAULTS.endpoint;
+        body.model = state.embeddingOllama.model || EMBEDDING_DEFAULTS.model;
+        body.dimensions = dimensions;
+      }
+      try {
+        const data = await api("/api/embeddings/use", {
+          method: "POST",
+          body: JSON.stringify(body)
+        });
+        state.embeddingSettings = data.settings || data.embeddings || null;
+        state.embeddingStatus = {
+          project_root: data.project_root,
+          settings: state.embeddingSettings,
+          ...data.status
+        };
+        syncEmbeddingDraftFromStatus(state.embeddingStatus);
+        renderEmbeddingsView();
+        renderEmbeddingsDetail();
+        showStatus(t("status.embeddingProviderSaved"));
+      } catch (error) {
+        showStatus(error.message, true);
+      }
+    }
+
+    async function reindexEmbeddings(scope) {
+      if (!state.projectRoot || state.embeddingReindexing) return;
+      state.embeddingReindexing = scope;
+      renderEmbeddingsView();
+      try {
+        const data = await api("/api/embeddings/reindex", {
+          method: "POST",
+          body: JSON.stringify({ projectRoot: state.projectRoot, scope })
+        });
+        state.embeddingStatus = {
+          project_root: data.project_root,
+          settings: state.embeddingSettings,
+          ...data.status
+        };
+        renderEmbeddingsView();
+        renderEmbeddingsDetail();
+        showStatus(t("status.embeddingsReindexed", {
+          generated: data.result?.generated ?? 0,
+          skipped: data.result?.skipped ?? 0
+        }));
+      } catch (error) {
+        showStatus(error.message, true);
+      } finally {
+        state.embeddingReindexing = null;
+        renderEmbeddingsView();
+      }
+    }
+
+    function renderEmbeddingScopeDetail(scope, status) {
+      const title = scope === "project" ? t("title.projectEmbeddings") : t("title.globalEmbeddings");
+      if (!status) {
+        return \`<div class="section"><div class="title">\${escapeHtml(title)}</div><div class="empty">\${escapeHtml(t("empty.noData"))}</div></div>\`;
+      }
+      return \`<div class="section">
+        <div class="title">\${escapeHtml(title)}</div>
+        <div class="detail-kv">
+          \${kv(t("label.total"), status.total)}
+          \${kv(t("label.fresh"), status.fresh)}
+          \${kv(t("label.stale"), status.stale)}
+          \${kv(t("label.missing"), status.missing)}
+        </div>
+        <div class="title">\${escapeHtml(t("title.storedProfiles"))}</div>
+        <div class="profile-list">\${renderEmbeddingProfiles(status.profiles || [])}</div>
+      </div>\`;
+    }
+
+    function renderEmbeddingProfiles(profiles) {
+      return profiles.length ? profiles.map((profile) => \`
+        <div class="profile-row">
+          <div class="row-title">\${escapeHtml(profile.id)}</div>
+          <div class="meta">
+            <span class="pill">\${escapeHtml(valueLabel(profile.provider))}</span>
+            <span class="pill">\${escapeHtml(profile.model)}</span>
+            <span class="pill">\${escapeHtml(String(profile.dimensions))}d</span>
+            <span class="pill">\${escapeHtml(t("label.count"))}: \${escapeHtml(profile.embedding_count)}</span>
+          </div>
+          <div class="subtle">\${escapeHtml(profile.updated_at || "-")}</div>
+        </div>
+      \`).join("") : '<div class="empty">' + escapeHtml(t("empty.noProfiles")) + '</div>';
+    }
+
+    function runtimeStateLabel(runtime) {
+      if (!runtime?.provider) return t("embedding.notConfigured");
+      return runtime.available ? t("embedding.available") : t("embedding.unavailable");
+    }
+
+    function embeddingFreshValue(status) {
+      if (!status) return "-";
+      return String(status.fresh || 0) + "/" + String(status.total || 0);
+    }
+
+    function embeddingNeedsReindex(status) {
+      if (!status || status.total === 0) return t("embedding.noProfile");
+      return status.fresh === status.total ? t("embedding.activeProfile") : t("embedding.profileNeedsReindex");
+    }
+
+    function shortProfileId(profileId) {
+      if (!profileId) return "-";
+      const parts = profileId.split(":");
+      return parts.length >= 4 ? parts[0] + " / " + parts[1] : profileId;
+    }
+
     function metric(label, value, detail) {
       return \`<div class="metric"><div class="metric-label">\${escapeHtml(label)}</div><div class="metric-value">\${escapeHtml(value)}</div><div class="subtle">\${escapeHtml(detail)}</div></div>\`;
     }
@@ -735,20 +1065,29 @@ export function webClientScript(textJson = WEB_TEXT_JSON): string {
       });
     }
 
-    function sortedVisibleCandidates() {
-      return state.candidates
-        .filter(candidateVisible)
-        .sort((a, b) => statusRank(a.status) - statusRank(b.status) || b.quality_score - a.quality_score);
-    }
-
-    function candidateVisible(candidate) {
-      return state.candidateView === "inbox" ? candidate.status === "proposed" : candidate.status !== "proposed";
+    function renderReviewSummary(summary = visibleReviewSummary(state.candidateReview)) {
+      const target = el("review-summary");
+      if (!target) return;
+      if (!summary) {
+        target.classList.add("hidden");
+        target.innerHTML = "";
+        return;
+      }
+      target.classList.remove("hidden");
+      target.innerHTML = \`
+        <div class="review-banner">
+          <strong>\${escapeHtml(t("reviewSummary.pending", { count: summary.pending_count }))}</strong>
+          <span>\${escapeHtml(t("reviewSummary.sessions", { count: summary.pending_session_count }))}</span>
+          <span>\${escapeHtml(t("reviewSummary.quality", { high: summary.high_quality_pending_count, edit: summary.needs_edit_count }))}</span>
+        </div>
+      \`;
     }
 
-    function selectVisibleCandidate(candidates = sortedVisibleCandidates()) {
-      if (!candidates.some((candidate) => candidate.id === state.candidateId)) {
-        state.candidateId = candidates[0]?.id || null;
-      }
+    function hideReviewSummary() {
+      const target = el("review-summary");
+      if (!target) return;
+      target.classList.add("hidden");
+      target.innerHTML = "";
     }
 
     function renderTrapDetail() {
@@ -848,9 +1187,11 @@ export function webClientScript(textJson = WEB_TEXT_JSON): string {
       const candidate = state.candidates.find((item) => item.id === state.candidateId);
       el("detail-meta").textContent = candidate ? candidate.id + " / " + valueLabel(candidate.status) : t("meta.selectCandidate");
       if (!candidate) {
+        state.candidateDirty = false;
         el("detail").innerHTML = '<div class="empty">' + escapeHtml(t("empty.noCandidateSelected")) + '</div>';
         return;
       }
+      state.candidateDirty = false;
       const disabled = candidate.status !== "proposed" ? "disabled" : "";
       el("detail").innerHTML = \`
         <div class="scroll">
@@ -887,6 +1228,7 @@ export function webClientScript(textJson = WEB_TEXT_JSON): string {
         \${renderDetailActions(candidate, disabled)}
       \`;
       bindDetailActions(candidate);
+      bindCandidateFormDirty(candidate);
       bindTrapJumpButtons();
     }
 
@@ -938,9 +1280,29 @@ export function webClientScript(textJson = WEB_TEXT_JSON): string {
         <button id="accept-anyway" \${disabled}>\${escapeHtml(t("action.acceptAnyway"))}</button>
         <input id="supersedes" placeholder="\${escapeAttr(t("placeholder.supersedesId"))}" style="width:150px" \${disabled}>
         <button id="supersede" \${disabled}>\${escapeHtml(t("action.supersede"))}</button>
+        <span id="candidate-draft-state" class="action-hint">\${escapeHtml(t("hint.acceptUsesCurrentDraft"))}</span>
       </div>\`;
     }
 
+    function bindCandidateFormDirty(candidate) {
+      const form = el("candidate-form");
+      if (!form || candidate.status !== "proposed") return;
+      const markDirty = () => {
+        state.candidateDirty = true;
+        renderCandidateDraftState();
+      };
+      form.addEventListener("input", markDirty);
+      form.addEventListener("change", markDirty);
+      renderCandidateDraftState();
+    }
+
+    function renderCandidateDraftState() {
+      const draft = el("candidate-draft-state");
+      if (!draft) return;
+      draft.textContent = state.candidateDirty ? t("hint.unsavedDraftAccepted") : t("hint.acceptUsesCurrentDraft");
+      draft.classList.toggle("dirty", state.candidateDirty);
+    }
+
     function bindDetailActions(candidate) {
       document.querySelectorAll("[data-clean-deleted-candidates]").forEach((button) => {
         button.addEventListener("click", cleanupDeletedCandidates);
@@ -953,6 +1315,7 @@ export function webClientScript(textJson = WEB_TEXT_JSON): string {
             method: "POST",
             body: JSON.stringify(candidatePayload(candidate.id))
           });
+          state.candidateDirty = false;
           await syncAfterMutation(data.candidate.id);
           showStatus(t("status.candidateSaved"));
         } catch (error) {
@@ -983,12 +1346,21 @@ export function webClientScript(textJson = WEB_TEXT_JSON): string {
 
     async function acceptCandidate(extra) {
       try {
+        const payload = el("candidate-form")
+          ? candidatePayload(state.candidateId, extra)
+          : {
+              projectRoot: state.projectRoot,
+              sessionId: state.sessionId,
+              candidateId: state.candidateId,
+              ...extra
+            };
         const data = await api("/api/candidate/accept", {
           method: "POST",
-          body: JSON.stringify({ projectRoot: state.projectRoot, sessionId: state.sessionId, candidateId: state.candidateId, ...extra })
+          body: JSON.stringify(payload)
         });
         await syncAfterMutation(data.candidate.id);
         state.conflicts = [];
+        state.candidateDirty = false;
         showStatus(t("status.candidateAccepted"));
       } catch (error) {
         if (error.payload?.possible_conflicts) {
@@ -1003,25 +1375,30 @@ export function webClientScript(textJson = WEB_TEXT_JSON): string {
       }
     }
 
-    function candidatePayload(candidateId) {
-      const form = new FormData(el("candidate-form"));
-      return {
+    function candidatePayload(candidateId, extra = {}) {
+      return reviewCandidateMutationPayload({
         projectRoot: state.projectRoot,
         sessionId: state.sessionId,
         candidateId,
-        trap: {
-          title: String(form.get("title") || ""),
-          category: String(form.get("category") || ""),
-          scope: String(form.get("scope") || ""),
-          severity: String(form.get("severity") || ""),
-          tags: splitList(form.get("tags")),
-          path_globs: splitList(form.get("path_globs")),
-          module: blankToNull(form.get("module")),
-          owner: blankToNull(form.get("owner")),
-          context: String(form.get("context") || ""),
-          mistake: String(form.get("mistake") || ""),
-          fix: String(form.get("fix") || "")
-        }
+        trap: reviewCandidateTrapDraft(candidateFormFields()),
+        extra
+      });
+    }
+
+    function candidateFormFields() {
+      const form = new FormData(el("candidate-form"));
+      return {
+        title: form.get("title"),
+        category: form.get("category"),
+        scope: form.get("scope"),
+        severity: form.get("severity"),
+        tags: form.get("tags"),
+        path_globs: form.get("path_globs"),
+        module: form.get("module"),
+        owner: form.get("owner"),
+        context: form.get("context"),
+        mistake: form.get("mistake"),
+        fix: form.get("fix")
       };
     }
 
@@ -1046,6 +1423,12 @@ export function webClientScript(textJson = WEB_TEXT_JSON): string {
     }
 
     el("refresh").addEventListener("click", refreshAll);
+    el("sidebar-toggle").addEventListener("click", () => {
+      setSidebarCollapsed(!state.sidebarCollapsed);
+    });
+    el("queue-toggle").addEventListener("click", () => {
+      setQueueCollapsed(!state.queueCollapsed);
+    });
     document.querySelectorAll("[data-locale]").forEach((button) => {
       button.addEventListener("click", () => setLocale(button.dataset.locale));
     });
@@ -1059,6 +1442,8 @@ export function webClientScript(textJson = WEB_TEXT_JSON): string {
           await loadTraps();
         } else if (state.mainView === "insights") {
           await loadInsightTraps();
+        } else if (state.mainView === "embeddings") {
+          await loadEmbeddings();
         } else {
           await loadCandidates();
         }
@@ -1086,6 +1471,8 @@ export function webClientScript(textJson = WEB_TEXT_JSON): string {
         state.trapKey = null;
         state.trapDetails = {};
         state.insightTraps = [];
+        state.embeddingStatus = null;
+        state.embeddingSettings = null;
         el("project-path").value = "";
         renderProjects();
         await loadSessions();
@@ -1128,10 +1515,6 @@ export function webClientScript(textJson = WEB_TEXT_JSON): string {
         </div>\`).join("")}</div>\`;
     }
 
-    function statusRank(status) {
-      return status === "proposed" ? 0 : status === "accepted" ? 1 : 2;
-    }
-
     function reviewLabel(candidate) {
       const review = candidate.review;
       if (!review || review.status === "pending") return t("review.pending");
@@ -1147,15 +1530,6 @@ export function webClientScript(textJson = WEB_TEXT_JSON): string {
       return String(candidate.review?.status || candidate.status).replace(/_/g, "-");
     }
 
-    function splitList(value) {
-      return String(value || "").split(",").map((item) => item.trim()).filter(Boolean);
-    }
-
-    function blankToNull(value) {
-      const text = String(value || "").trim();
-      return text ? text : null;
-    }
-
     function escapeHtml(value) {
       return String(value).replace(/[&<>"']/g, (char) => ({ "&": "&amp;", "<": "&lt;", ">": "&gt;", '"': "&quot;", "'": "&#39;" }[char]));
     }
@@ -1164,5 +1538,6 @@ export function webClientScript(textJson = WEB_TEXT_JSON): string {
       return escapeHtml(value);
     }
 
+    initShellResizers();
     refreshAll();`;
 }