Refactor JavaScript REPL tool description with consistent pattern

Clean up and restructure JavaScript REPL description following consistent pattern:
- Purpose section
- When to Use section
- Environment section
- Common Libraries section
- Important Notes section
- Example section

Removed buildJavaScriptReplDescription() function - no longer dynamically
injecting runtime provider docs into tool description (will move to system prompt).

Changes:
- Replace JAVASCRIPT_REPL_BASE_DESCRIPTION with JAVASCRIPT_REPL_DESCRIPTION
- Remove JAVASCRIPT_REPL_CHART_EXAMPLE and JAVASCRIPT_REPL_FOOTER
- Remove buildJavaScriptReplDescription() function
- Update javascript-repl tool to use static description
- Simpler, more scannable structure with clear hierarchy

packages/web-ui/src/prompts/tool-prompts.ts

@@ -7,67 +7,41 @@
 // JavaScript REPL Tool
 // ============================================================================
 
-export const JAVASCRIPT_REPL_BASE_DESCRIPTION = `Execute JavaScript code in a sandboxed browser environment with full modern browser capabilities.
+export const JAVASCRIPT_REPL_DESCRIPTION = `# JavaScript REPL
 
-Environment: Modern browser with ALL Web APIs available:
+## Purpose
+Execute JavaScript code in a sandboxed browser environment with full Web APIs.
+
+## When to Use
+- Quick calculations or data transformations
+- Testing JavaScript code snippets
+- Processing data with libraries (XLSX, CSV, etc.)
+- Creating visualizations (charts, graphs)
+
+## Environment
 - ES2023+ JavaScript (async/await, optional chaining, nullish coalescing, etc.)
-- DOM APIs (document, window, Canvas, WebGL, etc.)
+- All browser APIs: DOM, Canvas, WebGL, Fetch, Web Workers, WebSockets, Crypto, etc.
-- Fetch API for HTTP requests
+- Import any npm package: await import('https://esm.run/package-name')
 
-Loading external libraries via dynamic imports (use esm.run):
+## Common Libraries
-- XLSX (Excel files): const XLSX = await import('https://esm.run/xlsx');
+- XLSX: const XLSX = await import('https://esm.run/xlsx');
-- Papa Parse (CSV): const Papa = (await import('https://esm.run/papaparse')).default;
+- CSV: const Papa = (await import('https://esm.run/papaparse')).default;
-- Lodash: const _ = await import('https://esm.run/lodash-es');
-- D3.js: const d3 = await import('https://esm.run/d3');
 - Chart.js: const Chart = (await import('https://esm.run/chart.js/auto')).default;
 - Three.js: const THREE = await import('https://esm.run/three');
-- Any npm package: await import('https://esm.run/package-name')
+- Lodash: const _ = await import('https://esm.run/lodash-es');
+- D3.js: const d3 = await import('https://esm.run/d3');
 
-IMPORTANT for graphics/canvas:
+## Important Notes
-- Use fixed dimensions like 400x400 or 800x600, NOT window.innerWidth/Height
+- Graphics: Use fixed dimensions (800x600), NOT window.innerWidth/Height
-- For Three.js: renderer.setSize(400, 400) and camera aspect ratio of 1
+- Chart.js: Set options: { responsive: false, animation: false }
-- For Chart.js: Set options: { responsive: false, animation: false } to ensure immediate rendering
+- Three.js: renderer.setSize(800, 600) with matching aspect ratio
-- Web Storage (localStorage, sessionStorage, IndexedDB)
+- Output: All console.log() calls are captured and displayed
-- Web Workers, WebAssembly, WebSockets
-- Media APIs (Audio, Video, WebRTC)
-- File APIs (Blob, FileReader, etc.)
-- Crypto API for cryptography
-- And much more - anything a modern browser supports!
 
-Output:
+## Example
-- console.log() - All output is captured as text`;
+const data = [10, 20, 15, 25];
-
+const sum = data.reduce((a, b) => a + b, 0);
-export const JAVASCRIPT_REPL_CHART_EXAMPLE = `
+const avg = sum / data.length;
-    - Chart.js example:
+console.log('Sum:', sum, 'Average:', avg);`;
-      const Chart = (await import('https://esm.run/chart.js/auto')).default;
-      const canvas = document.createElement('canvas');
-      canvas.width = 400; canvas.height = 300;
-      document.body.appendChild(canvas);
-      new Chart(canvas, {
-        type: 'line',
-        data: {
-          labels: ['Jan', 'Feb', 'Mar', 'Apr'],
-          datasets: [{ label: 'Sales', data: [10, 20, 15, 25], borderColor: 'blue' }]
-        },
-        options: { responsive: false, animation: false }
-      });
-      const blob = await new Promise(resolve => canvas.toBlob(resolve, 'image/png'));
-      await returnDownloadableFile('chart.png', blob, 'image/png');`;
-
-export const JAVASCRIPT_REPL_FOOTER = `
-
-- All standard browser globals (window, document, fetch, etc.)`;
-
-/**
- * Build complete JavaScript REPL description with optional provider docs.
- */
-export function buildJavaScriptReplDescription(providerDocs?: string): string {
-	return (
-		JAVASCRIPT_REPL_BASE_DESCRIPTION +
-		(providerDocs ? "\n" + providerDocs + JAVASCRIPT_REPL_CHART_EXAMPLE : "") +
-		JAVASCRIPT_REPL_FOOTER
-	);
-}
 
 // ============================================================================
 // Artifacts Tool

packages/web-ui/src/tools/javascript-repl.ts

@@ -5,7 +5,7 @@ import { createRef, ref } from "lit/directives/ref.js";
 import { Code } from "lucide";
 import { type SandboxFile, SandboxIframe, type SandboxResult } from "../components/SandboxedIframe.js";
 import type { SandboxRuntimeProvider } from "../components/sandbox/SandboxRuntimeProvider.js";
-import { buildJavaScriptReplDescription } from "../prompts/tool-prompts.js";
+import { JAVASCRIPT_REPL_DESCRIPTION } from "../prompts/tool-prompts.js";
 import type { Attachment } from "../utils/attachment-utils.js";
 import { registerToolRenderer, renderCollapsibleHeader, renderHeader } from "./renderer-registry.js";
 import type { ToolRenderer } from "./types.js";
@@ -132,16 +132,7 @@ export function createJavaScriptReplTool(): AgentTool<typeof javascriptReplSchem
 		name: "javascript_repl",
 		runtimeProvidersFactory: () => [], // default to empty array
 		sandboxUrlProvider: undefined, // optional, for browser extensions
-		get description() {
+		description: JAVASCRIPT_REPL_DESCRIPTION,
-			// Get dynamic provider descriptions
-			const providers = this.runtimeProvidersFactory?.() || [];
-			const providerDocs = providers
-				.map((p) => p.getDescription?.())
-				.filter(Boolean)
-				.join("\n");
-
-			return buildJavaScriptReplDescription(providerDocs || undefined);
-		},
 		parameters: javascriptReplSchema,
 		execute: async function (_toolCallId: string, args: Static<typeof javascriptReplSchema>, signal?: AbortSignal) {
 			const result = await executeJavaScript(