Refactor: Change ClassDB to class based architecture.

[saurabhg772244]

📑 Summary

• Refactors the existing classDb implementation from a functional approach to a class-based architecture to improve code organization, maintainability, and extensibility.
• Return a new DB object when diagramObject.db is called.
• Introduces new ClassDB class to encapsulate database operations and state
• Migrates existing functions to class methods
• Maintains existing API interface for backwards compatibility
• Following functions still uses common DB:
  • addRelation
  • cleanupLabel
  • setAccTitle
  • setAccDescription
  • addClassesToNamespace
  • addNamespace
  • setCssClass
  • addMembers
  • addClass
  • setClassLabel
  • addAnnotation
  • addMember
  • addNote
  • defineClass
  • setDirection
  • relationType
  • lineType
  • setClickEvent
  • setTooltip
  • setLink
  • setCssStyle
• Reason why above functions still uses common DB: Refactor: Change flowDB to class based architecture. #6161 (comment)

Resolves #

📏 Design Decisions

• The classDb module previously relied on functions and global variables. Consequently, each call to mermaid.parse or mermaid.render resulted in changes to global variables.
• This behavior caused issues when rendering multiple diagrams using the same Mermaid API, as the database object (DB) for the diagrams would get mixed up.
• To address this, classDb was refactored into a class-based structure. This change ensures that each diagramObject.db call creates a new instance of the database (DB), preventing conflicts between diagrams.

📋 Tasks

Make sure you

• 📖 have read the contribution guidelines
• 💻 have added necessary unit/e2e tests.
• 📓 have added documentation. Make sure MERMAID_RELEASE_VERSION is used for all new features.
• 🦋 If your PR makes a change that should be noted in one or more packages' changelogs, generate a changeset by running pnpm changeset and following the prompts. Changesets that add features should be minor and those that fix bugs should be patch. Please prefix changeset messages with feat:, fix:, or chore:.

[changeset-bot]

🦋 Changeset detected

Latest commit: 15ffe20

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

Name	Type
mermaid	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[netlify]

✅ Deploy Preview for mermaid-js ready!

Name	Link
🔨 Latest commit	15ffe20
🔍 Latest deploy log	https://app.netlify.com/sites/mermaid-js/deploys/679377f5fa2bba000805f025
😎 Deploy Preview	https://deploy-preview-6212--mermaid-js.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[pkg-pr-new]

Open in Stackblitz

npm i https://pkg.pr.new/mermaid-js/mermaid@6212

npm i https://pkg.pr.new/mermaid-js/mermaid/@mermaid-js/mermaid-zenuml@6212

npm i https://pkg.pr.new/mermaid-js/mermaid/@mermaid-js/parser@6212

npm i https://pkg.pr.new/mermaid-js/mermaid/@mermaid-js/layout-elk@6212

commit: 15ffe20

[codecov]

Codecov Report

Attention: Patch coverage is 0% with 665 lines in your changes missing coverage. Please review.

Project coverage is 4.47%. Comparing base (4fbc19e) to head (15ffe20).
Report is 8 commits behind head on develop.

Files with missing lines	Patch %	Lines
packages/mermaid/src/diagrams/class/classDb.ts	0.00%	657 Missing ⚠️
...ages/mermaid/src/diagrams/class/classDiagram-v2.ts	0.00%	4 Missing ⚠️
...ackages/mermaid/src/diagrams/class/classDiagram.ts	0.00%	4 Missing ⚠️

Additional details and impacted files

@@            Coverage Diff             @@
##           develop   #6212      +/-   ##
==========================================
- Coverage     4.47%   4.47%   -0.01%     
==========================================
  Files          384     385       +1     
  Lines        54227   54243      +16     
  Branches       623     598      -25     
==========================================
  Hits          2425    2425              
- Misses       51802   51818      +16     

Flag	Coverage Δ
unit	4.47% <0.00%> (-0.01%)	⬇️

Flags with carried forward coverage won't be shown. Click here to find out more.

Files with missing lines	Coverage Δ
...ages/mermaid/src/diagrams/class/classDiagram-v2.ts	0.00% <0.00%> (ø)
...ackages/mermaid/src/diagrams/class/classDiagram.ts	0.00% <0.00%> (ø)
packages/mermaid/src/diagrams/class/classDb.ts	0.00% <0.00%> (ø)

... and 1 file with indirect coverage changes

[aloisklink]

To avoid the ESLint @typescript-eslint/unbound-method errors in the packages/mermaid/src/diagrams/class/classDiagram.spec.ts file, I'd recommend just adding a comment in the file like /* eslint-disable @typescript-eslint/unbound-method -- Broken for Vitest mocks, see https://github.com/vitest-dev/eslint-plugin-vitest/pull/286 */

[aloisklink]

Cheers for fixing the unit tests, LGTM now!