@contractspec/example.agent-console 3.7.5 → 3.7.7

package/src/ui/renderers/agent-list.markdown.ts

@@ -3,12 +3,13 @@
  *
  * Uses handlers from the agent-console example package.
  */
-import type { PresentationSpec } from '@contractspec/lib.contracts-spec/presentations';
-import type { PresentationRenderer } from '@contractspec/lib.contracts-spec/presentations/transform-engine';
+
 import {
-  type AgentSummary,
-  mockListAgentsHandler,
+	type AgentSummary,
+	mockListAgentsHandler,
 } from '@contractspec/example.agent-console/handlers';
+import type { PresentationSpec } from '@contractspec/lib.contracts-spec/presentations';
+import type { PresentationRenderer } from '@contractspec/lib.contracts-spec/presentations/transform-engine';
 
 type Agent = AgentSummary;
 
@@ -17,66 +18,66 @@ type Agent = AgentSummary;
  * Only handles AgentListView component
  */
 export const agentListMarkdownRenderer: PresentationRenderer<{
-  mimeType: string;
-  body: string;
+	mimeType: string;
+	body: string;
 }> = {
-  target: 'markdown',
-  render: async (desc: PresentationSpec) => {
-    // Only handle AgentListView
-    if (
-      desc.source.type !== 'component' ||
-      desc.source.componentKey !== 'AgentListView'
-    ) {
-      throw new Error('agentListMarkdownRenderer: not AgentListView');
-    }
+	target: 'markdown',
+	render: async (desc: PresentationSpec) => {
+		// Only handle AgentListView
+		if (
+			desc.source.type !== 'component' ||
+			desc.source.componentKey !== 'AgentListView'
+		) {
+			throw new Error('agentListMarkdownRenderer: not AgentListView');
+		}
 
-    // Fetch data using mock handler
-    const data = await mockListAgentsHandler({
-      organizationId: 'demo-org',
-      limit: 50,
-      offset: 0,
-    });
+		// Fetch data using mock handler
+		const data = await mockListAgentsHandler({
+			organizationId: 'demo-org',
+			limit: 50,
+			offset: 0,
+		});
 
-    // Generate markdown
-    const lines: string[] = [
-      `# ${desc.meta.description ?? 'Agent List'}`,
-      '',
-      `> ${desc.meta.key} v${desc.meta.version}`,
-      '',
-      `**Total Agents:** ${data.total}`,
-      '',
-      '## Agents',
-      '',
-    ];
+		// Generate markdown
+		const lines: string[] = [
+			`# ${desc.meta.description ?? 'Agent List'}`,
+			'',
+			`> ${desc.meta.key} v${desc.meta.version}`,
+			'',
+			`**Total Agents:** ${data.total}`,
+			'',
+			'## Agents',
+			'',
+		];
 
-    // Group by status
-    const byStatus: Record<string, Agent[]> = {};
-    for (const agent of data.items) {
-      const status = agent.status;
-      if (byStatus[status]) {
-        byStatus[status].push(agent);
-      } else {
-        byStatus[status] = [agent];
-      }
-    }
+		// Group by status
+		const byStatus: Record<string, Agent[]> = {};
+		for (const agent of data.items) {
+			const status = agent.status;
+			if (byStatus[status]) {
+				byStatus[status].push(agent);
+			} else {
+				byStatus[status] = [agent];
+			}
+		}
 
-    for (const [status, agents] of Object.entries(byStatus)) {
-      lines.push(`### ${status} (${agents.length})`);
-      lines.push('');
-      for (const agent of agents) {
-        lines.push(
-          `- **${agent.name}** (${agent.modelProvider}/${agent.modelName})`
-        );
-        if (agent.description) {
-          lines.push(`  > ${agent.description}`);
-        }
-      }
-      lines.push('');
-    }
+		for (const [status, agents] of Object.entries(byStatus)) {
+			lines.push(`### ${status} (${agents.length})`);
+			lines.push('');
+			for (const agent of agents) {
+				lines.push(
+					`- **${agent.name}** (${agent.modelProvider}/${agent.modelName})`
+				);
+				if (agent.description) {
+					lines.push(`  > ${agent.description}`);
+				}
+			}
+			lines.push('');
+		}
 
-    return {
-      mimeType: 'text/markdown',
-      body: lines.join('\n'),
-    };
-  },
+		return {
+			mimeType: 'text/markdown',
+			body: lines.join('\n'),
+		};
+	},
 };

