Code block syntax highlighting

[Gordonby]

The Wizard Web App uses a CodeBlock function for rendering language snippets (bash/tf/json).

It'd be great if this supported syntax highlighting to aid readability.

[github-actions[bot]]

Issue smells stale, no activity for 30 days. Stale Label will be removed if the issue is updated, otherwise closed in a month.

[liammoat]

Team, I have been exploring options for this. What do you think about using the monaco-editor replace the existing Code component.

I did a quick spike, and it looks pretty nice:

It's pretty configurable, giving us the option to tailor is as required.

Note: "The Monaco editor is not supported in mobile browsers or mobile web frameworks." <- we would need to test around this limitation

cc: @Gordonby @khowling

[Gordonby]

@liammoat - That looks cool! 🎉🎉🎉🎉 I think regrading to the current experience for mobile would be workable.

[github-actions[bot]]

Issue smells stale, no activity for 30 days. Stale Label will be removed if the issue is updated, otherwise closed in a month.

[github-actions[bot]]

Issue smells stale, no activity for 30 days. Stale Label will be removed if the issue is updated, otherwise closed in a month.