@juspay/shooter 1.5.0 → 1.6.1

package/src/lib/modules/client/dashboard/summarizer.ts

@@ -0,0 +1,205 @@
+// Session summarizer for the live dashboard.
+// Loads NeuroLink SDK from CDN and runs AI summarization client-side in the browser.
+// Uses NeuroLink's createGoogleGenerativeAI + generateText bridge (AI SDK-compatible).
+// The GOOGLE_AI_API_KEY is injected into window.process.env by +page.svelte before use.
+
+// ── Types ────────────────────────────────────────────────────────────────────
+
+import type { SummaryContext, SummaryResult } from '$lib/types';
+
+import { installFetchProxy } from '$lib/modules/client/neurolink/fetch-proxy';
+import { detectActiveProvider } from '$lib/modules/client/neurolink/provider-config';
+
+// ── CDN loading ───────────────────────────────────────────────────────────────
+
+const NEUROLINK_CDN_URL = 'https://unpkg.com/@juspay/neurolink/dist/browser/neurolink.min.js';
+
+// Significant event types that trigger conversational tone
+const SIGNIFICANT_EVENT_TYPES = new Set(['agent-question', 'terminal-exited', 'tool-failed']);
+
+// Singleton SDK promise — load once, reuse across all summarizer instances
+let sdkPromise: null | Promise<unknown> = null;
+
+// Cached NeuroLink instance
+let cachedNL: unknown = null;
+let cachedProvider: null | { model: string; provider: string } = null;
+
+export class SessionSummarizer {
+  /** Generate a summary for the given session context using NeuroLink client-side. */
+  async summarize(context: SummaryContext): Promise<SummaryResult> {
+    const tone = this.chooseTone(context);
+    const prompt =
+      tone === 'conversational'
+        ? this.buildConversationalPrompt(context)
+        : this.buildStatusReportPrompt(context);
+
+    try {
+      const nl = await getNeuroLink();
+
+      if (!nl) {
+        console.log('[SessionSummarizer] NeuroLink not available, using fallback.');
+        return { generatedAt: new Date().toISOString(), text: this.fallbackText(context), tone };
+      }
+
+      const result = await (
+        nl as Record<string, (opts: Record<string, unknown>) => Promise<{ content?: string }>>
+      ).generate({
+        input: { text: prompt },
+        ...(cachedProvider
+          ? { model: cachedProvider.model, provider: cachedProvider.provider }
+          : {}),
+      });
+      const text = str(result.content ?? '').trim() || this.fallbackText(context);
+      return { generatedAt: new Date().toISOString(), text, tone };
+    } catch (err) {
+      console.warn(
+        '[SessionSummarizer] summarize failed:',
+        err instanceof Error ? err.message : String(err)
+      );
+      return { generatedAt: new Date().toISOString(), text: this.fallbackText(context), tone };
+    }
+  }
+
+  /** Build the conversational prompt. */
+  private buildConversationalPrompt(context: SummaryContext): string {
+    const goal = context.goal ?? 'unknown';
+    const events = context.recentEvents
+      .map((e) => {
+        const parts: string[] = [e.type];
+        if (e.tool) {
+          parts.push(`tool=${e.tool}`);
+        }
+        if (e.error) {
+          parts.push(`error=${e.error}`);
+        }
+        if (e.command) {
+          parts.push(`command=${e.command}`);
+        }
+        return parts.join(' ');
+      })
+      .join(', ');
+
+    return `You are monitoring a coding session. Based on the context below, write ONE sentence (max 100 chars) describing what's happening in plain English. Be specific about what Claude did or is doing.
+
+Goal: ${goal}
+Recent events: ${events}
+Conversation excerpt: ${context.conversationExcerpt}
+Status: ${context.status}
+
+One sentence only, no quotes, no markdown.`;
+  }
+
+  /** Build the status-report prompt. */
+  private buildStatusReportPrompt(context: SummaryContext): string {
+    const toolNames = context.recentEvents.flatMap((e) => (e.tool ? [e.tool] : [])).join(', ');
+
+    return `You are monitoring a coding session. Write a brief status update (max 60 chars) in the format "Doing X, Y done". Focus on the action.
+
+Recent tool calls: ${toolNames || 'none'}
+Status: ${context.status}
+
+Short phrase only, no quotes.`;
+  }
+
+  /** Choose tone based on event severity. */
+  private chooseTone(context: SummaryContext): 'conversational' | 'status-report' {
+    if (context.status === 'error' || context.errorCount > 0) {
+      return 'conversational';
+    }
+    const hasSignificantEvent = context.recentEvents.some((e) =>
+      SIGNIFICANT_EVENT_TYPES.has(e.type)
+    );
+    if (hasSignificantEvent) {
+      return 'conversational';
+    }
+    return 'status-report';
+  }
+
+  /** Produce a simple fallback when NeuroLink is unavailable. */
+  private fallbackText(context: SummaryContext): string {
+    const tools = context.recentEvents.flatMap((e) => (e.tool ? [e.tool] : []));
+    const unique = [...new Set(tools)];
+    if (unique.length > 0) {
+      return `Running: ${unique.join(', ')} (${context.toolCallCount} tools)`;
+    }
+    return `Status: ${context.status} — ${context.toolCallCount} tool calls`;
+  }
+}
+
+// ── Private helpers ───────────────────────────────────────────────────────────
+
+/** Get or create the NeuroLink instance with auto-detected provider. */
+async function getNeuroLink(): Promise<unknown> {
+  if (cachedNL) {
+    return cachedNL;
+  }
+
+  installFetchProxy();
+
+  const NL = (await getSdk()) as Record<string, unknown>;
+  const NeuroLinkClass = NL.NeuroLink as
+    | (new (opts: Record<string, unknown>) => unknown)
+    | undefined;
+  if (!NeuroLinkClass) {
+    return null;
+  }
+
+  const serverFlags = (window as unknown as Record<string, Record<string, boolean>>).__aiProviders;
+  const preferredProvider = (
+    window as unknown as Record<string, Record<string, Record<string, string>>>
+  ).process?.env?.NEUROLINK_PROVIDER;
+
+  const active = detectActiveProvider(serverFlags, preferredProvider);
+  if (!active) {
+    console.warn('[SessionSummarizer] No AI provider configured');
+    return null;
+  }
+
+  // Proxy providers: inject dummy env vars so SDK validation passes.
+  // The fetch proxy strips these and injects real keys server-side.
+  const proc = (window as unknown as { process?: { env?: Record<string, string> } }).process;
+  if (proc?.env && serverFlags) {
+    if (serverFlags['google-ai'] && !proc.env.GOOGLE_AI_API_KEY) {
+      proc.env.GOOGLE_AI_API_KEY = 'proxy-via-server';
+    }
+    if (serverFlags.anthropic && !proc.env.ANTHROPIC_API_KEY) {
+      proc.env.ANTHROPIC_API_KEY = 'proxy-via-server';
+    }
+    if (serverFlags.openai && !proc.env.OPENAI_API_KEY) {
+      proc.env.OPENAI_API_KEY = 'proxy-via-server';
+    }
+    if (serverFlags.mistral && !proc.env.MISTRAL_API_KEY) {
+      proc.env.MISTRAL_API_KEY = 'proxy-via-server';
+    }
+  }
+
+  cachedNL = new NeuroLinkClass({ provider: active.provider });
+  cachedProvider = active;
+  console.log(`[SessionSummarizer] Using provider: ${active.provider}/${active.model}`);
+  return cachedNL;
+}
+
+function getSdk(): Promise<unknown> {
+  if (!sdkPromise) {
+    sdkPromise = import(/* @vite-ignore */ NEUROLINK_CDN_URL).catch((err: unknown) => {
+      console.warn('[SessionSummarizer] Failed to load NeuroLink SDK:', err);
+      // Reset so next call retries
+      sdkPromise = null;
+      throw err;
+    });
+  }
+  return sdkPromise;
+}
+
+// ── Utilities ────────────────────────────────────────────────────────────────
+
+/** Safely coerce an unknown value to string, avoiding [object Object]. */
+function str(v: unknown): string {
+  if (typeof v === 'string') {
+    return v;
+  }
+  if (typeof v === 'number' || typeof v === 'boolean') {
+    return String(v);
+  }
+  return '';
+}

