Channel Thumbnail: handle json errors

1. Added size-specific error message.
2. Route whatever Vanwa's error instead of showing "unexpected json token". It's ugly, but at least it contains the reason string.
This commit is contained in:
infinite-persistence 2022-01-26 21:14:37 +08:00 committed by Thomas Zarebczan
parent ed0f574339
commit 47fa736bdc

View file

@ -1,5 +1,6 @@
// @flow // @flow
import React from 'react'; import React from 'react';
import { THUMBNAIL_CDN_SIZE_LIMIT_BYTES } from 'config';
import FileSelector from 'component/common/file-selector'; import FileSelector from 'component/common/file-selector';
import { IMG_CDN_PUBLISH_URL } from 'constants/cdn_urls'; import { IMG_CDN_PUBLISH_URL } from 'constants/cdn_urls';
import { FormField, Form } from 'component/common/form'; import { FormField, Form } from 'component/common/form';
@ -24,6 +25,7 @@ function SelectAsset(props: Props) {
const { onUpdate, onDone, assetName, currentValue, recommended, title, inline } = props; const { onUpdate, onDone, assetName, currentValue, recommended, title, inline } = props;
const [pathSelected, setPathSelected] = React.useState(''); const [pathSelected, setPathSelected] = React.useState('');
const [fileSelected, setFileSelected] = React.useState<any>(null); const [fileSelected, setFileSelected] = React.useState<any>(null);
const [fileSize, setFileSize] = React.useState(0);
const [uploadStatus, setUploadStatus] = React.useState(STATUS.READY); const [uploadStatus, setUploadStatus] = React.useState(STATUS.READY);
const [useUrl, setUseUrl] = usePersistedState('thumbnail-upload:mode', false); const [useUrl, setUseUrl] = usePersistedState('thumbnail-upload:mode', false);
const [url, setUrl] = React.useState(currentValue); const [url, setUrl] = React.useState(currentValue);
@ -53,7 +55,14 @@ function SelectAsset(props: Props) {
method: 'POST', method: 'POST',
body: data, body: data,
}) })
.then((response) => response.json()) .then((res) => res.text())
.then((text) => {
try {
return text.length ? JSON.parse(text) : {};
} catch {
throw new Error(text);
}
})
.then((json) => { .then((json) => {
return json.type === 'success' return json.type === 'success'
? onSuccess(`${json.message}`) ? onSuccess(`${json.message}`)
@ -62,7 +71,15 @@ function SelectAsset(props: Props) {
); );
}) })
.catch((err) => { .catch((err) => {
uploadError(err.message); if (fileSize >= THUMBNAIL_CDN_SIZE_LIMIT_BYTES) {
uploadError(
__('Thumbnail size over %max_size%MB, please edit and reupload.', {
max_size: THUMBNAIL_CDN_SIZE_LIMIT_BYTES / (1024 * 1024),
})
);
} else {
uploadError(err.message);
}
setUploadStatus(STATUS.READY); setUploadStatus(STATUS.READY);
}); });
} }
@ -106,6 +123,7 @@ function SelectAsset(props: Props) {
onFileChosen={(file) => { onFileChosen={(file) => {
if (file.name) { if (file.name) {
setFileSelected(file); setFileSelected(file);
setFileSize(file.size);
// what why? why not target=WEB this? // what why? why not target=WEB this?
// file.path is undefined in web but available in electron // file.path is undefined in web but available in electron
setPathSelected(file.name || file.path); setPathSelected(file.name || file.path);