fix: reset body field in mod form when route changes
All checks were successful
Release to Staging / build_and_release (push) Successful in 43s

This commit is contained in:
daniyal 2024-08-28 22:57:26 +05:00
parent d9f0972961
commit 1e98b16c14

View File

@ -1,7 +1,7 @@
import Link from '@tiptap/extension-link' import Link from '@tiptap/extension-link'
import { EditorProvider, useCurrentEditor } from '@tiptap/react' import { Editor, EditorContent, useEditor } from '@tiptap/react'
import StarterKit from '@tiptap/starter-kit' import StarterKit from '@tiptap/starter-kit'
import React from 'react' import React, { useEffect } from 'react'
import '../styles/styles.css' import '../styles/styles.css'
import '../styles/tiptap.scss' import '../styles/tiptap.scss'
@ -112,28 +112,39 @@ type RichTextEditorProps = {
} }
const RichTextEditor = ({ content, updateContent }: RichTextEditorProps) => { const RichTextEditor = ({ content, updateContent }: RichTextEditorProps) => {
const editor = useEditor({
extensions: [StarterKit, Link],
onUpdate: ({ editor }) => {
// Update the state when the editor content changes
updateContent(editor.getHTML())
},
content
})
// Update editor content when the `content` prop changes
useEffect(() => {
if (editor && editor.getHTML() !== content) {
editor.commands.setContent(content, false)
}
}, [content, editor])
return ( return (
<div className='inputMain'> <div className='inputMain'>
<EditorProvider {editor && (
slotBefore={<MenuBar />} <>
extensions={[StarterKit, Link]} <MenuBar editor={editor} />
content={content} <EditorContent editor={editor} />
onUpdate={({ editor }) => { </>
// Update the state when the editor content changes )}
updateContent(editor.getHTML())
}}
></EditorProvider>
</div> </div>
) )
} }
const MenuBar = () => { type MenuBarProps = {
const { editor } = useCurrentEditor() editor: Editor
}
if (!editor) {
return null
}
const MenuBar = ({ editor }: MenuBarProps) => {
const setLink = () => { const setLink = () => {
const url = prompt('URL') const url = prompt('URL')
if (url) { if (url) {