package/src/lib/modules/client/neurolink/fetch-proxy.ts

@@ -0,0 +1,70 @@
+// Intercept fetch calls to CORS-restricted AI provider endpoints and route
+// them through the SvelteKit server proxy at /api/neurolink-proxy.
+// This is a browser-only workaround — in Node/Electron there's no CORS.
+
+import { getApiKey } from '$lib/modules/client/common';
+
+const PROXY_PREFIXES: Record<string, string> = {
+  'https://api.anthropic.com/': 'anthropic',
+  'https://api.mistral.ai/': 'mistral',
+  'https://api.openai.com/': 'openai',
+  'https://generativelanguage.googleapis.com/': 'google-ai',
+};
+
+let installed = false;
+
+/** Install the fetch proxy. Safe to call multiple times — only installs once. */
+export function installFetchProxy(): void {
+  if (installed || typeof globalThis === 'undefined') {
+    return;
+  }
+  installed = true;
+
+  const originalFetch = globalThis.fetch.bind(globalThis);
+
+  globalThis.fetch = async (input: RequestInfo | URL, init?: RequestInit): Promise<Response> => {
+    const url = typeof input === 'string' ? input : input instanceof URL ? input.href : input.url;
+
+    const provider = Object.entries(PROXY_PREFIXES).find(([prefix]) => url.startsWith(prefix))?.[1];
+
+    if (!provider) {
+      return originalFetch(input, init);
+    }
+
+    // Strip provider auth headers — server re-injects from env
+    const headers: Record<string, string> = {};
+    const rawHeaders = init?.headers ?? (input instanceof Request ? input.headers : {});
+    const iterable =
+      rawHeaders instanceof Headers
+        ? rawHeaders
+        : Object.entries(rawHeaders as Record<string, string>);
+    for (const [k, v] of iterable) {
+      const lk = k.toLowerCase();
+      if (lk !== 'x-api-key' && lk !== 'authorization') {
+        headers[k] = v;
+      }
+    }
+
+    let body: unknown;
+    try {
+      body = JSON.parse(
+        (init?.body as string) ?? (input instanceof Request ? await input.text() : '{}')
+      );
+    } catch {
+      body = {};
+    }
+
+    // Authenticate with our own server using the Shooter API key
+    const apiKey = getApiKey();
+    const proxyHeaders: Record<string, string> = { 'Content-Type': 'application/json' };
+    if (apiKey) {
+      proxyHeaders.Authorization = `Bearer ${apiKey}`;
+    }
+
+    return originalFetch('/api/neurolink-proxy', {
+      body: JSON.stringify({ body, headers, provider, url }),
+      headers: proxyHeaders,
+      method: 'POST',
+    });
+  };
+}

