MCP Auto Render support

[ashubham]

In this PR, we introduce a new method which can be used to automatically render the iframes generated using ThoughtSpot MCP server in the context of the user. It also enables applying standard customizations like string, styling, actions etc.

Please check https://github.com/thoughtspot/developer-examples/tree/main/mcp/python-react-agent-simple-ui on sample code of how to use this.

[mnk-blr]

✅ Snyk checks have passed. No issues have been found so far.

Status	Scanner	Critical	High	Medium	Low	Total (0)
✅	Open Source Security	0	0	0	0	0 issues
✅	Licenses	0	0	0	0	0 issues
✅	Code Security	0	0	0	0	0 issues

💻 Catch issues earlier using the plugins for VS Code, JetBrains IDEs, Visual Studio, and Eclipse.

[gemini-code-assist]

Summary of Changes

Hello @ashubham, I'm Gemini Code Assist¹! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed!

This pull request enhances the embedding capabilities by introducing an automatic iframe rendering feature. It allows developers to simply add iframes with a specific parameter to their HTML, and the library will automatically detect, process, and replace them with fully functional and customizable ThoughtSpot embedded content. This streamlines the integration process and ensures consistent application of embedding configurations.

Highlights

• Automatic iframe rendering: Introduced a new method, startAutoMCPFrameRenderer, that automatically detects and renders iframes generated by the ThoughtSpot MCP server. This simplifies embedding content by observing the DOM for specific iframe patterns.
• Customization support: The auto-rendering mechanism supports applying standard customizations such as string, styling, and actions to the automatically rendered iframes.
• Dynamic iframe replacement: Iframes with the tsmcp=true query parameter are automatically replaced with enhanced ThoughtSpot embedded iframes, ensuring proper integration and functionality.

Changelog

• rollup.config.mjs
  • Updated the import assertion syntax for package.json from assert {type: "json"} to with {type: "json"}.
• src/embed/auto-frame-renderer.spec.ts
  • Added a new test file to cover the functionality of startAutoMCPFrameRenderer.
  • Included tests for MutationObserver setup, iframe detection based on the tsmcp parameter, and handling of nested iframes.
  • Verified that non-iframe elements and text nodes are ignored during detection.
  • Tested the processing of multiple tsmcp iframes within a single mutation.
  • Confirmed the handleInsertionIntoDOM override correctly replaces the original iframe.
  • Validated viewConfig forwarding and getMCPIframeSrc URL construction, ensuring tsmcp is stripped and other parameters are merged.
• src/embed/auto-frame-renderer.ts
  • Introduced startAutoMCPFrameRenderer function, which initializes a MutationObserver to monitor DOM changes for new iframes.
  • Implemented isTSMCPIframe to identify iframes intended for auto-rendering via the tsmcp=true query parameter.
  • Defined the AutoFrameRenderer class, extending TsEmbed, to manage the replacement of detected iframes.
  • Added getMCPIframeSrc method to construct the final iframe source URL, removing the tsmcp parameter and merging other embed configurations.
  • Overrode handleInsertionIntoDOM to facilitate the replacement of the original iframe with the new, rendered content.
• src/embed/base.ts
  • Imported the newly added startAutoMCPFrameRenderer function.
• src/index.ts
  • Exported the new AutoMCPFrameRendererViewConfig type from ./types.
  • Exported the startAutoMCPFrameRenderer function from ./embed/auto-frame-renderer to make it publicly accessible.
• src/types.ts
  • Defined the AutoMCPFrameRendererViewConfig interface, extending BaseViewConfig, to configure the auto iframe renderer.
  • Added Tsmcp as a new member to the Param enum, used for identifying iframes for auto-rendering.
• tsconfig.json
  • Extended the lib compiler option array to include dom.iterable for improved type definitions.
  • Formatted the include and entryPoints arrays for better readability.

Activity

• No specific activity (comments, reviews, progress updates) has been recorded for this pull request yet.

Using Gemini Code Assist

The full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips.

Invoking Gemini

You can request assistance from Gemini at any point by creating a comment using either /gemini <command> or @gemini-code-assist <command>. Below is a summary of the supported commands on the current page.

Feature	Command	Description
Code Review	/gemini review	Performs a code review for the current pull request in its current state.
Pull Request Summary	/gemini summary	Provides a summary of the current pull request in its current state.
Comment	@gemini-code-assist	Responds in comments when explicitly tagged, both in pull request comments and review comments.
Help	/gemini help	Displays a list of available commands.

Customization

To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a .gemini/ folder in the base of the repository. Detailed instructions can be found here.

Limitations & Feedback

Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for Github and other Google products, sign up here.

You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension.

Footnotes

1. Review the Privacy Notices, Generative AI Prohibited Use Policy, Terms of Service, and learn how to configure Gemini Code Assist in GitHub here. Gemini can make mistakes, so double check it and use code with caution. ↩

[gemini-code-assist]

Code Review

This pull request introduces an automatic rendering mechanism for iframes generated by the ThoughtSpot MCP server, utilizing a MutationObserver to detect and replace iframes marked with a tsmcp=true parameter. However, the implementation lacks origin validation and fails to properly encode query parameters, leading to potential SSRF, Open Redirect, and Parameter Injection vulnerabilities. Additionally, bugs related to URL parsing and construction have been identified, for which specific suggestions and test improvements have been provided.

[sonar-prod-ts]

SonarQube Quality Gate

0 Bugs
0 Vulnerabilities
0 Security Hotspots
0 Code Smells

No Coverage information
0.0% Duplication

[pkg-pr-new]

Open in StackBlitz

npm i https://pkg.pr.new/@thoughtspot/visual-embed-sdk@438

commit: 26f7e6a