From 9931f4ec0d8e37571ef6d005ad86939ac3ac2910 Mon Sep 17 00:00:00 2001 From: enes <enes@nostrdev.com> Date: Wed, 15 Jan 2025 17:05:35 +0100 Subject: [PATCH] feat(mods): editor error handling --- src/components/ModForm.tsx | 21 +++++++++++++++++++-- 1 file changed, 19 insertions(+), 2 deletions(-) diff --git a/src/components/ModForm.tsx b/src/components/ModForm.tsx index afeccd5..a4a86cd 100644 --- a/src/components/ModForm.tsx +++ b/src/components/ModForm.tsx @@ -22,7 +22,12 @@ import { ModPageLoaderResult, SubmitModActionResult } from '../types' -import { initializeFormState, MOD_DRAFT_CACHE_KEY } from '../utils' +import { + initializeFormState, + log, + LogType, + MOD_DRAFT_CACHE_KEY +} from '../utils' import { CheckboxField, InputField, InputFieldWithImageUpload } from './Inputs' import { OriginalAuthor } from './OriginalAuthor' import { CategoryAutocomplete } from './CategoryAutocomplete' @@ -32,6 +37,7 @@ import { MEDIA_OPTIONS } from 'controllers' import { InputError } from './Inputs/Error' import { ImageUpload } from './Inputs/ImageUpload' import { useLocalCache } from 'hooks/useLocalCache' +import { toast } from 'react-toastify' interface GameOption { value: string @@ -59,6 +65,13 @@ export const ModForm = () => { isEditing ? initializeFormState(mod) : cache ? cache : initializeFormState() ) + // Enable backwards compatibility with the mods that used html + const body = useMemo(() => { + // Replace the most problematic HTML tags (<br>) + const fixed = formState.body.replaceAll(/<br>/g, '\r\n') + return fixed + }, [formState.body]) + useEffect(() => { if (!isEditing) { const newCache = _.cloneDeep(formState) @@ -253,11 +266,15 @@ export const ModForm = () => { <div className='inputMain'> <Editor ref={editorRef} - markdown={formState.body} + markdown={body} placeholder="Here's what this mod is all about" onChange={(md) => { handleInputChange('body', md) }} + onError={(payload) => { + toast.error('Markdown error. Fix manually in the source mode.') + log(true, LogType.Error, payload.error) + }} /> </div> {typeof formErrors?.body !== 'undefined' && (