pi-interview 0.8.0 → 0.8.2

package/form/script.js

@@ -529,6 +529,33 @@
     return typeof option === "string" ? option : option.label;
   }
 
+  function normalizeRecommendationMatchText(value) {
+    return value.normalize("NFC").trim();
+  }
+
+  function resolveRecommendedLabels(recommended, options) {
+    if (!recommended || !Array.isArray(options)) return [];
+
+    const labelsByNormalized = new Map();
+    options.forEach((option) => {
+      const label = getOptionLabel(option);
+      const normalized = normalizeRecommendationMatchText(label);
+      if (!normalized || labelsByNormalized.has(normalized)) return;
+      labelsByNormalized.set(normalized, label);
+    });
+
+    const resolved = [];
+    const candidates = Array.isArray(recommended) ? recommended : [recommended];
+    candidates.forEach((candidate) => {
+      if (typeof candidate !== "string") return;
+      const match = labelsByNormalized.get(normalizeRecommendationMatchText(candidate));
+      if (match && !resolved.includes(match)) {
+        resolved.push(match);
+      }
+    });
+    return resolved;
+  }
+
   function questionCanClarifyOption(question) {
     return (question.type === "single" || question.type === "multi")
       && Array.isArray(question.options)
@@ -629,11 +656,12 @@
   }
 
   function syncRecommendations(question, options) {
-    const optionLabels = options.map((option) => getOptionLabel(option));
     if (!question.recommended) return;
+    const resolvedRecommended = resolveRecommendedLabels(question.recommended, options);
 
     if (question.type === "single") {
-      if (typeof question.recommended === "string" && optionLabels.includes(question.recommended)) {
+      if (resolvedRecommended.length > 0) {
+        question.recommended = resolvedRecommended[0];
         return;
       }
       delete question.recommended;
@@ -647,15 +675,12 @@
       return;
     }
 
-    const nextRecommended = (Array.isArray(question.recommended)
-      ? question.recommended
-      : [question.recommended]).filter((option) => optionLabels.includes(option));
-    if (nextRecommended.length === 0) {
+    if (resolvedRecommended.length === 0) {
       delete question.recommended;
       delete question.conviction;
       return;
     }
-    question.recommended = nextRecommended;
+    question.recommended = resolvedRecommended;
   }
 
   function makeClientId(prefix = "id") {
@@ -738,6 +763,12 @@
     return askModels[0]?.provider || "";
   }
 
+  const ASK_DEPTH_OPTIONS = [
+    { key: "quick", label: "Quick" },
+    { key: "standard", label: "Standard" },
+    { key: "deep", label: "Deep" },
+  ];
+
   function createDefaultActiveInsight(questionId, optionKey) {
     const selectedModel = askModels.some((model) => model.value === defaultAskModel)
       ? defaultAskModel
@@ -754,6 +785,7 @@
       advancedOpen: false,
       selectedProvider: parsed.provider || getFirstProvider(),
       selectedModel,
+      selectedDepth: "standard",
       abortController: null,
     };
   }
@@ -1021,6 +1053,7 @@
           optionKey,
           prompt,
           model: modelOverride && modelOverride !== defaultAskModel ? modelOverride : null,
+          depth: active.selectedDepth || "standard",
         }),
         signal: active.abortController.signal,
       });
@@ -1180,22 +1213,27 @@
     const metaRow = document.createElement("div");
     metaRow.className = "option-insight-meta-row";
 
