fix focus loss

This commit is contained in:
Michael Freno
2025-12-20 13:42:31 -05:00
parent e9a2b00254
commit 8e7a93e762
2 changed files with 29 additions and 4 deletions

View File

@@ -1,4 +1,4 @@
import { Show } from "solid-js";
import { Show, untrack, createEffect, on } from "solid-js";
import { createTiptapEditor, useEditorHTML } from "solid-tiptap";
import StarterKit from "@tiptap/starter-kit";
import Link from "@tiptap/extension-link";
@@ -118,10 +118,26 @@ export default function TextEditor(props: TextEditorProps) {
],
content: props.preSet || `<p><em><b>Hello!</b> World</em></p>`,
onUpdate: ({ editor }) => {
props.updateContent(editor.getHTML());
untrack(() => {
props.updateContent(editor.getHTML());
});
}
}));
// Update editor content when preSet changes (e.g., when data loads), but only if editor exists and content is different
createEffect(
on(
() => props.preSet,
(newContent) => {
const instance = editor();
if (instance && newContent && instance.getHTML() !== newContent) {
instance.commands.setContent(newContent, false); // false = don't emit update event
}
},
{ defer: true }
)
);
const setLink = () => {
const instance = editor();
if (!instance) return;

View File

@@ -61,6 +61,9 @@ export default function EditPost() {
const [error, setError] = createSignal("");
const [showAutoSaveMessage, setShowAutoSaveMessage] = createSignal(false);
const [isInitialLoad, setIsInitialLoad] = createSignal(true);
const [initialBody, setInitialBody] = createSignal<string | undefined>(
undefined
);
// Populate form when data loads
createEffect(() => {
@@ -69,7 +72,13 @@ export default function EditPost() {
const p = postData.post as any;
setTitle(p.title?.replaceAll("_", " ") || "");
setSubtitle(p.subtitle || "");
setBody(p.body || "");
setBody(p.body);
// Set initial body only once for the editor
if (initialBody() === undefined) {
setInitialBody(p.body);
}
setBannerPhoto(p.banner_photo || "");
setPublished(p.published || false);
@@ -338,7 +347,7 @@ export default function EditPost() {
{/* Text Editor */}
<div class="-mx-6 md:-mx-36">
<TextEditor updateContent={setBody} preSet={body()} />
<TextEditor updateContent={setBody} preSet={initialBody()} />
</div>
{/* Tags */}