search

TrueKuehli / PruneTree

App for creating Sims 4 family trees. Fork of the Plum Tree app using local browser storage to replace API calls.
https://prunetree.app/
ISC License
2 stars 2 forks source link

Migrate from Draft.JS to Lexical and replace RawHTML fields with Markdown renderer #10

Open TrueKuehli opened 7 months ago

TrueKuehli commented 7 months ago

For the import / export feature discussed in Issue #8, using raw HTML fields that take user input is too dangerous, as the data no longer comes from a trusted source like in the original app, but from other users. To prevent misuse and to avoid the headache of properly sanitizing the HTML fields, we should switch to using Markdown to render formatted text.

We need to take special care that the Markdown renderer does not allow scripts in SVG elements (or better yet, does not support SVG elements at all) since this would bring us right back to the sanitization nightmare-

TrueKuehli commented 7 months ago

If necessary we can keep RawHTML elements as a legacy option to allow rendering trees created before this change. This would however prevent exporting these trees (and any imported tree would automatically use the Markdown renderer), so I would like to avoid this.

TrueKuehli commented 7 months ago

The editor component does have markdown import / export modules that we can use: https://www.npmjs.com/package/draft-js-export-markdown https://www.npmjs.com/package/draft-js-import-markdown

TrueKuehli commented 4 months ago

Since draft.js is no longer maintained, we should also switch to using Lexical (https://github.com/facebook/lexical) at the same time.