Skip to main content
Glama
visual-dashboard.ts4.43 kB
/** * Visual Dashboard Operation * * Creates interactive visual dashboards for data exploration and analysis */ import { BaseOperation, type OperationContext, type OperationResult } from '../base.js'; import { generateDashboardHTML, generateRemoteDomScript } from '../../helpers/ui-generation.js'; export class VisualDashboardOperation extends BaseOperation { name = 'visual_dashboard'; category = 'ui'; async execute(context: OperationContext): Promise<OperationResult> { const { sessionState, prompt, parameters } = context; // Extract dashboard configuration const title = this.getParam(parameters, 'title', 'Clear Thought Dashboard'); const visualizationType = this.getParam(parameters, 'visualizationType', 'chart'); const layout = this.getParam(parameters, 'layout', 'grid'); const interactive = this.getParam(parameters, 'interactive', true); const data = this.getParam(parameters, 'data', {}); const panels = this.getParam(parameters, 'panels', []); // Generate default panels if none provided const defaultPanels = panels.length > 0 ? panels : this.generateDefaultPanels(prompt, sessionState); // Generate dashboard HTML const dashboardHTML = generateDashboardHTML({ title, visualizationType, data, panels: defaultPanels, layout, interactive }); // Generate remote DOM script for dynamic updates const remoteDomScript = generateRemoteDomScript({ visualizationType, data, panels: defaultPanels, interactive }); // Dashboard tracking (session storage not available) const dashboardId = `dashboard_${Date.now()}`; // Note: Dashboard is generated but not persisted in session return this.createResult({ dashboardId, title, visualizationType, layout, interactive, panels: defaultPanels, html: dashboardHTML, remoteDomScript, sessionContext: { sessionId: sessionState.sessionId, stats: sessionState.getStats(), dashboardCount: 1 // Tracking not available }, instructions: { usage: 'Dashboard HTML can be saved to file or displayed in browser', interactivity: interactive ? 'Dashboard supports click interactions and real-time updates' : 'Static dashboard for display only', customization: 'Modify panels array to add custom metrics, charts, or content' } }); } /** * Generate default panels based on prompt and session state */ private generateDefaultPanels(prompt: string, sessionState: any): any[] { const stats = sessionState.getStats(); const panels = []; // Overview panel panels.push({ title: 'Session Overview', type: 'metric', content: `<p>Analysis of: ${prompt.substring(0, 100)}${prompt.length > 100 ? '...' : ''}</p>`, value: `${Object.keys(stats).length} data types` }); // Statistics panels Object.entries(stats).forEach(([type, count]) => { panels.push({ title: `${type.charAt(0).toUpperCase() + type.slice(1)} Analysis`, type: 'metric', content: `<p>Reasoning operations of type: ${type}</p>`, value: count }); }); // Analysis insights panel panels.push({ title: 'Key Insights', type: 'content', content: ` <ul> <li>Total reasoning operations: ${Object.values(stats).reduce((a, b) => (a as number) + (b as number), 0)}</li> <li>Most used operation: ${this.getMostUsedOperation(stats)}</li> <li>Session complexity: ${this.calculateComplexity(stats)}</li> </ul> ` }); return panels; } private getMostUsedOperation(stats: Record<string, unknown>): string { const entries = Object.entries(stats); if (entries.length === 0) return 'None'; const max = entries.reduce((a, b) => (a[1] as number) > (b[1] as number) ? a : b ); return max[0]; } private calculateComplexity(stats: Record<string, unknown>): string { const total = Object.values(stats).reduce((a, b) => (a as number) + (b as number), 0) as number; const types = Object.keys(stats).length; if (total < 5) return 'Low'; if (total < 15) return 'Medium'; if (types > 5) return 'High'; return 'Very High'; } } export default new VisualDashboardOperation();

Latest Blog Posts

MCP directory API

We provide all the information about MCP servers via our MCP API.

curl -X GET 'https://glama.ai/api/mcp/v1/servers/waldzellai/clearthought-onepointfive'

If you have feedback or need assistance with the MCP directory API, please join our Discord server