Render markdown

[angelo-v]

As a user of PodOS browser I want to see the rendered content of a markdown file, when navigating to a markdown resource, because I am primarily interested in the textual content and want to be able to read it easily

[josephguillaume]

I understand markdown is currently displayed by https://github.com/pod-os/PodOS/tree/5debca1f1a50ee1a1a8b5ba2d90fa19fec66a52b/elements/src/apps/pos-app-document-viewer

Is the acceptance criterion simply passing it through a markdown to html converter+ sanitising?

I'm personally interested in three additional features:

• Conversion of links. Relative links should either open the local resource in pod-os or point to the correct absolute link. Absolute links to a local resource could also be rewritten and intercepted in podos
• Support for link attributes (probably pandoc style) to be able to include rdfa, at the very least the rel attribute. Ideally the resulting linked data would also be parsed, included in the store, and therefore available when viewing other resources.
• Editing. Markdown pane-style functionality would already be acceptable.

[angelo-v]

Thanks @josephguillaume those are great additions which I like to see supported as well. This user story will focus on the rendering, I will extract new stories for the other stuff as soon as I start working on it

[josephguillaume]

Building on the concept of dynamic components, my preference for this would now be to create a generic app that is responsible for loading and saving the data, but passes all rendering to a dynamically selected web component. This separates solid-specific handling from generic interaction with data.

It would be similar to a version of pos-document with differences:

• child component is dynamically selected/defined as a prop instead of using iframe
• probably setting the data as content of a component rather setting the src as a data attribute
• allowing saving of changes to content

Specifically, the generic component would allow using something like https://zerodevx.github.io/zero-md/
Markdown specific features would be implemented outside of PodOS.

[angelo-v]

Interesting thoughts. zero-md looks nice, but it expects the markdown in a specific way, either src attribute or script tag. If we want to solve it generically, we need to define an interface between PodOS and the potential apps that can be child component to render markdown. Since other apps won't follow that interface we at least need to provide shims.

[josephguillaume]

Here's one prototype implementation: https://github.com/josephguillaume/wiki-solid-podos/blob/main/TextLoader.js

The interface to the child component is by setting the value property of slots of the component.

The same repository includes example implementations of editors and markdown renderers.
I've also used the text loader with plain text areas and the ace editor with vim key bindings, syntax highlighting and autocomplete.