mediahub
/
mediahub-fe
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fixing custom editor and spit convert

This commit is contained in:
hanif salafi 2025-07-20 16:07:22 +07:00
parent f3757bcfac
commit 007a6d9eec
2 changed files with 26 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
components/editor/custom-editor.js
View File

@ -5,6 +5,7 @@ function CustomEditor(props) {
const editorRef = useRef(null); const editorRef = useRef(null);
const [isEditorReady, setIsEditorReady] = useState(false); const [isEditorReady, setIsEditorReady] = useState(false);
const [currentContent, setCurrentContent] = useState(props.initialData || ""); const [currentContent, setCurrentContent] = useState(props.initialData || "");
const isUserTypingRef = useRef(false);
// Handle editor initialization // Handle editor initialization
const handleInit = useCallback((evt, editor) => { const handleInit = useCallback((evt, editor) => {
@ -12,23 +13,29 @@ function CustomEditor(props) {
setIsEditorReady(true); setIsEditorReady(true);
// Set initial content immediately when editor is ready // Set initial content immediately when editor is ready
if (currentContent) { if (props.initialData) {
editor.setContent(currentContent); editor.setContent(props.initialData);
setCurrentContent(props.initialData);
} }
// Simple onChange handler // Simple onChange handler
editor.on('change', () => { editor.on('change', () => {
isUserTypingRef.current = true; // Mark that user is typing
const content = editor.getContent(); const content = editor.getContent();
setCurrentContent(content); setCurrentContent(content);
if (props.onChange) { if (props.onChange) {
props.onChange(content); props.onChange(content);
} }
// Reset typing flag after a short delay
setTimeout(() => {
isUserTypingRef.current = false;
}, 100);
}); });
}, [currentContent, props.onChange]); }, [props.initialData, props.onChange]);
// Watch for changes in initialData prop // Watch for changes in initialData prop (from external sources like setValue)
useEffect(() => { useEffect(() => {
if (props.initialData !== currentContent) { if (props.initialData !== currentContent && !isUserTypingRef.current) {
setCurrentContent(props.initialData || ""); setCurrentContent(props.initialData || "");
// Update editor content if editor is ready // Update editor content if editor is ready
@ -36,14 +43,15 @@ function CustomEditor(props) {
editorRef.current.setContent(props.initialData || ""); editorRef.current.setContent(props.initialData || "");
} }
} }
}, [props.initialData, currentContent, isEditorReady]); }, [props.initialData, isEditorReady]); // Removed currentContent from dependency
// Handle initial data when editor becomes ready // Handle initial data when editor becomes ready (only for initialization)
useEffect(() => { useEffect(() => {
if (isEditorReady && currentContent && editorRef.current) { if (isEditorReady && props.initialData && editorRef.current && !isUserTypingRef.current) {
editorRef.current.setContent(currentContent); editorRef.current.setContent(props.initialData);
setCurrentContent(props.initialData);
} }
}, [isEditorReady, currentContent]); }, [isEditorReady]); // Only depend on isEditorReady, not currentContent
return ( return (
<Editor <Editor

13
components/form/content/spit-convert-form.tsx
View File

@ -281,7 +281,10 @@ export default function FormConvertSPIT() {
try { try {
const response = await getTagsBySubCategoryId(categoryId); const response = await getTagsBySubCategoryId(categoryId);
if (response?.data?.data?.length > 0) { if (response?.data?.data?.length > 0) {
const tagsMerge = [...tags, response?.data?.data] // Extract tag names from the response objects
const apiTags = response?.data?.data?.map((tag: any) => tag.tagName || tag.name || tag);
// Merge with existing tags, ensuring uniqueness
const tagsMerge = Array.from(new Set([...tags, ...apiTags]));
setTags(tagsMerge); setTags(tagsMerge);
} }
} catch (error) { } catch (error) {
@ -316,16 +319,16 @@ export default function FormConvertSPIT() {
setValue("contentCreator", details.contentCreator || ""); setValue("contentCreator", details.contentCreator || "");
setValue("contentRewriteDescription", details.contentRewriteDescription || ""); setValue("contentRewriteDescription", details.contentRewriteDescription || "");
// Set category // Set category and load category tags
if (details.categoryId) { if (details.categoryId) {
setSelectedCategoryId(details.categoryId); setSelectedCategoryId(details.categoryId);
await loadTags(details.categoryId); await loadTags(details.categoryId);
} }
// Set tags // Set content tags and merge with category tags
if (details.contentTag) { if (details.contentTag) {
const initialTags = details.contentTag.split(",").map((tag: string) => tag.trim()); const contentTags = details.contentTag.split(",").map((tag: string) => tag.trim());
setTags(initialTags); setTags(prev => [...new Set([...prev, ...contentTags])]);
} }
} catch (error) { } catch (error) {
console.error("Failed to load detail:", error); console.error("Failed to load detail:", error);