package/src/lib/modules/client/neurolink/provider-config.ts

@@ -0,0 +1,111 @@
+// Provider registry — single source of truth for all NeuroLink providers.
+// Used by summarizers, settings page, setup wizard, and playground.
+
+import type { ProviderId } from '$lib/types';
+
+export const PROVIDERS = [
+  {
+    cors: 'proxy' as const,
+    envKeys: ['GOOGLE_AI_API_KEY'],
+    id: 'google-ai' as const,
+    label: 'Google AI',
+    model: 'gemini-3.1-flash-lite-preview',
+  },
+  {
+    cors: 'proxy' as const,
+    envKeys: ['ANTHROPIC_API_KEY'],
+    id: 'anthropic' as const,
+    label: 'Anthropic',
+    model: 'claude-haiku-4-5-20251001',
+  },
+  {
+    cors: 'proxy' as const,
+    envKeys: ['OPENAI_API_KEY'],
+    id: 'openai' as const,
+    label: 'OpenAI',
+    model: 'gpt-4o-mini',
+  },
+  {
+    cors: 'proxy' as const,
+    envKeys: ['MISTRAL_API_KEY'],
+    id: 'mistral' as const,
+    label: 'Mistral',
+    model: 'mistral-small-2506',
+  },
+  {
+    cors: 'direct' as const,
+    envKeys: ['LITELLM_API_KEY', 'LITELLM_BASE_URL'],
+    extraEnvKeys: ['LITELLM_MODEL'],
+    id: 'litellm' as const,
+    label: 'LiteLLM',
+    model: 'open-large',
+  },
+] as const;
+
+// ProviderId imported from $lib/types — canonical definition lives there.
+
+/**
+ * Detect which provider to use based on available env vars.
+ * Checks window.process.env for browser-side keys (litellm)
+ * and trusts server-passed flags for proxy providers (google-ai, anthropic, openai, mistral).
+ *
+ * @param serverFlags - Per-provider availability from +page.server.ts
+ * @param preferredProvider - Optional override (from NEUROLINK_PROVIDER env var)
+ */
+export function detectActiveProvider(
+  serverFlags?: Record<string, boolean>,
+  preferredProvider?: string
+): null | { model: string; provider: ProviderId } {
+  // If user explicitly set a preferred provider, try it first — but only if
+  // credentials are actually available (serverFlags for proxy providers,
+  // browser env for direct providers). Without this gate a misconfigured
+  // NEUROLINK_PROVIDER would bypass the fallback loop and silently fail.
+  if (preferredProvider) {
+    const prov = PROVIDERS.find((p) => p.id === preferredProvider);
+    if (prov) {
+      if (prov.cors === 'direct') {
+        const env =
+          typeof window !== 'undefined'
+            ? ((window as unknown as { process?: { env?: Record<string, string> } }).process?.env ??
+              {})
+            : {};
+        if (prov.envKeys.every((k) => Boolean(env[k]))) {
+          return { model: prov.model, provider: prov.id };
+        }
+      } else if (serverFlags?.[prov.id]) {
+        return { model: prov.model, provider: prov.id };
+      }
+    }
+  }
+
+  const env =
+    typeof window !== 'undefined'
+      ? ((window as unknown as { process?: { env?: Record<string, string> } }).process?.env ?? {})
+      : {};
+
+  for (const prov of PROVIDERS) {
+    if (prov.cors === 'direct') {
+      // Check browser env vars
+      const hasKey = prov.envKeys.every((k) => Boolean(env[k]));
+      if (hasKey) {
+        return { model: prov.model, provider: prov.id };
+      }
+    } else {
+      // Check server-passed flags
+      if (serverFlags?.[prov.id]) {
+        return { model: prov.model, provider: prov.id };
+      }
+    }
+  }
+
+  return null;
+}
+
+/** Get the provider entry by ID. */
+export function getProvider(id: ProviderId): (typeof PROVIDERS)[number] {
+  const provider = PROVIDERS.find((p) => p.id === id);
+  if (!provider) {
+    throw new Error(`Unknown provider: ${id}`);
+  }
+  return provider;
+}

