Summary

This PR adds a new Chart Toggle option to the agent configuration UI, enabling inline rendering of charts in chat conversations. When this toggle is enabled, the LLM responds with a strict Echarts options tructure for chart data, which the frontend parses and renders using ECharts.

The main motivation is to allow users to visualize analytical or structured data directly within conversations—similar to the artifact feature but specifically for charts. This unlocks real-time visualization use cases such as AI usage metrics, cost breakdowns, or monitoring reports.

An example application of this feature is an internal MCP tool we've developed, which generates AWS billing data formatted as ECharts JSON. When combined with this chart toggle, the data is rendered inline as a cost dashboard, effectively acting as a conversational mini-Cost Explorer.

There are opportunities for design improvement and extended parsing flexibility in future iterations.

Change Type

New feature (non-breaking change which adds functionality)

Testing

Manual testing was performed to validate the following:
Toggling the chart feature on/off in agent settings correctly alters rendering behavior.
Responses from the LLM in the :::chart{} format are parsed and rendered using ECharts in the chat window.
Existing functionality like artifacts, markdown, and code rendering remain unaffected.

Checklist

• [ ✅] My code adheres to this project's style guidelines
• [ ✅] I have performed a self-review of my own code
• [✅ ] I have commented in any complex areas of my code
• I have made pertinent documentation changes
• [ ] My changes do not introduce new warnings
• I have written tests demonstrating that my changes are effective or that my feature works
• Local unit tests pass with my changes
• Any changes dependent on mine have been merged and published in downstream modules.
• A pull request for updating the documentation has been submitted.

I have added two video files showing the working of this functionality