This ticket involves creating a readonly document renderer for the new data browsing experience. Let's see if Monaco with syntax highlighting for shell syntax fits the bill here. We'll need to define a language or rules for the shell syntax highlighting.
If Monaco proves to be too much of a haul here, let's use something like either defining our own minimal formatter, (Compass example, this has more than we need in it though) or use something like highlight.js

This editor will need to pull from VSCode's themes to define the colors we show. For instance the foreground color is defined as `var(--vscode-editor-foreground)`
These colors can be found here: https://code.visualstudio.com/api/references/theme-color 

Keep in mind this editor will later be used in a editable, not readonly, mode. So let's aim to have it extensible for different syntaxes. For reference, here is Compass' editor: https://github.com/mongodb-js/compass/blob/main/packages/compass-editor/src/editor.tsx 

Lastly, use this new editor component to show the documents in the new data browsing experience.