Commit 8a28f31d authored by Frank Bessou's avatar Frank Bessou 🕸
Browse files

docs: add status of the project in README

parent 641db488bfd7
Pipeline #73449 passed with stages
in 1 minute and 19 seconds
** Warning this cube is not intended for use in production currently **
Add editorjs format for RichString
Add editorjs format for RichString.
This cube adds the application/vnd.cubicweb.editorjs mimetype to the available
formats for RichStrings.
It also adds a widget which allows to edit the RichString using the EditorJS library (a WYSIWYG editor).
Status of this project
This project has been initiated as a POC to test integration of EditorJS in CubicWeb.
- [X] setting the format of a RichString to application/vnd.cubicweb.editorjs
- [X] edition on an **already existing** RichString attribute with EditorJS
- [X] rendering a RichString using this mime type in some conditions (see below)
- [ ] RQL plugin allowing to edit and execute RQL queries
Known bugs:
- when switching to application/vnd.cubicweb.editorjs the editor is not loaded
which means that only already saved attributes can be edited with EditorJS
- the rich string is not rendered when it is asynchroneously loaded (after the
page's scripts have run). This happens with CubicWeb web in tab views.
- the breadcrumb displays the json instead of a rendered version of the RichString
- it makes automatic tests of client cubes fail
Implementation flaws:
- the implementation use monkeypatches to
- add the application/vnd.cubicweb.editorjs format to the known format list
- override some views
- override entities `printable_value` method (might not be the best place
to add the widget)
- missing mttransforms for application/vnd.cubicweb.editorjs to html
- images uploads are not supported
Usage in react applications
React applications don't suffer most of the problems seen above as they handle the rendering themselves.
Displaying an EditorJS is as easy as:
function Edit() {
const instanceRef = React.useRef<EditorJS | null>(null);
async function handleSave() {
if (instanceRef.current !== null) {
const savedData = await;
`Set X content %(content)s Where X is BlogEntry, X eid ${eid}`,
{ content: JSON.stringify(savedData) }
return (
instanceRef={(instance) => (instanceRef.current = instance)}
<button onClick={handleSave}>Save</button>
For rendering, a library like can be used.
if (contentFormat === "application/vnd.cubicweb.editorjs") {
const edjsParser = EditorJsToHTML();
const html = edjsParser.parse(JSON.parse(blogEntry.content)).join("");
return <div dangerouslySetInnerHTML={{ __html: html }} />;
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment