Implement Draft JS into Next JS, Text Editor Won't Show

I am trying to implement draft js as text editor into my next.js project. I have implemented all code based on official guide but the text editor won't show. Here is my code

index.js

import React, { Component } from 'react'
import { useRouter, Router } from 'next/router';
import Layout from '../../components/MyLayout';
import Settings from '../../components/Settings';
import MyEditor from '../../components/TextEditor';
import fetch from 'isomorphic-unfetch';
import {Editor, EditorState} from 'draft-js';

const Post = (props) => {
    const router = useRouter();
    const object = props.post.data[0];
  return (
    <Layout>
      <h1>{object.title}</h1>
      <div className="p-2 border bg-light text-right text-dark">Oleh: {object.username}</div>
      <MyEditor/>
    </Layout>
  );
}

Post.getInitialProps = async function(context) {
    const {id} = context.query;
    const FormData = new URLSearchParams();
    FormData.append('slug',`${id}`);
    const res = await fetch(Settings.api+'viewPost',{
        'method': 'POST',
        'body': FormData
    });
    const post = await res.json();
    console.log('aw');
    return {
        post
    };
};

export default Post;

TextEditor.js

import React from 'react';
import ReactDOM from 'react-dom';
import {Editor, EditorState} from 'draft-js';

export default function MyEditor() {
  const [editorState, setEditorState] = React.useState(
    EditorState.createEmpty()
  );

  return (
    <Editor
      editorState={editorState}
      onChange={setEditorState}
    />
  );
}

I really appreciate any answer. Thank you