feat(article): add markdown editor and markdown editor with preview

[GemN]

fix #327

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Updated
fxhash	✅ Ready (Inspect)	Visit Preview	Oct 3, 2022 at 3:35PM (UTC)

[ciphrd]

Great first iteration, looks good.

I'll ping lomz for some design with the tabs (maybe top left ?)

I'll leave some remarks regarding some of my findings when testing the feature.

P inside blockquotes

I believe this is the expected behavior:

The blockquote is parsed with a p inside of it.

Solution:

• remove margin on first/last elements of a blockquote
• hide tooltip if paragraph inside of a blockquote

Maybe this should be fixed at once with the general issue about blockquotes and how we handle them

Format destruction

If i input this into the markdown editor:

# Trigger

The trigger defines when the capture module will take the preview after loading the token in a web browser:

* **Fixed delay**: Give it a delay of X seconds, and once the project is loaded, the capture module will wait X seconds before triggering the capture
* **fxpreview()**: The capture module will wait until your code calls `fxpreview()`. As soon as the function is called, the capture will be triggered. You can call this function whenever your algorithm is ready to be captured. *The capture module will automatically take a capture after 300 seconds have passed after your project was loaded in the browser.*

Then, I switch to the WYSIWYG editor, I focus any paragraph, and get back to the markdown editor, the content is butchered:

Which actually break the output completely:

Repeating the manipulation will reformat the markdown until a stable state is reached, but markdown is destroyed.

This is a big issue, probably far from being easy to solve. The problem is that slate takes over the markdown and its format. We would need a robust solution where the markdown being inputted is not destroyed when doing some edits with the WYSIWYG editor.

Loss of history context

We lose the WYSIWYG history context when switching from the WYSIWYG editor to the markdown one

Lack of padding at the bottom of the preview on the side-by-side view

It would be more comfortable to have some padding there.

[GemN]

About the loss of history, when we switch we recreate an instance of the editor parsing the markdown edited.

Pros:

• The wysiwyg is recreated from a markdown, so it behaves like a first load (trigger on init, normalisation etc)

Cons:

• No history

A possibility is to keep the instance in memory, hide the editor and update the core value.
Should I go with that?