package/src/ui/renderers/agent-list.renderer.tsx

@@ -9,17 +9,17 @@ import { AgentListView } from '../views/AgentListView';
  * React renderer for agent-console.agent.list presentation
  */
 export const agentListReactRenderer: PresentationRenderer<React.ReactElement> =
-  {
-    target: 'react',
-    render: async (desc: PresentationSpec) => {
-      if (desc.source.type !== 'component') {
-        throw new Error('AgentListRenderer: expected component source');
-      }
-      if (desc.source.componentKey !== 'AgentListView') {
-        throw new Error(
-          `AgentListRenderer: unknown component ${desc.source.componentKey}`
-        );
-      }
-      return <AgentListView />;
-    },
-  };
+	{
+		target: 'react',
+		render: async (desc: PresentationSpec) => {
+			if (desc.source.type !== 'component') {
+				throw new Error('AgentListRenderer: expected component source');
+			}
+			if (desc.source.componentKey !== 'AgentListView') {
+				throw new Error(
+					`AgentListRenderer: unknown component ${desc.source.componentKey}`
+				);
+			}
+			return <AgentListView />;
+		},
+	};

package/src/ui/renderers/dashboard.markdown.ts

@@ -3,18 +3,19 @@
  *
  * Provides a comprehensive overview of agents, runs, and tools.
  */
-import type { PresentationSpec } from '@contractspec/lib.contracts-spec/presentations';
-import type { PresentationRenderer } from '@contractspec/lib.contracts-spec/presentations/transform-engine';
+
 import {
-  mockListAgentsHandler,
-  mockListRunsHandler,
-  mockListToolsHandler,
+	mockListAgentsHandler,
+	mockListRunsHandler,
+	mockListToolsHandler,
 } from '@contractspec/example.agent-console/handlers';
