mirror of
https://github.com/docmost/docmost.git
synced 2025-11-19 01:31:11 +10:00
fix: editor performance improvements (#1648)
* Switch to useEditorState * change shouldRerenderOnTransaction to false
This commit is contained in:
@ -1,4 +1,4 @@
|
||||
import { BubbleMenu as BaseBubbleMenu } from "@tiptap/react";
|
||||
import { BubbleMenu as BaseBubbleMenu, useEditorState } from "@tiptap/react";
|
||||
import React, { useCallback, useState } from "react";
|
||||
import { EditorMenuProps } from "@/features/editor/components/table/types/types.ts";
|
||||
import { LinkEditorPanel } from "@/features/editor/components/link/link-editor-panel.tsx";
|
||||
@ -12,7 +12,18 @@ export function LinkMenu({ editor, appendTo }: EditorMenuProps) {
|
||||
return editor.isActive("link");
|
||||
}, [editor]);
|
||||
|
||||
const { href: link } = editor.getAttributes("link");
|
||||
const editorState = useEditorState({
|
||||
editor,
|
||||
selector: (ctx) => {
|
||||
if (!ctx.editor) {
|
||||
return null;
|
||||
}
|
||||
const link = ctx.editor.getAttributes("link");
|
||||
return {
|
||||
href: link.href,
|
||||
};
|
||||
},
|
||||
});
|
||||
|
||||
const handleEdit = useCallback(() => {
|
||||
setShowEdit(true);
|
||||
@ -70,11 +81,14 @@ export function LinkMenu({ editor, appendTo }: EditorMenuProps) {
|
||||
padding="xs"
|
||||
bg="var(--mantine-color-body)"
|
||||
>
|
||||
<LinkEditorPanel initialUrl={link} onSetLink={onSetLink} />
|
||||
<LinkEditorPanel
|
||||
initialUrl={editorState?.href}
|
||||
onSetLink={onSetLink}
|
||||
/>
|
||||
</Card>
|
||||
) : (
|
||||
<LinkPreviewPanel
|
||||
url={link}
|
||||
url={editorState?.href}
|
||||
onClear={onUnsetLink}
|
||||
onEdit={handleEdit}
|
||||
/>
|
||||
|
||||
Reference in New Issue
Block a user