package/src/lib/modules/client/terminal/ChatView.svelte

@@ -1,9 +1,12 @@
 <script lang="ts">
   import type {
+    ChatViewProps,
     ConversationMessage,
+    GroupedPart,
     MessagePart,
+    ToolGroup,
     ToolUsePart,
-  } from '$lib/modules/server/sessions/types';
+  } from '$lib/types';
 
   import { browser } from '$app/environment';
   import { getToolDescription, renderMarkdown } from '$lib/modules/client/common';
@@ -22,23 +25,12 @@
     sessionEnded = false,
     showHeader = false,
     showInput = true,
-  }: {
-    connectionState?: 'connected' | 'connecting' | 'disconnected' | 'idle' | 'reconnecting';
-    messages: ConversationMessage[];
-    newestFirst?: boolean;
-    onCancel?: () => void;
-    onSendInput?: (text: string) => void;
-    sendDisabled?: boolean;
-    sessionEnded?: boolean;
-    showHeader?: boolean;
-    showInput?: boolean;
-  } = $props();
+  }: ChatViewProps = $props();
 
   // When sendDisabled is explicitly provided, it overrides the connectionState check.
   // Otherwise fall back to the existing behaviour (disabled when not connected).
   const isInputDisabled = $derived(
-    sessionEnded ||
-    (sendDisabled !== undefined ? sendDisabled : connectionState !== 'connected')
+    sessionEnded || (sendDisabled !== undefined ? sendDisabled : connectionState !== 'connected')
   );
 
   // --- Local state ---
