Skip to content

fix(calm-widgets): update mermaid ID handling and sanitize identifier…#1807

Merged
LeighFinegold merged 5 commits intofinos:mainfrom
rocketstack-matt:mermaid-fix
Nov 17, 2025
Merged

fix(calm-widgets): update mermaid ID handling and sanitize identifier…#1807
LeighFinegold merged 5 commits intofinos:mainfrom
rocketstack-matt:mermaid-fix

Conversation

@rocketstack-matt
Copy link
Member

…s in widgets

Description

Resolves #1806

Type of Change

  • 🐛 Bug fix (non-breaking change which fixes an issue)
  • ✨ New feature (non-breaking change which adds functionality)
  • 💥 Breaking change (fix or feature that would cause existing functionality to not work as expected)
  • 📚 Documentation update
  • 🎨 Code style/formatting changes
  • ♻️ Refactoring (no functional changes)
  • ⚡ Performance improvements
  • ✅ Test additions or updates
  • 🔧 Chore (maintenance, dependencies, CI, etc.)

Affected Components

  • CLI (cli/)
  • Shared (shared/)
  • CALM Widgets (calm-widgets/)
  • CALM Hub (calm-hub/)
  • CALM Hub UI (calm-hub-ui/)
  • Documentation (docs/)
  • VS Code Extension (calm-plugins/vscode/)
  • Dependencies
  • CI/CD

Commit Message Format ✅

Testing

  • I have tested my changes locally
  • I have added/updated unit tests
  • All existing tests pass

Checklist

  • My commits follow the conventional commit format
  • I have updated documentation if necessary
  • I have added tests for my changes (if applicable)
  • My changes follow the project's coding standards

Copilot AI review requested due to automatic review settings November 17, 2025 15:42
@rocketstack-matt rocketstack-matt requested a review from a team as a code owner November 17, 2025 15:42
Copy link
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull Request Overview

This PR fixes Mermaid diagram rendering issues by implementing proper ID sanitization and reserved word handling. The changes address conflicts with Mermaid's reserved keywords (like 'end', 'graph', 'subgraph') that were causing diagram generation failures, and improves HTML entity handling in the VS Code extension.

Key changes:

  • Introduced mermaidId helper function to sanitize node identifiers and prefix reserved words
  • Updated all Handlebars templates to use the new mermaidId helper consistently
  • Added HTML entity decoding in the VS Code extension's Mermaid renderer

Reviewed Changes

Copilot reviewed 10 out of 10 changed files in this pull request and generated 3 comments.

Show a summary per file
File Description
calm-widgets/src/widgets/block-architecture/core/utils.ts Added mermaidId function with reserved word detection logic
calm-widgets/src/widget-helpers.ts Implemented mermaidId as a Handlebars template helper
calm-widgets/src/widgets/block-architecture/typed-node.hbs Updated to use mermaidId helper for all node IDs
calm-widgets/src/widgets/block-architecture/container.hbs Updated to use mermaidId helper for container and node IDs
calm-widgets/src/widgets/block-architecture/click-links.hbs Updated to use mermaidId helper for clickable links
calm-widgets/src/widgets/block-architecture/block-architecture.hbs Updated to use mermaidId helper for nodes, edges, and highlights
calm-widgets/src/widgets/block-architecture/core/utils.spec.ts Added comprehensive tests for mermaidId function
calm-widgets/src/widget-helpers.spec.ts Added comprehensive tests for mermaidId template helper
calm-plugins/vscode/src/features/preview/webview/mermaid-renderer.ts Added HTML entity decoding for Mermaid code blocks
calm-plugins/vscode/package.json Bumped version from 0.0.8 to 0.0.9

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

@rocketstack-matt
Copy link
Member Author

Once merged this change will need a manual publish of both the CLI (fixes for docify) and VSCode extension

expect(helpers.mermaidId(null)).toBe('node_empty');
expect(helpers.mermaidId(undefined)).toBe('node_empty');
expect(helpers.mermaidId(123)).toBe('node_empty');
expect(helpers.mermaidId('')).toBe('node_empty');
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Make sense for now. I guess we need to enhance all of this to calm validate a lot of this stuff anyways for the null case.

@LeighFinegold LeighFinegold merged commit b1d22a7 into finos:main Nov 17, 2025
12 checks passed
pmerrison pushed a commit to pmerrison/architecture-as-code that referenced this pull request Nov 20, 2025
fix(calm-widgets): update mermaid ID handling and sanitize identifier…
@rocketstack-matt rocketstack-matt deleted the mermaid-fix branch December 17, 2025 11:52
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

VSCode extension fails to render CALM models with Mermaid reserved words in node IDs

3 participants