This is an automated email from the ASF dual-hosted git repository. linkinstar pushed a commit to branch main in repository https://gitbox.apache.org/repos/asf/incubator-answer.git
commit 4831f6ef13c1003b0571230d3cc9a0e35828ba2d Author: shuai <[email protected]> AuthorDate: Fri Nov 22 11:31:53 2024 +0800 fix: Add file upload error handling --- ui/src/components/Editor/ToolBars/file.tsx | 3 +++ ui/src/components/Editor/ToolBars/image.tsx | 36 ++++++++++++++++++----------- ui/src/pages/Admin/Write/index.tsx | 26 ++++++++++++++------- 3 files changed, 44 insertions(+), 21 deletions(-) diff --git a/ui/src/components/Editor/ToolBars/file.tsx b/ui/src/components/Editor/ToolBars/file.tsx index 30544d3e..869d1dc6 100644 --- a/ui/src/components/Editor/ToolBars/file.tsx +++ b/ui/src/components/Editor/ToolBars/file.tsx @@ -104,6 +104,9 @@ const Image = ({ editorInstance }) => { editor.replaceRange('', startPos, endPos); editor.replaceSelection(text); }) + .catch(() => { + editor.replaceRange('', startPos, endPos); + }) .finally(() => { editor.setReadOnly(false); editor.focus(); diff --git a/ui/src/components/Editor/ToolBars/image.tsx b/ui/src/components/Editor/ToolBars/image.tsx index fa660944..322da08d 100644 --- a/ui/src/components/Editor/ToolBars/image.tsx +++ b/ui/src/components/Editor/ToolBars/image.tsx @@ -166,9 +166,14 @@ const Image = ({ editorInstance }) => { editor.replaceSelection(loadingText); editor.setReadOnly(true); - const urls = await upload(fileList).catch((ex) => { - console.error('upload file error: ', ex); - }); + const urls = await upload(fileList) + .catch(() => { + editor.replaceRange('', startPos, endPos); + }) + .finally(() => { + editor.setReadOnly(false); + editor.focus(); + }); const text: string[] = []; if (Array.isArray(urls)) { @@ -183,8 +188,6 @@ const Image = ({ editorInstance }) => { } else { editor.replaceRange('', startPos, endPos); } - editor.setReadOnly(false); - editor.focus(); }; const paste = async (event) => { @@ -199,14 +202,21 @@ const Image = ({ editorInstance }) => { editor.replaceSelection(loadingText); editor.setReadOnly(true); - const urls = await upload(clipboard.files); - const text = urls.map(({ name, url, type }) => { - return `${type === 'post' ? '!' : ''}[${name}](${url})`; - }); - - editor.replaceRange(text.join('\n'), startPos, endPos); - editor.setReadOnly(false); - editor.focus(); + upload(clipboard.files) + .then((urls) => { + const text = urls.map(({ name, url, type }) => { + return `${type === 'post' ? '!' : ''}[${name}](${url})`; + }); + + editor.replaceRange(text.join('\n'), startPos, endPos); + }) + .catch(() => { + editor.replaceRange('', startPos, endPos); + }) + .finally(() => { + editor.setReadOnly(false); + editor.focus(); + }); return; } diff --git a/ui/src/pages/Admin/Write/index.tsx b/ui/src/pages/Admin/Write/index.tsx index fcf99c1d..d82f5aa0 100644 --- a/ui/src/pages/Admin/Write/index.tsx +++ b/ui/src/pages/Admin/Write/index.tsx @@ -139,9 +139,12 @@ const Index: FC = () => { max_image_size: Number(formData.max_image_size.value), max_attachment_size: Number(formData.max_attachment_size.value), max_image_megapixel: Number(formData.max_image_megapixel.value), - authorized_image_extensions: formData.authorized_image_extensions.value - .split(',') - ?.map((item) => item.trim().toLowerCase()), + authorized_image_extensions: + formData.authorized_image_extensions.value.length > 0 + ? formData.authorized_image_extensions.value + .split(',') + ?.map((item) => item.trim().toLowerCase()) + : [], authorized_attachment_extensions: formData.authorized_attachment_extensions.value.length > 0 ? formData.authorized_attachment_extensions.value @@ -287,11 +290,12 @@ const Index: FC = () => { </Form.Control.Feedback> </Form.Group> - <Form.Group className="mb-3" controlId="image_size"> + <Form.Group className="mb-3" controlId="max_image_size"> <Form.Label>{t('image_size.label')}</Form.Label> <Form.Control type="number" value={formData.max_image_size.value} + isInvalid={formData.max_image_size.isInvalid} onChange={(evt) => { handleValueChange({ max_image_size: { @@ -308,11 +312,12 @@ const Index: FC = () => { </Form.Control.Feedback> </Form.Group> - <Form.Group className="mb-3" controlId="attachment_size"> + <Form.Group className="mb-3" controlId="max_attachment_size"> <Form.Label>{t('attachment_size.label')}</Form.Label> <Form.Control type="number" value={formData.max_attachment_size.value} + isInvalid={formData.max_attachment_size.isInvalid} onChange={(evt) => { handleValueChange({ max_attachment_size: { @@ -329,10 +334,11 @@ const Index: FC = () => { </Form.Control.Feedback> </Form.Group> - <Form.Group className="mb-3" controlId="image_megapixels"> + <Form.Group className="mb-3" controlId="max_image_megapixel"> <Form.Label>{t('image_megapixels.label')}</Form.Label> <Form.Control type="number" + isInvalid={formData.max_image_megapixel.isInvalid} value={formData.max_image_megapixel.value} onChange={(evt) => { handleValueChange({ @@ -350,11 +356,12 @@ const Index: FC = () => { </Form.Control.Feedback> </Form.Group> - <Form.Group className="mb-3" controlId="image_extensions"> + <Form.Group className="mb-3" controlId="authorized_image_extensions"> <Form.Label>{t('image_extensions.label')}</Form.Label> <Form.Control type="text" value={formData.authorized_image_extensions.value} + isInvalid={formData.authorized_image_extensions.isInvalid} onChange={(evt) => { handleValueChange({ authorized_image_extensions: { @@ -371,11 +378,14 @@ const Index: FC = () => { </Form.Control.Feedback> </Form.Group> - <Form.Group className="mb-3" controlId="attachment_extensions"> + <Form.Group + className="mb-3" + controlId="authorized_attachment_extensions"> <Form.Label>{t('attachment_extensions.label')}</Form.Label> <Form.Control type="text" value={formData.authorized_attachment_extensions.value} + isInvalid={formData.authorized_attachment_extensions.isInvalid} onChange={(evt) => { handleValueChange({ authorized_attachment_extensions: {
