@alexleekt/pi-ask-user-glimpse 0.3.2 → 0.5.0

package/package.json

@@ -1,11 +1,12 @@
 {
     "name": "@alexleekt/pi-ask-user-glimpse",
-    "version": "0.3.2",
-    "description": "Pi extension that replaces ask_user with rich native WebView dialogs via glimpseui and shadcn/ui",
+    "version": "0.5.0",
+    "description": "Ask better questions. Get better answers. Rich native WebView dialogs for the Pi agent.",
     "type": "module",
     "keywords": [
         "pi-package",
         "pi-extension",
+        "pi",
         "glimpseui",
         "ask_user",
         "interactive"
@@ -30,8 +31,8 @@
     },
     "files": [
         "index.ts",
+        "constants",
         "tool",
-        "fallback",
         "shared",
         "types",
         "dist",
@@ -41,25 +42,73 @@
         "LICENSE"
     ],
     "scripts": {
-        "build": "npm run build:css && npm run build:webview",
-        "build:css": "npx tailwindcss -c ./webview/tailwind.config.js -i ./webview/src/index.css -o ./webview/src/index.generated.css --content './webview/index.html,./webview/src/**/*.{js,ts,jsx,tsx}'",
-        "build:webview": "npx vite build --config ./webview/vite.config.ts",
+        "build": "wireit",
+        "build:css": "wireit",
+        "build:webview": "wireit",
         "typecheck": "tsc --noEmit",
         "check": "npm pack --dry-run",
         "prepack": "npm run build",
         "dev:webview": "npx vite --config ./webview/vite.config.ts",
-        "validate": "npx tsx scripts/validate.ts",
-        "validate:gui": "npx tsx scripts/validate.ts --gui"
+        "test": "vitest run",
+        "test:watch": "vitest",
+        "test:coverage": "vitest run --coverage",
+        "test:e2e": "playwright test",
+        "test:e2e:ui": "playwright test --ui",
+        "validate": "test -f dist/index.html && grep -q 'ASK_USER_PAYLOAD' dist/index.html && echo \"✓ dist/index.html ready\" || echo \"✗ Run npm run build first\"",
+        "validate:gui": "echo \"validate:gui requires manual testing with pi extension load\""
+    },
+    "wireit": {
+        "build": {
+            "dependencies": [
+                "build:css",
+                "build:webview"
+            ]
+        },
+        "build:css": {
+            "command": "npx tailwindcss -c ./webview/tailwind.config.js -i ./webview/src/index.css -o ./webview/src/index.generated.css --content './webview/index.html,./webview/src/**/*.{js,ts,jsx,tsx}'",
+            "files": [
+                "./webview/src/**/*.css",
+                "./webview/src/**/*.{ts,tsx,js,jsx}",
+                "./webview/tailwind.config.js",
+                "./webview/postcss.config.js",
+                "./webview/index.html"
+            ],
+            "output": [
+                "./webview/src/index.generated.css"
+            ]
+        },
+        "build:webview": {
+            "command": "npx vite build --config ./webview/vite.config.ts",
+            "files": [
+                "./webview/src/**/*.{ts,tsx}",
+                "./webview/index.html",
+                "./webview/vite.config.ts",
+                "./webview/tsconfig.json",
+                "./webview/postcss.config.js",
+                "./webview/src/index.generated.css"
+            ],
+            "output": [
+                "./dist/index.html"
+            ],
+            "dependencies": [
+                "build:css"
+            ]
+        }
     },
     "dependencies": {
         "@alexleekt/pi-shared": "^0.1.0",
         "glimpseui": "^0.8.1"
     },
     "devDependencies": {
+        "@playwright/test": "^1.60.0",
+        "@testing-library/jest-dom": "^6.9.1",
+        "@testing-library/react": "^16.3.2",
         "@types/react": "^18.3.0",
         "@types/react-dom": "^18.3.0",
         "@vitejs/plugin-react": "^4.3.0",
+        "@vitest/coverage-v8": "^4.1.7",
         "autoprefixer": "^10.4.20",
+        "jsdom": "^29.1.1",
         "marked": "^15.0.12",
         "mermaid": "^11.15.0",
         "playwright": "^1.60.0",
@@ -69,7 +118,9 @@
         "tailwindcss": "^3.4.14",
         "typescript": "^5.6.0",
         "vite": "^5.4.0",
-        "vite-plugin-singlefile": "^2.0.0"
+        "vite-plugin-singlefile": "^2.0.0",
+        "vitest": "^4.1.7",
+        "wireit": "^0.14.12"
     },
     "peerDependencies": {
         "@earendil-works/pi-ai": "*",

package/shared/ask-user.ts

@@ -9,6 +9,7 @@
 export interface QuestionOption {
     title: string;
     description?: string;
+    recommended?: boolean;
 }
 
 export interface Question {
@@ -18,16 +19,23 @@ export interface Question {
     allowMultiple?: boolean;
 }
 
+export type ThemeMode = "light" | "dark" | "system";
+export type AnimationLevel = "none" | "minimal" | "all";
+
 export interface AskUserPayload {
     type: "single-select" | "multi-select" | "questionnaire" | "freeform";
     question: string;
     context?: string;
+    contextFormat?: "markdown" | "html";
     options: QuestionOption[];
     questions?: Question[];
     allowMultiple: boolean;
     allowFreeform: boolean;
     allowComment: boolean;
     allowSkip?: boolean;
+    sessionName?: string;
+    theme?: ThemeMode;
+    animationLevel?: AnimationLevel;
 }
 
 export interface QuestionnaireDetail {
@@ -36,3 +44,6 @@ export interface QuestionnaireDetail {
     kind: "selection" | "freeform";
     comment?: string;
 }
+
+/** Sentinel title used for the freeform "not listed" option in select dialogs. */
+export const FREEFORM_OPTION_TITLE = "My answer isn't listed above";

package/tool/ask-user.ts

@@ -4,300 +4,21 @@ import { dirname, join } from "node:path";
 import { fileURLToPath } from "node:url";
 import type { ExtensionContext } from "@earendil-works/pi-coding-agent";
 import { prompt } from "glimpseui";
-import { terminalPrompt } from "../fallback/terminal-prompt.js";
-import type { AskUserPayload, Question } from "../shared/ask-user.js";
+import type {
+    AnimationLevel,
+    AskUserPayload,
+    Question,
+    ThemeMode,
+} from "../shared/ask-user.js";
 import { formatResponse } from "./response-formatter.js";
 
 const _require = createRequire(import.meta.url);
 const __dirname = dirname(fileURLToPath(import.meta.url));
 
-/** ~100 common English stopwords for title extraction. */
-const STOPWORDS = new Set([
-    "a",
-    "an",
-    "the",
-    "is",
-    "are",
-    "was",
-    "were",
-    "be",
-    "been",
-    "being",
-    "have",
-    "has",
-    "had",
-    "do",
-    "does",
-    "did",
-    "will",
-    "would",
-    "could",
-    "should",
-    "may",
-    "might",
-    "must",
-    "shall",
-    "can",
-    "need",
-    "ought",
-    "used",
-    "to",
-    "of",
-    "in",
-    "for",
-    "on",
-    "with",
-    "at",
-    "by",
-    "from",
-    "as",
-    "into",
-    "through",
-    "during",
-    "before",
-    "after",
-    "above",
-    "below",
-    "between",
-    "under",
-    "again",
-    "further",
-    "then",
-    "once",
-    "here",
-    "there",
-    "when",
-    "where",
-    "why",
-    "how",
-    "all",
-    "each",
-    "few",
-    "more",
-    "most",
-    "other",
-    "some",
-    "such",
-    "no",
-    "nor",
-    "not",
-    "only",
-    "own",
-    "same",
-    "so",
-    "than",
-    "too",
-    "very",
-    "just",
-    "and",
-    "but",
-    "if",
-    "or",
-    "because",
-    "until",
-    "while",
-    "which",
-    "what",
-    "who",
-    "whom",
-    "this",
-    "that",
-    "these",
-    "those",
-    "am",
-    "it",
-    "its",
-    "we",
-    "our",
-    "you",
-    "your",
-    "they",
-    "their",
-    "them",
-    "he",
-    "him",
-    "his",
-    "she",
-    "her",
-    "i",
-    "me",
-    "my",
-    "mine",
-    "us",
-    "any",
-    "both",
-    "either",
-    "neither",
-    "one",
-    "two",
-    "first",
-    "last",
-    "another",
-    "every",
-    "many",
-    "much",
-    "several",
-    "let",
-    "new",
-    "use",
-    "using",
-    "make",
-    "made",
-    "get",
-    "got",
-    "go",
-    "going",
-    "want",
-    "wanted",
-    "like",
-    "liked",
-    "know",
-    "knew",
-    "known",
-    "think",
-    "thought",
-    "see",
-    "saw",
-    "seen",
-    "come",
-    "came",
-    "give",
-    "gave",
-    "given",
-    "take",
-    "took",
-    "taken",
-    "find",
-    "found",
-    "say",
-    "said",
-    "tell",
-    "told",
-    "ask",
-    "asked",
-    "work",
-    "worked",
-    "seem",
-    "seemed",
-    "feel",
-    "felt",
-    "try",
-    "tried",
-    "leave",
-    "left",
-    "call",
-    "called",
-    "good",
-    "well",
-    "better",
-    "best",
-    "bad",
-    "worse",
-    "worst",
-    "old",
-    "long",
-    "great",
-    "little",
-    "right",
-    "left",
-    "big",
-    "high",
-    "different",
-    "important",
-    "same",
-    "able",
-    "next",
-    "early",
-    "young",
-    "public",
-    "free",
-    "real",
-    "easy",
-    "clear",
-    "recent",
-    "local",
-    "social",
-    "full",
-    "small",
-    "large",
-    "possible",
-    "particular",
-    "available",
-    "special",
-    "certain",
-    "personal",
-    "open",
-    "general",
-    "enough",
-    "probably",
-    "actually",
-    "especially",
-    "finally",
-    "usually",
-    "perhaps",
-    "almost",
-    "simply",
-    "quickly",
-    "recently",
-    "already",
-    "eventually",
-    "suddenly",
-    "certainly",
-    "definitely",
-    "absolutely",
-    "completely",
-    "totally",
-    "entirely",
-    "exactly",
-    "specifically",
-    "particularly",
-    "especially",
-    "mainly",
-    "mostly",
-    "partly",
-    "fully",
-    "nearly",
-    "quite",
-    "rather",
-    "pretty",
-    "fairly",
-    "really",
-    "even",
-    "still",
-    "yet",
-    "ever",
-    "never",
-    "always",
-    "sometimes",
-    "often",
-    "usually",
-    "frequently",
-    "rarely",
-    "generally",
-    "typically",
-    "normally",
-    "largely",
-    "potentially",
-    "theoretically",
-    "practically",
-    "basically",
-    "essentially",
-    "fundamentally",
-    "primarily",
-    "chiefly",
-    "principally",
-    "partially",
-    "half",
-    "quarter",
-    "double",
-    "single",
-    "multiple",
-    "various",
-    "hundred",
-    "thousand",
-    "million",
-    "billion",
-]);
+import { STOPWORDS } from "../constants/stopwords.js";
+
+/** Warn once per process when Glimpse is unavailable. */
+let _warnedGlimpseUnavailable = false;
 
 /** Extract a short title from a question by removing stopwords.
  *  Falls back to first 5 words if nothing meaningful remains.
@@ -325,12 +46,17 @@ function summarizeTitle(question: string, maxWords = 3): string {
 
 function resolveWebviewHtml(): string {
     const distPath = join(__dirname, "..", "dist", "index.html");
+    console.log(`[pi-ask-user-glimpse] Loading webview from: ${distPath}`);
     try {
-        return readFileSync(distPath, "utf-8");
+        const html = readFileSync(distPath, "utf-8");
+        const hasNewCode = html.includes('items-center justify-between');
+        console.log(`[pi-ask-user-glimpse] Webview has new code: ${hasNewCode}`);
+        return html;
     } catch {
         // Fallback for development: resolve from package root
         const pkgRoot = dirname(_require.resolve("../package.json"));
         const fallbackPath = join(pkgRoot, "dist", "index.html");
+        console.log(`[pi-ask-user-glimpse] Fallback: ${fallbackPath}`);
         try {
             return readFileSync(fallbackPath, "utf-8");
         } catch (err) {
@@ -348,7 +74,11 @@ function resolveWebviewHtml(): string {
 export interface AskUserParams {
     question: string;
     context?: string;
-    options?: (string | { title: string; description?: string })[];
+    contextFormat?: "markdown" | "html";
+    options?: (
+        | string
+        | { title: string; description?: string; recommended?: boolean }
+    )[];
     questions?: Question[];
     allowMultiple?: boolean;
     allowFreeform?: boolean;
@@ -356,12 +86,20 @@ export interface AskUserParams {
     allowSkip?: boolean;
     displayMode?: string;
     followCursor?: boolean;
+    theme?: ThemeMode;
+    animationLevel?: AnimationLevel;
+}
+
+export interface AskUserMetadata {
+    theme?: string;
+    animationLevel?: string;
 }
 
 export async function askUserHandler(
     params: AskUserParams,
     signal: AbortSignal | undefined,
     ctx: ExtensionContext,
+    onMetadata?: (metadata: AskUserMetadata) => void,
 ) {
     if (signal?.aborted) {
         return {
@@ -377,7 +115,11 @@ export async function askUserHandler(
 
     const normalizedOptions = (params.options ?? []).map((opt) => {
         if (typeof opt === "string") return { title: opt };
-        return { title: opt.title, description: opt.description };
+        return {
+            title: opt.title,
+            description: opt.description,
+            recommended: opt.recommended,
+        };
     });
 
     const hasOptions = normalizedOptions.length > 0;
@@ -413,12 +155,16 @@ export async function askUserHandler(
         type: payloadType,
         question,
         context,
+        contextFormat: params.contextFormat,
         options: normalizedOptions,
         questions: params.questions,
         allowMultiple,
         allowFreeform,
         allowComment,
         allowSkip: params.allowSkip,
+        sessionName: ctx.sessionManager.getSessionName(),
+        theme: params.theme,
+        animationLevel: params.animationLevel,
     };
 
     let result: Record<string, unknown> | null = null;
@@ -435,36 +181,60 @@ export async function askUserHandler(
                 .replace(/&/g, "\\u0026"),
         );
 
-        const options: Record<string, unknown> = {
+        const sessionName = ctx.sessionManager.getSessionName();
+        const questionTitle = summarizeTitle(params.question);
+        const title = sessionName
+            ? `Pi · ${sessionName} · ${questionTitle}`
+            : `Pi · ${questionTitle}`;
+
+        const windowOptions: Record<string, unknown> = {
             width: 1200,
             height: 900,
-            title: summarizeTitle(params.question),
+            title: title.length > 60 ? `${title.slice(0, 57)}…` : title,
         };
 
         if (params.followCursor) {
-            options.followCursor = true;
+            windowOptions.followCursor = true;
         }
 
-        result = (await prompt(html, options)) as Record<
+        result = (await prompt(html, windowOptions)) as Record<
             string,
             unknown
         > | null;
         if (result === null || result?.__cancelled === true) {
             cancelled = true;
             result = null;
+        } else if (result && onMetadata) {
+            onMetadata({
+                theme: result.__theme as string | undefined,
+                animationLevel: result.__animationLevel as string | undefined,
+            });
         }
     } catch (err) {
-        // Glimpse unavailable — fall back to terminal prompt
-        const fallbackResult = await terminalPrompt(
-            payload,
-            ctx.hasUI ? ctx.ui : undefined,
-        );
-        if (fallbackResult === null) {
-            cancelled = true;
-        } else {
-            result = fallbackResult;
+        // Glimpse unavailable — fast-exit and warn once
+        if (!_warnedGlimpseUnavailable) {
+            _warnedGlimpseUnavailable = true;
+            console.warn(
+                "[pi-ask-user-glimpse] Glimpse unavailable — " +
+                    "ask_user will return errors. " +
+                    "Install glimpseui or run in a UI-enabled environment.",
+            );
         }
-        error = err instanceof Error ? err.message : String(err);
+        return {
+            content: [
+                {
+                    type: "text" as const,
+                    text: "No UI available for ask_user dialog. Please ask the user directly in free-form text.",
+                },
+            ],
+            details: {
+                question: params.question,
+                options: normalizedOptions.map((o) => o.title),
+                response: null,
+                cancelled: true,
+                error: "No UI available",
+            },
+        };
     }
 
     return formatResponse(

package/tool/response-formatter.ts

@@ -60,6 +60,7 @@ function buildResponse(
                       };
                   })
                 : [],
+            additionalComments: pickString(result.additionalComments),
         };
     }
 
@@ -79,14 +80,14 @@ function buildResponse(
 
 function responseToText(response: AskResponse): string {
     if (response.kind === "freeform") {
-        return response.text ?? "";
+        return response.text?.trim() || "No response";
     }
     const lines: string[] = [];
     const selections = response.selections ?? [];
     if (selections.length > 0) lines.push(selections.join(", "));
     if (response.comment) lines.push(`Comment: ${response.comment}`);
     if (response.additionalComments) lines.push(`Additional Comments: ${response.additionalComments}`);
-    return lines.join("\n\n");
+    return lines.join("\n\n") || "No response";
 }
 
 export function formatResponse(