+import type { PresentationSpec } from '@contractspec/lib.contracts-spec/presentations';
+import type { PresentationRenderer } from '@contractspec/lib.contracts-spec/presentations/transform-engine';
 
 function formatDuration(ms: number): string {
-  if (ms < 1000) return `${ms}ms`;
-  if (ms < 60000) return `${(ms / 1000).toFixed(1)}s`;
-  return `${(ms / 60000).toFixed(1)}m`;
+	if (ms < 1000) return `${ms}ms`;
+	if (ms < 60000) return `${(ms / 1000).toFixed(1)}s`;
+	return `${(ms / 60000).toFixed(1)}m`;
 }
 
 /**
@@ -22,146 +23,146 @@ function formatDuration(ms: number): string {
  * Only handles AgentConsoleDashboard component
  */
 export const agentDashboardMarkdownRenderer: PresentationRenderer<{
-  mimeType: string;
-  body: string;
+	mimeType: string;
+	body: string;
 }> = {
-  target: 'markdown',
-  render: async (desc: PresentationSpec) => {
-    // Only handle AgentConsoleDashboard
-    if (
-      desc.source.type !== 'component' ||
-      desc.source.componentKey !== 'AgentConsoleDashboard'
-    ) {
-      throw new Error(
-        'agentDashboardMarkdownRenderer: not AgentConsoleDashboard'
-      );
-    }
+	target: 'markdown',
+	render: async (desc: PresentationSpec) => {
+		// Only handle AgentConsoleDashboard
+		if (
+			desc.source.type !== 'component' ||
+			desc.source.componentKey !== 'AgentConsoleDashboard'
+		) {
+			throw new Error(
+				'agentDashboardMarkdownRenderer: not AgentConsoleDashboard'
+			);
+		}
 
-    // Fetch all data in parallel
-    const [agentsData, runsData, toolsData] = await Promise.all([
-      mockListAgentsHandler({
-        organizationId: 'demo-org',
-        limit: 100,
-      }),
-      mockListRunsHandler({
-        limit: 100,
-      }),
-      mockListToolsHandler({
-        organizationId: 'demo-org',
-        limit: 100,
-      }),
-    ]);
+		// Fetch all data in parallel
+		const [agentsData, runsData, toolsData] = await Promise.all([
+			mockListAgentsHandler({
+				organizationId: 'demo-org',
+				limit: 100,
+			}),
+			mockListRunsHandler({
+				limit: 100,
+			}),
+			mockListToolsHandler({
+				organizationId: 'demo-org',
+				limit: 100,
+			}),
+		]);
 
-    // Calculate stats
-    const activeAgents = agentsData.items.filter(
-      (a) => a.status === 'ACTIVE'
-    ).length;
-    const completedRuns = runsData.items.filter(
-      (r) => r.status === 'COMPLETED'
-    ).length;
-    const failedRuns = runsData.items.filter(
-      (r) => r.status === 'FAILED'
-    ).length;
-    const totalTokens = runsData.items.reduce(
-      (sum, r) => sum + (r.totalTokens ?? 0),
-      0
-    );
-    const totalCost = runsData.items.reduce(
-      (sum, r) => sum + (r.estimatedCostUsd ?? 0),
-      0
-    );
-    const activeTools = toolsData.items.filter(
-      (t) => t.status === 'ACTIVE'
-    ).length;
+		// Calculate stats
+		const activeAgents = agentsData.items.filter(
+			(a) => a.status === 'ACTIVE'
+		).length;
+		const completedRuns = runsData.items.filter(
+			(r) => r.status === 'COMPLETED'
+		).length;
+		const failedRuns = runsData.items.filter(
+			(r) => r.status === 'FAILED'
+		).length;
+		const totalTokens = runsData.items.reduce(
+			(sum, r) => sum + (r.totalTokens ?? 0),
+			0
+		);
+		const totalCost = runsData.items.reduce(
+			(sum, r) => sum + (r.estimatedCostUsd ?? 0),
+			0
+		);
+		const activeTools = toolsData.items.filter(
+			(t) => t.status === 'ACTIVE'
+		).length;
 
-    // Build dashboard markdown
-    const lines: string[] = [
-      '# Agent Console Dashboard',
-      '',
-      '> AI agent operations overview',
-      '',
-      '## Summary',
-      '',
-      '| Metric | Value |',
-      '|--------|-------|',
-      `| Total Agents | ${agentsData.total} |`,
-      `| Active Agents | ${activeAgents} |`,
-      `| Total Runs | ${runsData.total} |`,
-      `| Completed Runs | ${completedRuns} |`,
-      `| Failed Runs | ${failedRuns} |`,
-      `| Total Tokens | ${totalTokens.toLocaleString()} |`,
-      `| Total Cost | $${totalCost.toFixed(4)} |`,
-      `| Total Tools | ${toolsData.total} |`,
-      `| Active Tools | ${activeTools} |`,
-      '',
-      '## Agents',
-      '',
-    ];
+		// Build dashboard markdown
+		const lines: string[] = [
+			'# Agent Console Dashboard',
+			'',
+			'> AI agent operations overview',
+			'',
+			'## Summary',
+			'',
+			'| Metric | Value |',
+			'|--------|-------|',
+			`| Total Agents | ${agentsData.total} |`,
+			`| Active Agents | ${activeAgents} |`,
+			`| Total Runs | ${runsData.total} |`,
+			`| Completed Runs | ${completedRuns} |`,
+			`| Failed Runs | ${failedRuns} |`,
+			`| Total Tokens | ${totalTokens.toLocaleString()} |`,
+			`| Total Cost | $${totalCost.toFixed(4)} |`,
+			`| Total Tools | ${toolsData.total} |`,
+			`| Active Tools | ${activeTools} |`,
+			'',
+			'## Agents',
+			'',
+		];
 
-    // Agent list
-    if (agentsData.items.length === 0) {
-      lines.push('_No agents configured._');
-    } else {
-      lines.push('| Agent | Model | Status | Description |');
-      lines.push('|-------|-------|--------|-------------|');
-      for (const agent of agentsData.items.slice(0, 5)) {
-        lines.push(
-          `| ${agent.name} | ${agent.modelProvider}/${agent.modelName} | ${agent.status} | ${agent.description ?? '-'} |`
-        );
-      }
-      if (agentsData.items.length > 5) {
-        lines.push(`| ... | ... | ... | _${agentsData.total - 5} more_ |`);
-      }
-    }
+		// Agent list
+		if (agentsData.items.length === 0) {
+			lines.push('_No agents configured._');
+		} else {
+			lines.push('| Agent | Model | Status | Description |');
+			lines.push('|-------|-------|--------|-------------|');
+			for (const agent of agentsData.items.slice(0, 5)) {
+				lines.push(
+					`| ${agent.name} | ${agent.modelProvider}/${agent.modelName} | ${agent.status} | ${agent.description ?? '-'} |`
+				);
+			}
+			if (agentsData.items.length > 5) {
+				lines.push(`| ... | ... | ... | _${agentsData.total - 5} more_ |`);
+			}
+		}
 
-    lines.push('');
-    lines.push('## Recent Runs');
-    lines.push('');
+		lines.push('');
+		lines.push('## Recent Runs');
+		lines.push('');
 
-    // Recent runs
-    if (runsData.items.length === 0) {
-      lines.push('_No runs yet._');
-    } else {
-      lines.push('| Run ID | Agent | Status | Duration | Tokens | Cost |');
-      lines.push('|--------|-------|--------|----------|--------|------|');
-      for (const run of runsData.items.slice(0, 5)) {
-        lines.push(
-          `| ${run.id.slice(-8)} | ${run.agentName} | ${run.status} | ${run.durationMs ? formatDuration(run.durationMs) : '-'} | ${run.totalTokens ?? 0} | $${(run.estimatedCostUsd ?? 0).toFixed(4)} |`
-        );
-      }
-      if (runsData.items.length > 5) {
-        lines.push(
-          `| ... | ... | ... | ... | ... | _${runsData.total - 5} more_ |`
-        );
-      }
-    }
+		// Recent runs
+		if (runsData.items.length === 0) {
+			lines.push('_No runs yet._');
+		} else {
+			lines.push('| Run ID | Agent | Status | Duration | Tokens | Cost |');
+			lines.push('|--------|-------|--------|----------|--------|------|');
+			for (const run of runsData.items.slice(0, 5)) {
+				lines.push(
+					`| ${run.id.slice(-8)} | ${run.agentName} | ${run.status} | ${run.durationMs ? formatDuration(run.durationMs) : '-'} | ${run.totalTokens ?? 0} | $${(run.estimatedCostUsd ?? 0).toFixed(4)} |`
+				);
+			}
+			if (runsData.items.length > 5) {
+				lines.push(
+					`| ... | ... | ... | ... | ... | _${runsData.total - 5} more_ |`
+				);
+			}
+		}
 
-    lines.push('');
-    lines.push('## Tools');
-    lines.push('');
+		lines.push('');
+		lines.push('## Tools');
+		lines.push('');
 
-    // Tool categories
-    const toolsByCategory: Record<string, typeof toolsData.items> = {};
-    for (const tool of toolsData.items) {
-      const cat = tool.category;
-      if (!toolsByCategory[cat]) toolsByCategory[cat] = [];
-      toolsByCategory[cat].push(tool);
-    }
+		// Tool categories
+		const toolsByCategory: Record<string, typeof toolsData.items> = {};
+		for (const tool of toolsData.items) {
+			const cat = tool.category;
+			if (!toolsByCategory[cat]) toolsByCategory[cat] = [];
+			toolsByCategory[cat].push(tool);
+		}
 
-    if (Object.keys(toolsByCategory).length === 0) {
-      lines.push('_No tools registered._');
-    } else {
-      lines.push('| Category | Tools | Active |');
-      lines.push('|----------|-------|--------|');
-      for (const [category, tools] of Object.entries(toolsByCategory).sort()) {
-        const active = tools.filter((t) => t.status === 'ACTIVE').length;
-        lines.push(`| ${category} | ${tools.length} | ${active} |`);
-      }
-    }
+		if (Object.keys(toolsByCategory).length === 0) {
+			lines.push('_No tools registered._');
+		} else {
+			lines.push('| Category | Tools | Active |');
+			lines.push('|----------|-------|--------|');
+			for (const [category, tools] of Object.entries(toolsByCategory).sort()) {
+				const active = tools.filter((t) => t.status === 'ACTIVE').length;
+				lines.push(`| ${category} | ${tools.length} | ${active} |`);
+			}
+		}
 
-    return {
-      mimeType: 'text/markdown',
-      body: lines.join('\n'),
-    };
-  },
+		return {
+			mimeType: 'text/markdown',
+			body: lines.join('\n'),
+		};
+	},
 };

