Ckeditor not working in NextJs on localhost

here's my code for initializing the editor

export default function Home() {
  
  const editorRef = useRef()
  const [ editorLoaded, setEditorLoaded ] = useState( false )
  const { CKEditor, ClassicEditor } = editorRef.current || {}

  useEffect( () => {
    editorRef.current = {
      CKEditor: require( '@ckeditor/ckeditor5-react' ).CKEditor,
      ClassicEditor: require( '@ckeditor/ckeditor5-build-classic' )
    }
    setEditorLoaded( true )
  }, [] )

    return (
      <div className='w-full h-full' >
      <h1>Ckeditor5 Nextjs</h1>
      {
        editorLoaded ?
        <CKEditor className="mt-3 wrap-ckeditor" editor={ClassicEditor} onReady={editor => {
         console.log(editor);
        }} />
        :
        "loading..."
      }
      

    </div>
    )
}

the problem is that the editor loads and then unloads after a few hundred milliseconds I ran the same code on codesanbox and faced no problem another thing is that I log the editor instance in the onReady callback but instead of an object, null is logged I search Github and Stackoverflow but didn't find anything

Edit: I solved the problem by removing the reactStrictMode:true in the next.config.js I am going to check why this is the case in another question