Add @osd/apm-topology package for APM service map, trace map and GenAI agent trace visualization#11394
Conversation
Signed-off-by: ps48 <pshenoy36@gmail.com>
Signed-off-by: ps48 <pshenoy36@gmail.com>
Signed-off-by: ps48 <pshenoy36@gmail.com>
Signed-off-by: ps48 <pshenoy36@gmail.com>
Signed-off-by: ps48 <pshenoy36@gmail.com>
Signed-off-by: ps48 <pshenoy36@gmail.com>
Signed-off-by: ps48 <pshenoy36@gmail.com>
Signed-off-by: ps48 <pshenoy36@gmail.com>
Signed-off-by: ps48 <pshenoy36@gmail.com>
Signed-off-by: ps48 <pshenoy36@gmail.com>
Signed-off-by: ps48 <pshenoy36@gmail.com>
PR Code Analyzer ❗AI-powered 'Code-Diff-Analyzer' found issues on commit 332053e. 'Diff too large, requires skip by maintainers after manual review' Pull Requests Author(s): Please update your Pull Request according to the report above. Repository Maintainer(s): You can Thanks. |
Signed-off-by: ps48 <pshenoy36@gmail.com>
PR Code Analyzer ❗AI-powered 'Code-Diff-Analyzer' found issues on commit 77e34eb. 'Diff too large, requires skip by maintainers after manual review' Pull Requests Author(s): Please update your Pull Request according to the report above. Repository Maintainer(s): You can Thanks. |
…I agent trace visualization (opensearch-project#11394) * Add support for apm topology map Signed-off-by: ps48 <pshenoy36@gmail.com> * Add content agent kind, update colors Signed-off-by: ps48 <pshenoy36@gmail.com> * update file names to snake case Signed-off-by: ps48 <pshenoy36@gmail.com> * Add support for node, edge click types and custom colors Signed-off-by: ps48 <pshenoy36@gmail.com> * Changeset file for PR opensearch-project#11394 created/updated * update transformIgnorePatterns in jest config Signed-off-by: ps48 <pshenoy36@gmail.com> * address comments, remove older pascal case files Signed-off-by: ps48 <pshenoy36@gmail.com> * remove the pascal files from git index Signed-off-by: ps48 <pshenoy36@gmail.com> * ignore generated css Signed-off-by: ps48 <pshenoy36@gmail.com> * Fix: Windows CI bootstrap failure caused by rm command Signed-off-by: ps48 <pshenoy36@gmail.com> * add osd/i18n optional dependency to pick the language Signed-off-by: ps48 <pshenoy36@gmail.com> * update package.json Signed-off-by: ps48 <pshenoy36@gmail.com> * update package.json Signed-off-by: ps48 <pshenoy36@gmail.com> * remove del cli Signed-off-by: ps48 <pshenoy36@gmail.com> * use rimraf Signed-off-by: ps48 <pshenoy36@gmail.com> * use rimraf in yarn.lock Signed-off-by: ps48 <pshenoy36@gmail.com> * update yarn.lock to use symlink Signed-off-by: ps48 <pshenoy36@gmail.com> --------- Signed-off-by: ps48 <pshenoy36@gmail.com> Co-authored-by: opensearch-changeset-bot[bot] <154024398+opensearch-changeset-bot[bot]@users.noreply.github.com>
…I agent trace visualization (opensearch-project#11394) * Add support for apm topology map Signed-off-by: ps48 <pshenoy36@gmail.com> * Add content agent kind, update colors Signed-off-by: ps48 <pshenoy36@gmail.com> * update file names to snake case Signed-off-by: ps48 <pshenoy36@gmail.com> * Add support for node, edge click types and custom colors Signed-off-by: ps48 <pshenoy36@gmail.com> * Changeset file for PR opensearch-project#11394 created/updated * update transformIgnorePatterns in jest config Signed-off-by: ps48 <pshenoy36@gmail.com> * address comments, remove older pascal case files Signed-off-by: ps48 <pshenoy36@gmail.com> * remove the pascal files from git index Signed-off-by: ps48 <pshenoy36@gmail.com> * ignore generated css Signed-off-by: ps48 <pshenoy36@gmail.com> * Fix: Windows CI bootstrap failure caused by rm command Signed-off-by: ps48 <pshenoy36@gmail.com> * add osd/i18n optional dependency to pick the language Signed-off-by: ps48 <pshenoy36@gmail.com> * update package.json Signed-off-by: ps48 <pshenoy36@gmail.com> * update package.json Signed-off-by: ps48 <pshenoy36@gmail.com> * remove del cli Signed-off-by: ps48 <pshenoy36@gmail.com> * use rimraf Signed-off-by: ps48 <pshenoy36@gmail.com> * use rimraf in yarn.lock Signed-off-by: ps48 <pshenoy36@gmail.com> * update yarn.lock to use symlink Signed-off-by: ps48 <pshenoy36@gmail.com> --------- Signed-off-by: ps48 <pshenoy36@gmail.com> Co-authored-by: opensearch-changeset-bot[bot] <154024398+opensearch-changeset-bot[bot]@users.noreply.github.com> Signed-off-by: Mark Boyd <mark.boyd@gsa.gov>
Description
@osd/apm-topologypackage — a React component library for rendering interactive APM service topology maps and GenAI agent trace visualizations@xyflow/react) with automatic Dagre-based hierarchical layout, the library provides 4 node types (CelestialNode, ServiceCardNode, ServiceCircleNode, AgentCardNode), styled edges with flow/pulse animations, health donuts, breadcrumb navigation, minimap, legend, and dark mode supportapm_topology_example) demonstrating all node types, edge styles, layout directions, and interactive featuresIssues Resolved
#9898
Screenshot
apm-topology.mov
Testing the changes
yarn start --run-examples→ navigate to APM Topology Example app → verify all 4 tabs render correctly (APM Cards, APM Circles, Agent Cards, Features)Changelog
Check List
yarn test:jestyarn test:jest_integration