-    const model = document.createElement("div");
-    model.className = "option-insight-model";
-    model.textContent = getInsightModelLabel(active);
-    metaRow.appendChild(model);
-
-    const advancedToggle = document.createElement("button");
-    advancedToggle.type = "button";
-    advancedToggle.className = "option-insight-advanced-toggle";
-    advancedToggle.textContent = active.advancedOpen ? "Advanced model settings ▾" : "Advanced model settings ▸";
-    advancedToggle.addEventListener("click", (event) => {
+    const modelBadge = document.createElement("button");
+    modelBadge.type = "button";
+    modelBadge.className = "option-insight-model-badge";
+    const badgeLabel = document.createElement("span");
+    badgeLabel.className = "badge-label";
+    badgeLabel.textContent = "Model";
+    const badgeValue = document.createElement("span");
+    badgeValue.textContent = getInsightModelLabel(active);
+    const badgeCaret = document.createElement("span");
+    badgeCaret.className = "badge-caret";
+    badgeCaret.textContent = active.advancedOpen ? "▾" : "▸";
+    modelBadge.appendChild(badgeLabel);
+    modelBadge.appendChild(badgeValue);
+    modelBadge.appendChild(badgeCaret);
+    modelBadge.addEventListener("click", (event) => {
       event.preventDefault();
       event.stopPropagation();
       active.advancedOpen = !active.advancedOpen;
       replaceQuestionOptionList(question, getQuestionValue(question), optionKey);
     });
-    metaRow.appendChild(advancedToggle);
+    metaRow.appendChild(modelBadge);
 
     panel.appendChild(metaRow);
 
@@ -1203,38 +1241,63 @@
       const advanced = document.createElement("div");
       advanced.className = "option-insight-advanced";
 
-      const providerSelect = document.createElement("select");
-      providerSelect.className = "option-insight-select";
       const providers = [...new Set(askModels.map((model) => model.provider))];
+      const providerRow = document.createElement("div");
+      providerRow.className = "option-insight-provider-row";
       providers.forEach((provider) => {
-        const option = document.createElement("option");
-        option.value = provider;
-        option.textContent = providerLabel(provider);
-        providerSelect.appendChild(option);
-      });
-      providerSelect.value = active.selectedProvider || providers[0] || "";
-      providerSelect.addEventListener("change", () => {
-        active.selectedProvider = providerSelect.value;
-        const providerModels = getModelsForProvider(active.selectedProvider);
-        active.selectedModel = providerModels[0]?.value || null;
-        replaceQuestionOptionList(question, getQuestionValue(question), optionKey);
+        const btn = document.createElement("button");
+        btn.type = "button";
+        const isSelected = (active.selectedProvider || providers[0] || "") === provider;
+        btn.className = "option-insight-provider-btn" + (isSelected ? " is-selected" : "");
+        btn.textContent = providerLabel(provider);
+        btn.addEventListener("click", (event) => {
+          event.preventDefault();
+          event.stopPropagation();
+          active.selectedProvider = provider;
+          const providerModels = getModelsForProvider(provider);
+          active.selectedModel = providerModels[0]?.value || null;
+          replaceQuestionOptionList(question, getQuestionValue(question), optionKey);
+        });
+        providerRow.appendChild(btn);
       });
-      advanced.appendChild(providerSelect);
+      advanced.appendChild(providerRow);
 
-      const modelSelect = document.createElement("select");
-      modelSelect.className = "option-insight-select";
       const providerModels = getModelsForProvider(active.selectedProvider);
+      const modelRow = document.createElement("div");
+      modelRow.className = "option-insight-model-row";
       providerModels.forEach((modelOption) => {
-        const option = document.createElement("option");
-        option.value = modelOption.value;
-        option.textContent = modelOption.label;
-        modelSelect.appendChild(option);
+        const btn = document.createElement("button");
+        btn.type = "button";
+        const isSelected = active.selectedModel === modelOption.value;
+        btn.className = "option-insight-model-btn" + (isSelected ? " is-selected" : "");
+        btn.textContent = modelOption.label;
+        btn.addEventListener("click", (event) => {
+          event.preventDefault();
+          event.stopPropagation();
+          active.selectedModel = modelOption.value;
+          replaceQuestionOptionList(question, getQuestionValue(question), optionKey);
+        });
+        modelRow.appendChild(btn);
       });
-      modelSelect.value = active.selectedModel || providerModels[0]?.value || "";
-      modelSelect.addEventListener("change", () => {
-        active.selectedModel = modelSelect.value;
+      advanced.appendChild(modelRow);
+
+      const depthRow = document.createElement("div");
+      depthRow.className = "option-insight-depth-row";
+      ASK_DEPTH_OPTIONS.forEach((depth) => {
+        const btn = document.createElement("button");
+        btn.type = "button";
+        const isSelected = active.selectedDepth === depth.key;
+        btn.className = "option-insight-depth-btn" + (isSelected ? " is-selected" : "");
+        btn.textContent = depth.label;
+        btn.addEventListener("click", (event) => {
+          event.preventDefault();
+          event.stopPropagation();
+          active.selectedDepth = depth.key;
+          replaceQuestionOptionList(question, getQuestionValue(question), optionKey);
+        });
+        depthRow.appendChild(btn);
       });
-      advanced.appendChild(modelSelect);
+      advanced.appendChild(depthRow);
 
       panel.appendChild(advanced);
     }
@@ -1255,6 +1318,20 @@
 
     panel.appendChild(actions);
 
+    if (active.loading && !active.result) {
+      const loading = document.createElement("div");
+      loading.className = "option-insight-loading";
+      const spinner = document.createElement("span");
+      spinner.className = "option-insight-spinner";
+      spinner.textContent = "Thinking";
+      loading.appendChild(spinner);
+      const dots = document.createElement("span");
+      dots.className = "option-insight-dots";
+      dots.textContent = "...";
+      loading.appendChild(dots);
+      panel.appendChild(loading);
+    }
+
     if (active.error) {
       const error = document.createElement("div");
       error.className = "option-insight-error";
@@ -1429,12 +1506,7 @@
     text.className = "option-item-label";
     text.textContent = optionLabel;
 
-    const recommended = question.recommended;
-    const recommendedList = Array.isArray(recommended)
-      ? recommended
-      : recommended
-        ? [recommended]
-        : [];
+    const recommendedList = resolveRecommendedLabels(question.recommended, question.options || []);
     const shouldPreselect = recommendedList.length > 0 && question.conviction !== "slight";
 
     if (recommendedList.includes(optionLabel)) {
@@ -3515,9 +3587,7 @@
     }
   }
 
-  // Pre-populate form from saved interview answers
   function populateFromSavedAnswers(savedAnswers) {
-    // Convert ResponseItem[] to Record for existing populateForm()
     const valueMap = {};
     savedAnswers.forEach((ans) => {
       const question = questions.find((q) => q.id === ans.id);
@@ -3527,7 +3597,6 @@
     });
     populateForm(valueMap);
 
-    // Restore attachments to attachPathState
     savedAnswers.forEach((ans) => {
       if (ans.attachments && ans.attachments.length > 0) {
         attachPathState.set(ans.id, [...ans.attachments]);
@@ -3543,7 +3612,6 @@
       }
     });
 
-    // Restore image paths for image-type questions
     savedAnswers.forEach((ans) => {
       const question = questions.find((q) => q.id === ans.id);
       if (question?.type === "image" && ans.value) {
@@ -3556,7 +3624,6 @@
       }
     });
 
-    // Update done states for multi-select
     questions.forEach((q) => {
       if (q.type === "multi") {
         updateDoneState(q.id);
@@ -3575,13 +3642,13 @@
       const reader = new FileReader();
       reader.onload = () => {
         if (typeof reader.result !== "string") {
-          reject(new Error("Failed to read file"));
+          reject(new Error(`Failed to read file: unexpected FileReader result type ${typeof reader.result}`));
           return;
         }
         const parts = reader.result.split(",");
         resolve(parts[1] || "");
       };
-      reader.onerror = () => reject(new Error("Failed to read file"));
+      reader.onerror = () => reject(new Error(reader.error?.message || "Failed to read file"));
       reader.readAsDataURL(file);
     });
   }
@@ -3622,7 +3689,6 @@
     return { responses, images };
   }
 
-  // Save interview snapshot
   async function saveInterview(options = {}) {
     const { submitted = false } = options;
 
@@ -3707,8 +3773,6 @@
         return;
       }
 
-      // Auto-save on successful submit (fire-and-forget)
-      // Note: data is window.__INTERVIEW_DATA__, result is server response
       if (data.autoSaveOnSubmit !== false) {
         saveInterview({ submitted: true });
       }

package/form/styles.css

@@ -2018,7 +2018,6 @@ button {
 
 .option-insight-meta-row {
   display: flex;
-  justify-content: space-between;
   align-items: center;
   gap: 10px;
 }
@@ -2029,6 +2028,39 @@ button {
   color: var(--fg-muted);
 }
 
+.option-insight-model-badge {
+  font-family: var(--font-body);
+  font-size: 11px;
+  font-weight: 600;
+  padding: 5px 12px;
+  border-radius: 999px;
+  border: 1px solid var(--border-muted);
+  background: var(--bg-elevated);
+  color: var(--fg-muted);
+  cursor: pointer;
+  transition: border-color 0.12s, background 0.12s, color 0.12s;
+  display: inline-flex;
+  align-items: center;
+  gap: 6px;
+}
+
+.option-insight-model-badge:hover {
+  color: var(--fg);
+  border-color: var(--card-accent, var(--accent));
+  background: color-mix(in srgb, var(--card-accent, var(--accent)) 8%, var(--bg-elevated));
+}
+
+.option-insight-model-badge .badge-caret {
+  font-size: 14px;
+  opacity: 0.85;
+  line-height: 1;
+}
+
+.option-insight-model-badge .badge-label {
+  font-weight: 500;
+  opacity: 0.55;
+}
+
 .option-insight-chips {
   display: flex;
   flex-wrap: wrap;
@@ -2066,8 +2098,7 @@ button {
   background: color-mix(in srgb, var(--card-accent, var(--accent)) 10%, transparent);
 }
 
-.option-insight-input,
-.option-insight-select {
+.option-insight-input {
   width: 100%;
   border: 1px solid var(--border-muted);
   border-radius: 12px;
@@ -2076,23 +2107,129 @@ button {
   color: var(--fg);
   font-family: var(--font-body);
   font-size: 13px;
-}
-
-.option-insight-input {
   min-height: 72px;
   resize: vertical;
 }
 
-.option-insight-advanced-toggle {
-  padding: 0;
-  border: none;
+.option-insight-advanced {
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+}
+
+.option-insight-provider-row {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 6px;
+}
+
+.option-insight-provider-btn {
+  font-family: var(--font-body);
+  font-size: 11px;
+  font-weight: 600;
+  padding: 4px 10px;
+  border-radius: 999px;
+  border: 1px solid var(--border-muted);
+  background: transparent;
   color: var(--fg-muted);
+  cursor: pointer;
+  transition: border-color 0.12s, background 0.12s, color 0.12s;
 }
 
-.option-insight-advanced {
-  display: grid;
-  grid-template-columns: 1fr 1fr;
-  gap: 8px;
+.option-insight-provider-btn:hover {
+  color: var(--fg);
+  border-color: var(--accent);
+}
+
+.option-insight-provider-btn.is-selected {
+  box-shadow: inset 0 -2px 0 0 var(--card-accent, var(--accent));
+  border-color: var(--card-accent, var(--accent));
+  color: var(--card-accent, var(--accent));
+}
+
+.option-insight-model-row {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 6px;
+}
+
+.option-insight-model-btn {
+  font-family: var(--font-body);
+  font-size: 11px;
+  font-weight: 600;
+  padding: 4px 10px;
+  border-radius: 999px;
+  border: 1px solid var(--border-muted);
+  background: transparent;
+  color: var(--fg-muted);
+  cursor: pointer;
+  transition: border-color 0.12s, background 0.12s, color 0.12s;
+}
+
+.option-insight-model-btn:hover {
+  color: var(--fg);
+  border-color: var(--accent);
+}
+
+.option-insight-model-btn.is-selected {
+  border-color: color-mix(in srgb, var(--card-accent, var(--accent)) 55%, transparent);
+  color: var(--card-accent, var(--accent));
+  background: color-mix(in srgb, var(--card-accent, var(--accent)) 10%, transparent);
+}
+
+.option-insight-depth-row {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 6px;
+  padding-top: 6px;
+  border-top: 1px solid var(--border-muted);
+}
+
+.option-insight-depth-btn {
+  font-family: var(--font-body);
+  font-size: 11px;
+  font-weight: 600;
+  padding: 4px 10px;
+  border-radius: 999px;
+  border: 1px solid var(--border-muted);
+  background: transparent;
+  color: var(--fg-muted);
+  cursor: pointer;
+  transition: border-color 0.12s, background 0.12s, color 0.12s;
+}
+
+.option-insight-depth-btn:hover {
+  color: var(--fg);
+  border-color: var(--accent);
+}
+
+.option-insight-depth-btn.is-selected {
+  box-shadow: inset 0 -2px 0 0 var(--card-accent, var(--accent));
+  border-color: var(--card-accent, var(--accent));
+  color: var(--card-accent, var(--accent));
+}
+
+.option-insight-loading {
+  display: flex;
+  align-items: center;
+  gap: 4px;
+  padding: 12px 0;
+  font-size: 13px;
+  color: var(--fg-muted);
+}
+
+.option-insight-spinner {
+  font-weight: 600;
+  color: var(--card-accent, var(--accent));
+}
+
+.option-insight-dots {
+  animation: option-insight-pulse 1.2s ease-in-out infinite;
+}
+
+@keyframes option-insight-pulse {
+  0%, 100% { opacity: 0.3; }
+  50% { opacity: 1; }
 }
 
 .option-insight-actions,
@@ -2210,10 +2347,6 @@ button {
     align-items: flex-start;
     flex-direction: column;
   }
-
-  .option-insight-advanced {
-    grid-template-columns: 1fr;
-  }
 }
 
 /* Side-by-side layout */

package/index.ts

@@ -18,7 +18,7 @@ import {
 	type AskModelOption,
 	type OptionInsightResult,
 } from "./server.js";
-import { getOptionLabel, isRichOption, validateQuestions, sanitizeLLMJSON, type OptionValue, type QuestionsFile } from "./schema.js";
+import { getOptionLabel, isRichOption, validateQuestions, sanitizeLLMJSON, type OptionValue, type Question, type QuestionsFile } from "./schema.js";
 import { loadSettings, type InterviewThemeSettings } from "./settings.js";
 
 interface GlimpseWindow {
@@ -302,8 +302,9 @@ export function selectGenerateModels<T extends GenerateModelCandidate>(
 	return { primary: availableModels[0] ?? null, fallback: null };
 }
 
-function buildAskModelsData(
+export function buildAskModelsData(
 	availableModels: Model<Api>[],
+	currentModel: Model<Api> | null,
 	primaryModel: Model<Api> | null,
 	fallbackModel: Model<Api> | null,
 ): AskModelOption[] {
@@ -321,16 +322,15 @@ function buildAskModelsData(
 		});
 	};
 
+	addModel(currentModel);
 	addModel(primaryModel);
 	addModel(fallbackModel);
-	for (const model of availableModels) {
-		addModel(model);
+	for (const modelRef of PREFERRED_GENERATE_MODELS) {
+		const preferredModel = findModelByRef(availableModels, modelRef);
+		addModel(preferredModel);
 	}
 
-	return models.sort((a, b) => {
-		if (a.provider !== b.provider) return a.provider.localeCompare(b.provider);
-		return a.label.localeCompare(b.label);
-	});
+	return models;
 }
 
 export function extractGenerateResponseText(
@@ -715,28 +715,100 @@ function hasAnswerValue(value: ResponseItem["value"]): boolean {
 	return typeof value === "string" && value.trim() !== "";
 }
 
-function formatResponses(responses: ResponseItem[]): string {
-	if (responses.length === 0) return "(none)";
-	return responses
-		.map((resp) => {
-			const value = formatResponseValue(resp.value);
-			let line = `- ${resp.id}: ${value}`;
-			if (resp.attachments && resp.attachments.length > 0) {
-				line += ` [attachments: ${resp.attachments.join(", ")}]`;
+function hasResponseContent(response: ResponseItem): boolean {
+	return hasAnswerValue(response.value) || !!response.attachments?.length;
+}
+
+function summarizeResponseValue(question: Question, response: ResponseItem): string {
+	if (question.type === "image") {
+		if (Array.isArray(response.value)) {
+			return response.value.length === 1 ? "1 image attached" : `${response.value.length} images attached`;
+		}
+		if (typeof response.value === "string" && response.value.trim() !== "") {
+			return "1 image attached";
+		}
+	}
+
+	if (hasAnswerValue(response.value)) {
+		return String(formatResponseValue(response.value));
+	}
+
+	if (response.attachments?.length) {
+		return response.attachments.length === 1 ? "1 attachment included" : `${response.attachments.length} attachments included`;
+	}
+
+	return "";
+}
+
+interface AgentResponseItem {
+	id: string;
+	question: string;
+	type: Question["type"];
+	value: ResponseItem["value"];
+	attachments?: string[];
+}
+
+export function buildAnsweredAgentResponseItems(
+	responses: ResponseItem[],
+	questions: Question[],
+): AgentResponseItem[] {
+	const responseById = new Map<string, ResponseItem>();
+	for (const response of responses) {
+		if (!response || typeof response.id !== "string") continue;
+		responseById.set(response.id, response);
+	}
+
+	return questions
+		.map((question) => {
+			const response = responseById.get(question.id);
+			if (!response || !hasResponseContent(response)) return null;
+			return {
+				id: question.id,
+				question: question.question,
+				type: question.type,
+				value: response.value,
+				attachments: response.attachments?.length ? [...response.attachments] : undefined,
+			} satisfies AgentResponseItem;
+		})
+		.filter((item): item is AgentResponseItem => item !== null);
+}
+
+export function formatAnsweredResponsesForAgent(
+	responses: ResponseItem[],
+	questions: Question[],
+): string {
+	const answeredItems = buildAnsweredAgentResponseItems(responses, questions);
+	if (answeredItems.length === 0) return "(none)";
+	const questionById = new Map(questions.map((question) => [question.id, question]));
+	const responseById = new Map(responses.map((response) => [response.id, response]));
+
+	const summary = answeredItems
+		.map((item) => {
+			const question = questionById.get(item.id);
+			const response = responseById.get(item.id);
+			if (!question || !response) {
+				return `- ${item.question}`;
+			}
+			let line = `- ${item.question}: ${summarizeResponseValue(question, response)}`;
+			if (item.attachments?.length) {
+				line += ` [attachments: ${item.attachments.join(", ")}]`;
 			}
 			return line;
 		})
 		.join("\n");
+
+	const json = JSON.stringify(answeredItems, null, 2);
+	return `${summary}\n\nStructured response data:\n\n\`\`\`json\n${json}\n\`\`\``;
 }
 
 function hasAnyAnswers(responses: ResponseItem[]): boolean {
 	if (!responses || responses.length === 0) return false;
-	return responses.some((resp) => !!resp && resp.value != null && hasAnswerValue(resp.value));
+	return responses.some((resp) => !!resp && hasResponseContent(resp));
 }
 
 function filterAnsweredResponses(responses: ResponseItem[]): ResponseItem[] {
 	if (!responses) return [];
-	return responses.filter((resp) => !!resp && resp.value != null && hasAnswerValue(resp.value));
+	return responses.filter((resp) => !!resp && hasResponseContent(resp));
 }
 
 export default function (pi: ExtensionAPI) {
@@ -815,7 +887,7 @@ export default function (pi: ExtensionAPI) {
 				ctx.model ?? null,
 				availableGenerateModels,
 			);
-			const askModels = buildAskModelsData(availableGenerateModels, generateModel, fallbackGenerateModel);
+			const askModels = buildAskModelsData(availableGenerateModels, ctx.model ?? null, generateModel, fallbackGenerateModel);
 			const defaultAskModel = generateModel ? formatModelRef(generateModel) : null;
 
 			// Expand ~ in snapshotDir if present
@@ -855,21 +927,21 @@ export default function (pi: ExtensionAPI) {
 
 					let text = "";
 					if (status === "completed") {
-						text = `User completed the interview form.\n\nResponses:\n${formatResponses(responses)}`;
+						text = `User completed the interview form.\n\nAnswered responses:\n${formatAnsweredResponsesForAgent(responses, questionsData.questions)}`;
 					} else if (status === "cancelled") {
 						if (cancelReason === "stale") {
 							text =
 								"Interview session ended due to lost heartbeat.\n\nQuestions saved to: ~/.pi/interview-recovery/";
 						} else if (hasAnyAnswers(responses)) {
 							const answered = filterAnsweredResponses(responses);
-							text = `User cancelled the interview with partial responses:\n${formatResponses(answered)}\n\nProceed with these inputs and use your best judgment for unanswered questions.`;
+							text = `User cancelled the interview with partial responses.\n\nAnswered responses:\n${formatAnsweredResponsesForAgent(answered, questionsData.questions)}\n\nProceed with these inputs and use your best judgment for unanswered questions.`;
 						} else {
 							text = "User skipped the interview without providing answers. Proceed with your best judgment - use recommended options where specified, make reasonable choices elsewhere. Don't ask for clarification unless absolutely necessary.";
 						}
 					} else if (status === "timeout") {
 						if (hasAnyAnswers(responses)) {
 							const answered = filterAnsweredResponses(responses);
-							text = `Interview form timed out after ${timeoutSeconds} seconds.\n\nPartial responses before timeout:\n${formatResponses(answered)}\n\nQuestions saved to: ~/.pi/interview-recovery/\n\nProceed with these inputs and use your best judgment for unanswered questions.`;
+							text = `Interview form timed out after ${timeoutSeconds} seconds.\n\nAnswered responses before timeout:\n${formatAnsweredResponsesForAgent(answered, questionsData.questions)}\n\nQuestions saved to: ~/.pi/interview-recovery/\n\nProceed with these inputs and use your best judgment for unanswered questions.`;
 						} else {
 							text = `Interview form timed out after ${timeoutSeconds} seconds.\n\nQuestions saved to: ~/.pi/interview-recovery/`;
 						}
@@ -1112,15 +1184,21 @@ export default function (pi: ExtensionAPI) {
 						return selectedModel;
 					};
 
-					onOptionInsight = async (questionId, option, prompt, modelOverride, generateSignal) => {
+					onOptionInsight = async (questionId, option, prompt, modelOverride, depth, generateSignal) => {
 						const question = questionsData.questions.find((q) => q.id === questionId);
 						if (!question) throw new Error(`Unknown question: ${questionId}`);
 						const optionText = getOptionLabel(option);
 						const optionContent = typeof option === "string" ? null : option.content;
 
+						const depthInstructions = {
+							quick: "Keep the analysis very brief: a one-sentence summary and at most one bullet point.",
+							standard: "Be concrete and concise. A short summary and a few bullet points.",
+							deep: "Provide a thorough analysis: detailed summary, multiple bullet points covering tradeoffs, risks, and edge cases.",
+						};
+
 						const questionPrompt = [
 							"Analyze this single interview answer option.",
-							"Be concrete and concise.",
+							depthInstructions[depth as keyof typeof depthInstructions] || depthInstructions.standard,
 							"Explain what is good or risky about the option, and suggest a rewrite only if it would materially improve clarity.",
 							"Return ONLY JSON with summary, bullets, and optional suggestedText.",
 							"",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pi-interview",
-  "version": "0.8.0",
+  "version": "0.8.2",
   "description": "Interactive interview form extension for pi coding agent",
   "author": "Nico Bailon",
   "license": "MIT",

package/server.ts

@@ -250,6 +250,7 @@ export interface InterviewServerCallbacks {
 		option: OptionValue,
 		prompt: string,
 		modelOverride: string | null,
+		depth: string,
 		signal: AbortSignal,
 	) => Promise<OptionInsightResult>;
 }
@@ -431,12 +432,41 @@ function ensureQuestionId(
 	return { ok: true, question };
 }
 
-function syncRecommendations(question: Question, options: OptionValue[]): void {
+function normalizeRecommendationMatchText(value: string): string {
+	return value.normalize("NFC").trim();
+}
+
+function resolveRecommendedLabels(
+	recommended: Question["recommended"],
+	options: OptionValue[]
+): string[] {
+	if (!recommended) return [];
 	const optionLabels = options.map((option) => getOptionLabel(option));
+	const labelsByNormalized = new Map<string, string>();
+	for (const label of optionLabels) {
+		const normalized = normalizeRecommendationMatchText(label);
+		if (!normalized || labelsByNormalized.has(normalized)) continue;
+		labelsByNormalized.set(normalized, label);
+	}
+
+	const resolved: string[] = [];
+	for (const candidate of Array.isArray(recommended) ? recommended : [recommended]) {
+		if (typeof candidate !== "string") continue;
+		const match = labelsByNormalized.get(normalizeRecommendationMatchText(candidate));
+		if (match && !resolved.includes(match)) {
+			resolved.push(match);
+		}
+	}
+	return resolved;
+}
+
+function syncRecommendations(question: Question, options: OptionValue[]): void {
 	if (!question.recommended) return;
+	const resolvedRecommended = resolveRecommendedLabels(question.recommended, options);
 
 	if (question.type === "single") {
-		if (typeof question.recommended === "string" && optionLabels.includes(question.recommended)) {
+		if (resolvedRecommended.length > 0) {
+			question.recommended = resolvedRecommended[0];
 			return;
 		}
 		delete question.recommended;
@@ -450,15 +480,12 @@ function syncRecommendations(question: Question, options: OptionValue[]): void {
 		return;
 	}
 
-	const nextRecommended = (Array.isArray(question.recommended)
-		? question.recommended
-		: [question.recommended]).filter((option) => optionLabels.includes(option));
-	if (nextRecommended.length === 0) {
+	if (resolvedRecommended.length === 0) {
 		delete question.recommended;
 		delete question.conviction;
 		return;
 	}
-	question.recommended = nextRecommended;
+	question.recommended = resolvedRecommended;
 }
 
 function makeOptionKey(): string {
@@ -923,9 +950,7 @@ function recommendedIndicatorHtml(q: Question): string {
 }
 
 function savedAnswerItemHtml(text: string, q: Question): string {
-	const recs = Array.isArray(q.recommended)
-		? q.recommended
-		: q.recommended ? [q.recommended] : [];
+	const recs = q.options ? resolveRecommendedLabels(q.recommended, q.options) : [];
 	const indicator = recs.includes(text) ? " " + recommendedIndicatorHtml(q) : "";
 	return escapeHtml(text) + indicator;
 }
@@ -1932,6 +1957,7 @@ export async function startInterviewServer(
 					optionKey?: string;
 					prompt?: string;
 					model?: string | null;
+					depth?: string;
 				};
 
 				if (typeof payload.questionId !== "string") {
@@ -1973,6 +1999,7 @@ export async function startInterviewServer(
 						option,
 						payload.prompt.trim(),
 						typeof payload.model === "string" ? payload.model : null,
+						typeof payload.depth === "string" ? payload.depth : "standard",
 						controller.signal,
 					);
 					sendJson(res, 200, { ok: true, optionText, ...result });