all filters fully functional. reporting system added. multiple fixes. #27
@ -1,7 +1,7 @@
|
||||
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 React from 'react'
|
||||
import React, { useEffect } from 'react'
|
||||
import '../styles/styles.css'
|
||||
import '../styles/tiptap.scss'
|
||||
|
||||
@ -112,28 +112,39 @@ type 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 (
|
||||
<div className='inputMain'>
|
||||
<EditorProvider
|
||||
slotBefore={<MenuBar />}
|
||||
extensions={[StarterKit, Link]}
|
||||
content={content}
|
||||
onUpdate={({ editor }) => {
|
||||
// Update the state when the editor content changes
|
||||
updateContent(editor.getHTML())
|
||||
}}
|
||||
></EditorProvider>
|
||||
{editor && (
|
||||
<>
|
||||
<MenuBar editor={editor} />
|
||||
<EditorContent editor={editor} />
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
const MenuBar = () => {
|
||||
const { editor } = useCurrentEditor()
|
||||
|
||||
if (!editor) {
|
||||
return null
|
||||
}
|
||||
type MenuBarProps = {
|
||||
editor: Editor
|
||||
}
|
||||
|
||||
const MenuBar = ({ editor }: MenuBarProps) => {
|
||||
const setLink = () => {
|
||||
const url = prompt('URL')
|
||||
if (url) {
|
||||
|
Loading…
Reference in New Issue
Block a user