From 012fe9d2ee1d6b583d07e3d1c34f4f6d5575ff49 Mon Sep 17 00:00:00 2001 From: pepermao Date: Mon, 16 Oct 2023 22:39:56 +0200 Subject: [PATCH 1/2] fixed empty editor content bug --- .../CollaborativeEditorProvider.tsx | 5 ++++ src/components/Form/DynamicInput.tsx | 25 ++++++++++++------- 2 files changed, 21 insertions(+), 9 deletions(-) diff --git a/src/components/Collaborative/CollaborativeEditorProvider.tsx b/src/components/Collaborative/CollaborativeEditorProvider.tsx index 94eb30377..4a149305c 100644 --- a/src/components/Collaborative/CollaborativeEditorProvider.tsx +++ b/src/components/Collaborative/CollaborativeEditorProvider.tsx @@ -11,6 +11,7 @@ interface ContextType { editorSources?: object[]; setEditorSources?: (data: any) => void; data_hash?: string; + isFetchingEditor?: boolean; } export const CollaborativeEditorContext = createContext({ @@ -31,15 +32,18 @@ export const CollaborativeEditorProvider = ( const [editorContentObject, setEditorContentObject] = useState(null); const [editorSources, setEditorSources] = useState([]); + const [isFetchingEditor, setIsFetchingEditor] = useState(false); const { websocketUrl } = useAppSelector((state) => state); useEffect(() => { const fetchEditorContentObject = (data_hash) => { + setIsFetchingEditor(true); return ClaimReviewTaskApi.getEditorContentObject(data_hash); }; fetchEditorContentObject(props.data_hash).then((content) => { setEditorContentObject(content); + setIsFetchingEditor(false); }); }, [props.data_hash]); @@ -59,6 +63,7 @@ export const CollaborativeEditorProvider = ( editorSources, setEditorSources, data_hash: props.data_hash, + isFetchingEditor, }} > {props.children} diff --git a/src/components/Form/DynamicInput.tsx b/src/components/Form/DynamicInput.tsx index a71068be4..e5001c3eb 100644 --- a/src/components/Form/DynamicInput.tsx +++ b/src/components/Form/DynamicInput.tsx @@ -1,4 +1,4 @@ -import React, { Suspense, lazy } from "react"; +import React, { Suspense, lazy, useContext } from "react"; import ClaimReviewSelect from "./ClaimReviewSelect"; import InputTextList from "../InputTextList"; @@ -6,6 +6,7 @@ import Loading from "../Loading"; import TextArea from "../TextArea"; import UserInput from "./UserInput"; import { useTranslation } from "next-i18next"; +import { CollaborativeEditorContext } from "../Collaborative/CollaborativeEditorProvider"; const CollaborativeEditor = lazy( () => import("../Collaborative/CollaborativeEditor") @@ -24,6 +25,8 @@ interface DynamicInputProps { } const DynamicInput = (props: DynamicInputProps) => { + const { isFetchingEditor } = useContext(CollaborativeEditorContext); + const { t } = useTranslation(); switch (props.type) { case "textArea": @@ -72,14 +75,18 @@ const DynamicInput = (props: DynamicInputProps) => { /> ); case "collaborative": - return ( - }> - props.onChange(doc)} - /> - - ); + if (isFetchingEditor) { + return ; + } else { + return ( + }> + props.onChange(doc)} + /> + + ); + } default: return null; } From 9b24ed0ba41dafd6d4870971888f5d03d61c3ed3 Mon Sep 17 00:00:00 2001 From: pepermao Date: Mon, 16 Oct 2023 23:52:42 +0200 Subject: [PATCH 2/2] hotfix report page error 500 --- lib/editor-parser.ts | 51 +++++++++++++++++++++++++------------------- 1 file changed, 29 insertions(+), 22 deletions(-) diff --git a/lib/editor-parser.ts b/lib/editor-parser.ts index ba655dd25..b92652519 100644 --- a/lib/editor-parser.ts +++ b/lib/editor-parser.ts @@ -31,7 +31,6 @@ export class EditorParser { } getSourceByProperty(sources, property) { - //FIXME: Create migration return sources.filter( (source) => (source?.props?.field || source?.field) === property ); @@ -48,14 +47,13 @@ export class EditorParser { } extractHtmlContentFromRange({ props, content }, type = "text") { - const { textRange, targetText, sup } = props; - const fragmentText = content.slice(...textRange); + const fragmentText = content.slice(...props?.textRange); if (type === "text") { return fragmentText; } - if (type === "source" && fragmentText === targetText) { - return `${fragmentText}${sup}`; + if (type === "source" && fragmentText === props?.targetText) { + return `${fragmentText}${props?.sup}`; } return fragmentText; } @@ -67,15 +65,19 @@ export class EditorParser { content ); - const htmlContent = allRanges.map(({ props, type }) => { - return this.extractHtmlContentFromRange( - { - content, - props, - }, - type - ); - }); + const htmlContent = allRanges.map( + ({ targetText, textRange, sup, props, type }) => { + return this.extractHtmlContentFromRange( + { + content, + props: props + ? { ...props } + : { targetText, textRange, sup }, + }, + type + ); + } + ); if (key === "questions") { return htmlContent.join(""); @@ -283,7 +285,9 @@ export class EditorParser { } getRawSourcesAndSourcesRanges(sources) { - const rawSourcesRanges = sources.map(({ props }) => props.textRange); + const rawSourcesRanges = sources.map( + (s) => s?.props?.textRange || s?.textRange + ); const sourcesRanges = sources.map((source) => { return { @@ -302,8 +306,7 @@ export class EditorParser { { props, content, href = null }, type = "text" ) { - const { textRange, targetText, id } = props; - const fragmentText = content.slice(...textRange); + const fragmentText = content.slice(...props?.textRange); switch (type) { case "text": @@ -312,11 +315,11 @@ export class EditorParser { } break; case "source": - if (fragmentText === targetText) { + if (fragmentText === props?.targetText) { return this.getContentObjectWithMarks( fragmentText, href, - id + props?.id ); } // Fall through to the default case if type is "source" and the text doesn't match targetText @@ -400,7 +403,9 @@ export class EditorParser { }); return [...sourcesRanges, ...missingTextRanges].sort((a, b) => { - return a.props.textRange[0] - b.props.textRange[0]; + const getRange = (item) => + item?.textRange || item?.props?.textRange || [0]; + return getRange(a)[0] - getRange(b)[0]; }); } @@ -415,10 +420,12 @@ export class EditorParser { ); const textFragments = allRanges - .map(({ props, type, href }) => { + .map(({ targetText, textRange, props, type, href, id = null }) => { return this.extractContentFragmentFromRange( { - props, + props: props + ? { ...props } + : { targetText, textRange, id }, content, href, },