package/src/ui/renderers/index.ts

@@ -2,11 +2,10 @@
  * Renderers for agent-console presentations
  */
 
-// React renderers
-export { agentListReactRenderer } from './agent-list.renderer';
-
 // Markdown renderers
 export { agentListMarkdownRenderer } from './agent-list.markdown';
+// React renderers
+export { agentListReactRenderer } from './agent-list.renderer';
+export { agentDashboardMarkdownRenderer } from './dashboard.markdown';
 export { runListMarkdownRenderer } from './run-list.markdown';
 export { toolRegistryMarkdownRenderer } from './tool-registry.markdown';
-export { agentDashboardMarkdownRenderer } from './dashboard.markdown';

package/src/ui/renderers/run-list.markdown.ts

@@ -3,21 +3,22 @@
  *
  * Uses dynamic import for handlers to ensure correct build order.
  */
+
+import { mockListRunsHandler } from '@contractspec/example.agent-console/handlers';
 import type { PresentationSpec } from '@contractspec/lib.contracts-spec/presentations';
 import type { PresentationRenderer } from '@contractspec/lib.contracts-spec/presentations/transform-engine';
 import type { Run } from '../hooks/useRunList';
-import { mockListRunsHandler } from '@contractspec/example.agent-console/handlers';
 
 interface RunListOutput {
-  items: Run[];
-  total: number;
-  hasMore: boolean;
+	items: Run[];
+	total: number;
+	hasMore: boolean;
 }
 
 function formatDuration(ms: number): string {
-  if (ms < 1000) return `${ms}ms`;
-  if (ms < 60000) return `${(ms / 1000).toFixed(1)}s`;
-  return `${(ms / 60000).toFixed(1)}m`;
+	if (ms < 1000) return `${ms}ms`;
+	if (ms < 60000) return `${(ms / 1000).toFixed(1)}s`;
+	return `${(ms / 60000).toFixed(1)}m`;
 }
 
 /**
@@ -25,49 +26,49 @@ function formatDuration(ms: number): string {
  * Only handles RunListView component
  */
 export const runListMarkdownRenderer: PresentationRenderer<{
-  mimeType: string;
-  body: string;
+	mimeType: string;
+	body: string;
 }> = {
-  target: 'markdown',
-  render: async (desc: PresentationSpec) => {
-    // Only handle RunListView
-    if (
-      desc.source.type !== 'component' ||
-      desc.source.componentKey !== 'RunListView'
-    ) {
-      throw new Error('runListMarkdownRenderer: not RunListView');
-    }
+	target: 'markdown',
+	render: async (desc: PresentationSpec) => {
+		// Only handle RunListView
+		if (
+			desc.source.type !== 'component' ||
+			desc.source.componentKey !== 'RunListView'
+		) {
+			throw new Error('runListMarkdownRenderer: not RunListView');
+		}
 
-    // Fetch data using mock handler
-    const data = (await mockListRunsHandler({
-      organizationId: 'demo-org',
-      limit: 20,
-      offset: 0,
-    })) as RunListOutput;
+		// Fetch data using mock handler
+		const data = (await mockListRunsHandler({
+			organizationId: 'demo-org',
+			limit: 20,
+			offset: 0,
+		})) as RunListOutput;
 
-    // Generate markdown
-    const lines: string[] = [
-      `# ${desc.meta.description ?? 'Agent Runs'}`,
-      '',
-      `> ${desc.meta.key} v${desc.meta.version}`,
-      '',
-      `**Total Runs:** ${data.total}`,
-      '',
-      '## Recent Runs',
-      '',
-      '| ID | Agent | Status | Duration | Tokens | Cost |',
-      '| --- | --- | --- | --- | --- | --- |',
-    ];
+		// Generate markdown
+		const lines: string[] = [
+			`# ${desc.meta.description ?? 'Agent Runs'}`,
+			'',
+			`> ${desc.meta.key} v${desc.meta.version}`,
+			'',
+			`**Total Runs:** ${data.total}`,
+			'',
+			'## Recent Runs',
+			'',
+			'| ID | Agent | Status | Duration | Tokens | Cost |',
+			'| --- | --- | --- | --- | --- | --- |',
+		];
 
-    for (const run of data.items.slice(0, 10)) {
-      lines.push(
-        `| ${run.id.slice(-8)} | ${run.agentName} | ${run.status} | ${run.durationMs ? formatDuration(run.durationMs) : '-'} | ${run.totalTokens} | $${run.estimatedCostUsd?.toFixed(4) ?? '-'} |`
-      );
-    }
+		for (const run of data.items.slice(0, 10)) {
+			lines.push(
+				`| ${run.id.slice(-8)} | ${run.agentName} | ${run.status} | ${run.durationMs ? formatDuration(run.durationMs) : '-'} | ${run.totalTokens} | $${run.estimatedCostUsd?.toFixed(4) ?? '-'} |`
+			);
+		}
 
-    return {
-      mimeType: 'text/markdown',
-      body: lines.join('\n'),
-    };
-  },
+		return {
+			mimeType: 'text/markdown',
+			body: lines.join('\n'),
+		};
+	},
 };