TypeError: editorState.getImmutable is not a function

[Akashmishra1209]

My Code Is :-
import React, { useState } from 'react'
import { Editor } from "react-draft-wysiwyg";
import "react-draft-wysiwyg/dist/react-draft-wysiwyg.css";

export default function BlogEditor() {
const [content, setcontent] = useState("

Welcome

")
return (

{/* <Editor
apiKey="cyamfx5u42wgqop0qpytq20dkluwcnngeefqe36iimrq76xj" // Replace with your TinyMCE API key
initialValue={content}
// onEditorChange={(e)=>setcontent(e.target)}
onChange={(e) => setcontent(e.target.value)}
init={{
selector: '#editor',
plugins: ' searchreplace autolink directionality visualblocks visualchars image link media codesample table charmap pagebreak nonbreaking anchor insertdatetime advlist lists wordcount help charmap linkchecker emoticons autosave',
toolbar: 'undo redo print spellcheckdialog formatpainter | blocks fontfamily fontsize | bold italic underline forecolor backcolor | link image | alignleft aligncenter alignright alignjustify',
height: '600px'
}}
/> */}
<Editor
editorState={content}
toolbarClassName="toolbarClassName"
wrapperClassName="wrapperClassName"
editorClassName="editorClassName"
onEditorStateChange={(e)=>{setcontent(e.target.value)}}
/>
<button className='btn btn-primary mt-2' onClick={()=>navigator.clipboard.writeText(content).then(alert("Copied To Clipboard"))}>Copy

)
}
Bur When I Run It Says TypeError: editorState.getImmutable is not a function

[vasanthmn1]

@Akashmishra1209
Initialize the editorState correctly.

import React, { useState } from 'react';
import { EditorState } from 'draft-js';
import { Editor } from 'react-draft-wysiwyg';
import 'react-draft-wysiwyg/dist/react-draft-wysiwyg.css';
import { convertToRaw, ContentState } from 'draft-js';

export default function BlogEditor() {
  const [editorState, setEditorState] = useState(EditorState.createWithContent(ContentState.createFromText("Welcome")));

  const handleCopy = () => {
    const content = convertToRaw(editorState.getCurrentContent());
    const text = content.blocks.map(block => block.text).join('\n');
    navigator.clipboard.writeText(text).then(() => alert("Copied To Clipboard"));
  };

  return (
    <div>
      <Editor
        editorState={editorState}
        toolbarClassName="toolbarClassName"
        wrapperClassName="wrapperClassName"
        editorClassName="editorClassName"
        onEditorStateChange={setEditorState}
      />
      <button className='btn btn-primary mt-2' onClick={handleCopy}>Copy</button>
    </div>
  );
}