Add Mermaid support for graphs

[ericpassmore]

Feature request now that mermaid is an official part of github https://github.com/facebook/docusaurus/issues/1258

[ericpassmore]

look into https://github.com/sjwall/mdx-mermaid

[lparisc]

Current workaround for docusaurus v2: https://github.com/facebook/docusaurus/issues/1258#issuecomment-594393744

[ericpassmore]

Current workaround for docusaurus v2: facebook/docusaurus#1258 (comment)

Suggest we try the plugin first (sjwall/mdx-mermaid). It is a cleaner implementation and it is a supported project.

[ericpassmore]

Summary of implementation steps

• go into build dir and run npm i mdx-mermaid@^2.0.0-RC3 mermaid
  • note: build dir is the directory that has your doc6s installed, its the -d argument to generat_documents.sh
  • note: to make this permenate add this to generate_documents.sh, in the Install_Docusaurus() function
  • note: don't forget to run shell check when updating generate_documents.sh
• update docusaurs config
  • only need to add two lines to config
  • at the top const mdxMermaid = await import('mdx-mermaid')
  • around line 72 under presets/classic/docs remarkPlugins: [mdxMermaid.default]

async function createConfig() {
  const mdxMermaid = await import('mdx-mermaid')

  return {
    presets: [
      [
        'classic',
        {
          docs: {
            remarkPlugins: [mdxMermaid.default],
          }
        }
      ]
    ]
  }
}

module.exports = createConfig;

Now mermaid graphs will render in doc6s.

[ericpassmore]

Gave this another try, ran into issues with Redocusaurus. Opened tracking issue rohit-gohri/redocusaurus/issues/244

[ericpassmore]

Looks like there is a theme now for mermaid support https://docusaurus.io/docs/next/api/themes/@docusaurus/theme-mermaid