title: Set the data from api to be the inital state of editorState for draftjs
body: <p>I'm creating a richtexteditor component using draft.js that will display data from my api. But I cant find a way to diplay this to my Editor using draft.js. Can someone explain me why? I tried to create a var with the same data from my api and Its working fine.</p>
  <p><strong>sample data from api</strong></p>
  <p><a href="https://i.stack.imgur.com/JctAU.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/JctAU.png" alt="enter image description here" /></a></p>
  <p><code>&quot;&lt;p&gt;Hello world this is &lt;strong&gt;me&lt;strong&gt;&lt;/p&gt;&quot;</code></p>
  <p><strong>screenshot of the data from mongoDB</strong></p>
  <p><a href="https://i.stack.imgur.com/sNSis.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/sNSis.png" alt="enter image description here" /></a></p>
  <pre><code>const ViewTaskComment = ({ comment }) =&gt; {
    const contentBlocks = convertFromHTML(comment);
  
    const contentState = ContentState.createFromBlockArray(
      contentBlocks.contentBlocks,
      contentBlocks.entityMap
    );
  
    const [editorState, setEditorState] = useState(() =&gt;
      EditorState.createWithContent(contentState)
    );
  
    const handleEditorChange = (state) =&gt; {
      setEditorState(state);
    };
  
    return (
      &lt;div className='comment-container p-2 border rounded-md'&gt;
        &lt;Editor
          editorState={editorState}
          onEditorStateChange={handleEditorChange}
          wrapperClassName='wrapper-class'
          editorClassName='editor-class'
          toolbarClassName='toolbar-class'
        /&gt;
      &lt;/div&gt;
    );
  };
  
  export default ViewTaskComment;
  </code></pre>