🥅(frontend) improve error handling during upload
Catch and log errors when replacing blocks during file upload.
This commit is contained in:
@@ -70,35 +70,43 @@ const UploadLoaderBlockComponent = ({
|
|||||||
loopCheckDocMediaStatus(url)
|
loopCheckDocMediaStatus(url)
|
||||||
.then((response) => {
|
.then((response) => {
|
||||||
// Replace the loading block with the resource block (image, audio, video, pdf ...)
|
// Replace the loading block with the resource block (image, audio, video, pdf ...)
|
||||||
editor.replaceBlocks(
|
try {
|
||||||
[block.id],
|
editor.replaceBlocks(
|
||||||
[
|
[block.id],
|
||||||
{
|
[
|
||||||
type: block.props.blockUploadType,
|
{
|
||||||
props: {
|
type: block.props.blockUploadType,
|
||||||
url: `${mediaUrl}${response.file}`,
|
props: {
|
||||||
showPreview: block.props.blockUploadShowPreview,
|
url: `${mediaUrl}${response.file}`,
|
||||||
name: block.props.blockUploadName,
|
showPreview: block.props.blockUploadShowPreview,
|
||||||
caption: '',
|
name: block.props.blockUploadName,
|
||||||
backgroundColor: 'default',
|
caption: '',
|
||||||
textAlignment: 'left',
|
backgroundColor: 'default',
|
||||||
},
|
textAlignment: 'left',
|
||||||
} as never,
|
},
|
||||||
],
|
} as never,
|
||||||
);
|
],
|
||||||
|
);
|
||||||
|
} catch {
|
||||||
|
/* During collaboration, another user might have updated the block */
|
||||||
|
}
|
||||||
})
|
})
|
||||||
.catch((error) => {
|
.catch((error) => {
|
||||||
console.error('Error analyzing file:', error);
|
console.error('Error analyzing file:', error);
|
||||||
|
|
||||||
editor.updateBlock(block.id, {
|
try {
|
||||||
type: 'uploadLoader',
|
editor.updateBlock(block.id, {
|
||||||
props: {
|
type: 'uploadLoader',
|
||||||
type: 'warning',
|
props: {
|
||||||
information: t(
|
type: 'warning',
|
||||||
'The antivirus has detected an anomaly in your file.',
|
information: t(
|
||||||
),
|
'The antivirus has detected an anomaly in your file.',
|
||||||
},
|
),
|
||||||
});
|
},
|
||||||
|
});
|
||||||
|
} catch {
|
||||||
|
/* During collaboration, another user might have updated the block */
|
||||||
|
}
|
||||||
});
|
});
|
||||||
}, [block, editor, mediaUrl]);
|
}, [block, editor, mediaUrl]);
|
||||||
|
|
||||||
|
|||||||
@@ -1,3 +1,4 @@
|
|||||||
|
import { captureException } from '@sentry/nextjs';
|
||||||
import { useCallback, useEffect } from 'react';
|
import { useCallback, useEffect } from 'react';
|
||||||
import { useTranslation } from 'react-i18next';
|
import { useTranslation } from 'react-i18next';
|
||||||
|
|
||||||
@@ -70,22 +71,28 @@ export const useUploadStatus = (editor: DocsBlockNoteEditor) => {
|
|||||||
const timeoutId = setTimeout(() => {
|
const timeoutId = setTimeout(() => {
|
||||||
// Replace the resource block by a uploadLoader block
|
// Replace the resource block by a uploadLoader block
|
||||||
// to show analyzing status
|
// to show analyzing status
|
||||||
editor.replaceBlocks(
|
try {
|
||||||
[blockChanges.block.id],
|
editor.replaceBlocks(
|
||||||
[
|
[blockChanges.block.id],
|
||||||
{
|
[
|
||||||
type: 'uploadLoader',
|
{
|
||||||
props: {
|
type: 'uploadLoader',
|
||||||
information: t('Analyzing file...'),
|
props: {
|
||||||
type: 'loading',
|
information: t('Analyzing file...'),
|
||||||
blockUploadName,
|
type: 'loading',
|
||||||
blockUploadType,
|
blockUploadName,
|
||||||
blockUploadUrl,
|
blockUploadType,
|
||||||
blockUploadShowPreview,
|
blockUploadUrl,
|
||||||
|
blockUploadShowPreview,
|
||||||
|
},
|
||||||
},
|
},
|
||||||
},
|
],
|
||||||
],
|
);
|
||||||
);
|
} catch (error) {
|
||||||
|
captureException(error, {
|
||||||
|
extra: { info: 'Error replacing block for upload loader' },
|
||||||
|
});
|
||||||
|
}
|
||||||
}, 250);
|
}, 250);
|
||||||
|
|
||||||
return () => {
|
return () => {
|
||||||
|
|||||||
Reference in New Issue
Block a user