@@ -51,9 +43,7 @@
 
   // --- Show Details toggle (persisted in localStorage) ---
   const SHOW_DETAILS_KEY = 'shooter:chatview:showDetails';
-  let showDetails = $state(
-    browser ? localStorage.getItem(SHOW_DETAILS_KEY) === 'true' : false,
-  );
+  let showDetails = $state(browser ? localStorage.getItem(SHOW_DETAILS_KEY) === 'true' : false);
 
   function toggleShowDetails(): void {
     showDetails = !showDetails;
@@ -63,22 +53,15 @@
   }
 
   // --- Tool grouping ---
-  interface ToolGroup {
-    groupId: string;
-    summary: string;
-    tools: ToolUsePart[];
-    type: 'tool_group';
-  }
-
-  type GroupedPart = MessagePart | ToolGroup;
-
   function groupMessageParts(parts: MessagePart[], messageId: string): GroupedPart[] {
     const result: GroupedPart[] = [];
     let currentToolGroup: ToolUsePart[] = [];
     let groupIndex = 0;
 
     function flushToolGroup(): void {
-      if (currentToolGroup.length === 0) {return;}
+      if (currentToolGroup.length === 0) {
+        return;
+      }
 
       if (currentToolGroup.length === 1) {
         // Single tool -- render as normal tool card, no group wrapper
@@ -223,7 +206,7 @@
         {#if !sessionEnded && onCancel}
           <Button
             classes="btn-danger btn-sm"
-            onclick={() => {
+            onclick={(): void => {
               onCancel();
             }}
             text="Cancel"
@@ -280,8 +263,10 @@
                   <div class="chat-tool-group">
                     <div
                       class="chat-tool-group-header"
-                      onclick={() => { toggleGroup(gpart.groupId); }}
-                      onkeydown={(e) => {
+                      onclick={(): void => {
+                        toggleGroup(gpart.groupId);
+                      }}
+                      onkeydown={(e: KeyboardEvent): void => {
                         if (e.key === 'Enter' || e.key === ' ') {
                           e.preventDefault();
                           toggleGroup(gpart.groupId);
@@ -290,7 +275,9 @@
                       role="button"
                       tabindex="0"
                     >
-                      <span class="chat-tool-group-chevron" class:expanded={groupExpanded}>&#9654;</span>
+                      <span class="chat-tool-group-chevron" class:expanded={groupExpanded}
+                        >&#9654;</span
+                      >
                       <span class="chat-tool-group-summary">{gpart.summary}</span>
                     </div>
                     {#if groupExpanded}
@@ -301,8 +288,10 @@
                           <div class="chat-tool-card">
                             <div
                               class="chat-tool-header"
-                              onclick={() => { toggleTool(toolId); }}
-                              onkeydown={(e) => {
+                              onclick={(): void => {
+                                toggleTool(toolId);
+                              }}
+                              onkeydown={(e: KeyboardEvent): void => {
                                 if (e.key === 'Enter' || e.key === ' ') {
                                   e.preventDefault();
                                   toggleTool(toolId);
@@ -311,9 +300,13 @@
                               role="button"
                               tabindex="0"
                             >
-                              <span class="chat-tool-chevron" class:expanded={isExpanded}>&#9654;</span>
+                              <span class="chat-tool-chevron" class:expanded={isExpanded}
+                                >&#9654;</span
+                              >
                               <Pill text={tool.toolName} classes="pill-tool-name" />
-                              <span class="chat-tool-description">{getToolDescriptionFromPart(tool)}</span>
+                              <span class="chat-tool-description"
+                                >{getToolDescriptionFromPart(tool)}</span
+                              >
                             </div>
                             <Accordion expand={isExpanded}>
                               {#if isExpanded}
@@ -337,8 +330,10 @@
                   <div class="chat-tool-card">
                     <div
                       class="chat-tool-header"
-                      onclick={() => { toggleTool(toolId); }}
-                      onkeydown={(e) => {
+                      onclick={(): void => {
+                        toggleTool(toolId);
+                      }}
+                      onkeydown={(e: KeyboardEvent): void => {
                         if (e.key === 'Enter' || e.key === ' ') {
                           e.preventDefault();
                           toggleTool(toolId);
@@ -363,8 +358,10 @@
                   <div class="chat-thinking">
                     <div
                       class="chat-thinking-header"
-                      onclick={() => { toggleTool(thinkId); }}
-                      onkeydown={(e) => {
+                      onclick={(): void => {
+                        toggleTool(thinkId);
+                      }}
+                      onkeydown={(e: KeyboardEvent): void => {
                         if (e.key === 'Enter' || e.key === ' ') {
                           e.preventDefault();
                           toggleTool(thinkId);
@@ -399,8 +396,10 @@
                     <div class="chat-tool-card">
                       <div
                         class="chat-tool-header"
-                        onclick={() => { toggleTool(resultId); }}
-                        onkeydown={(e) => {
+                        onclick={(): void => {
+                          toggleTool(resultId);
+                        }}
+                        onkeydown={(e: KeyboardEvent): void => {
                           if (e.key === 'Enter' || e.key === ' ') {
                             e.preventDefault();
                             toggleTool(resultId);
@@ -409,7 +408,9 @@
                         role="button"
                         tabindex="0"
                       >
-                        <span class="chat-tool-chevron" class:expanded={isResultExpanded}>&#9654;</span>
+                        <span class="chat-tool-chevron" class:expanded={isResultExpanded}
+                          >&#9654;</span
+                        >
                         <Pill
                           text={part.isError ? '\u274C Tool Error' : '\u2705 Tool Result'}
                           classes={part.isError ? 'pill-tool-error' : 'pill-tool-success'}
@@ -460,7 +461,9 @@
         bind:value={inputText}
         dataType="text"
         useTextArea={true}
-        placeholder={sessionEnded ? 'Session ended' : 'Send a message... (Shift+Enter for new line)'}
+        placeholder={sessionEnded
+          ? 'Session ended'
+          : 'Send a message... (Shift+Enter for new line)'}
         disable={isInputDisabled}
         onKeyDown={handleKeydown}
         classes="chat-input-field"

package/src/lib/modules/client/terminal/CommandPalette.svelte

@@ -1,19 +1,10 @@
 <script lang="ts">
-  import { CommandMenu } from '@juspay/svelte-ui-components';
-
-  interface Command {
-    action: () => void;
-    label: string;
-  }
+  import type { CommandPaletteProps } from '$lib/types';
 
-  interface Props {
-    commands: Command[];
-    onClose: () => void;
-    open?: boolean;
-  }
+  import { CommandMenu } from '@juspay/svelte-ui-components';
 
   // eslint-disable-next-line prefer-const -- open is mutated via bind:open from parent
-  let { commands, onClose, open = $bindable(false) }: Props = $props();
+  let { commands, onClose, open = $bindable(false) }: CommandPaletteProps = $props();
 
   const items = $derived(
     commands.map((cmd, i) => ({

package/src/lib/modules/client/terminal/ConnectionStatus.svelte

@@ -1,12 +1,9 @@
 <script lang="ts">
-  import { Button } from '@juspay/svelte-ui-components';
+  import type { ConnectionStatusProps } from '$lib/types';
 
-  interface Props {
-    onretry?: () => void;
-    status: 'connected' | 'disconnected' | 'reconnecting';
-  }
+  import { Button } from '@juspay/svelte-ui-components';
 
-  const { onretry, status }: Props = $props();
+  const { onretry, status }: ConnectionStatusProps = $props();
 
   const label = $derived(
     status === 'connected'