Preserve white space line breaks in the editor

[sushant-tekkon]

I am trying to preserve the white space line breaks of the data which comes from external source (excel file) when being edited in the wysiwyg editor but I have not been able to do so.

I am trying to preserve the white space line breaks of the data which comes from external source (excel file) when being edited in the wysiwyg editor but I have not been able to do so.

Scenario explanation in detail:

I have an excel file which has multiline text which gets imported to the app. The multiline text is preserved in the database and I get the text displayed in multi lines when I log it to the console. (The console does not output new line characters line \n, \r,etc and just white space line breaks like in the original text). But, when I edit the same data with wysiwyg editor, the tinymce editor puts all the data in one line.

The original text is not html text and we cannot expect the end user to type HTML tags inside the excel file such as <p>...</p> or <br />

Example data in the excel file:

This is line one
This is line two
This is line three

Data when it gets displayed in the editor: This is line one This is line two This is line three

I would like the editor to preserve the line breaks. Is that possible? How can it be achieved? Your help would be really appreciated. Thanks in advance.

[orazoulay]

  const handleReturn = (e) => {
    if (e.keyCode === 13) {
      // Check if Enter key is pressed
      const currentState = editorState;
      const newContentState = Modifier.replaceText(
        currentState.getCurrentContent(),
        currentState.getSelection(),
        '\n',
        currentState.getCurrentInlineStyle(),
      );

      setEditorState(
        EditorState.push(currentState, newContentState, 'insert-characters'),
      );
      return 'handled';
    }
    return 'not-handled';
  };

in the editor props put

          handleReturn={handleReturn}