Fix wysiwyg update

Signed-off-by: soupette <cyril@strapi.io>
This commit is contained in:
soupette 2021-09-22 08:12:32 +02:00
parent a63441757e
commit 491cbb27dd
2 changed files with 3 additions and 18 deletions

View File

@ -15,11 +15,9 @@ const Editor = ({
name, name,
onChange, onChange,
placeholder, placeholder,
shouldSetValueAfterExpand,
textareaRef, textareaRef,
value, value,
}) => { }) => {
const initialValueRef = useRef(value);
const onChangeRef = useRef(onChange); const onChangeRef = useRef(onChange);
useEffect(() => { useEffect(() => {
@ -33,10 +31,6 @@ const Editor = ({
readOnly: false, readOnly: false,
}); });
if (initialValueRef.current) {
editorRef.current.setValue(initialValueRef.current);
}
CodeMirror.commands.newlineAndIndentContinueMarkdownList = newlineAndIndentContinueMarkdownList; CodeMirror.commands.newlineAndIndentContinueMarkdownList = newlineAndIndentContinueMarkdownList;
editorRef.current.on('change', doc => { editorRef.current.on('change', doc => {
onChangeRef.current({ target: { name, value: doc.getValue(), type: 'wysiwyg' } }); onChangeRef.current({ target: { name, value: doc.getValue(), type: 'wysiwyg' } });
@ -44,10 +38,10 @@ const Editor = ({
}, [editorRef, textareaRef, name]); }, [editorRef, textareaRef, name]);
useEffect(() => { useEffect(() => {
if (shouldSetValueAfterExpand && value) { if (value && !editorRef.current.state.focused) {
editorRef.current.setValue(value); editorRef.current.setValue(value);
} }
}, [editorRef, shouldSetValueAfterExpand, value]); }, [editorRef, value]);
useEffect(() => { useEffect(() => {
if (isPreviewMode || disabled) { if (isPreviewMode || disabled) {
@ -81,7 +75,6 @@ Editor.defaultProps = {
error: undefined, error: undefined,
isPreviewMode: false, isPreviewMode: false,
placeholder: '', placeholder: '',
shouldSetValueAfterExpand: false,
value: '', value: '',
}; };
@ -93,7 +86,6 @@ Editor.propTypes = {
name: PropTypes.string.isRequired, name: PropTypes.string.isRequired,
onChange: PropTypes.func.isRequired, onChange: PropTypes.func.isRequired,
placeholder: PropTypes.string, placeholder: PropTypes.string,
shouldSetValueAfterExpand: PropTypes.bool,
textareaRef: PropTypes.shape({ current: PropTypes.any }).isRequired, textareaRef: PropTypes.shape({ current: PropTypes.any }).isRequired,
value: PropTypes.string, value: PropTypes.string,
}; };

View File

@ -67,7 +67,6 @@ const Wysiwyg = ({
const [isPreviewMode, setIsPreviewMode] = useState(false); const [isPreviewMode, setIsPreviewMode] = useState(false);
const [mediaLibVisible, setMediaLibVisible] = useState(false); const [mediaLibVisible, setMediaLibVisible] = useState(false);
const [isExpandMode, setIsExpandMode] = useState(false); const [isExpandMode, setIsExpandMode] = useState(false);
const [shouldSetValueAfterExpand, setShouldSetValueAfterExpand] = useState(false);
const handleToggleMediaLib = () => setMediaLibVisible(prev => !prev); const handleToggleMediaLib = () => setMediaLibVisible(prev => !prev);
const handleTogglePopover = () => setVisiblePopover(prev => !prev); const handleTogglePopover = () => setVisiblePopover(prev => !prev);
@ -120,13 +119,8 @@ const Wysiwyg = ({
insertImage(currentEditorRef, files); insertImage(currentEditorRef, files);
}; };
const handleToggleExpand = collapse => { const handleToggleExpand = () => {
setIsExpandMode(prev => !prev); setIsExpandMode(prev => !prev);
setShouldSetValueAfterExpand(false);
if (collapse === 'collapse' && value) {
setShouldSetValueAfterExpand(true);
}
}; };
return ( return (
@ -153,7 +147,6 @@ const Wysiwyg = ({
name={name} name={name}
onChange={onChange} onChange={onChange}
placeholder={formattedPlaceholder} placeholder={formattedPlaceholder}
shouldSetValueAfterExpand={shouldSetValueAfterExpand}
textareaRef={textareaRef} textareaRef={textareaRef}
value={value} value={value}
/> />