AsyncAPI: Enhanced Preview Option with Markdown and MermaidJS Diagrams

This project aims to improve how Asyncapi objects are visualized in AsyncAPI by introducing a new preview feature. By combining Markdown and MermaidJS Class Diagrams, and flowcharts, users can seamlessly integrate with AsyncAPI schema and Avro (.avsc) files, creating dynamic and interactive representations of object structures. The project focuses on building clear class diagrams, and flowcharts with MermaidJS, connecting entities with channels, schemas, and operations, and providing additional info for a visually intuitive understanding of message payloads in AsyncAPI. I have planned to take the following action points to accomplish this goal: 1. Set up the project by installing all necessary dependencies and organizing the structure. 2. Develop a new Preview Panel resembling the HTML rendering panel in asyncapi-react standalone. 3. Integrate a components folder to facilitate markdown generation for all asyncapi objects, including mermaid diagrams. 4. Implement mermaid support for diagrams and utilize EJS as a template. 5. Introduce a tool for converting HTML to Markdown, such as turndown, to enable export functionality. Additionally, I plan to incorporate flowcharts, Class Diagrams, and display relationships among AsyncAPI specifications objects. A fully-fledged Preview Panel of Markdown for VS-Code will become the outcome of this project.