fix(web): file uploading error in album page (#550)

* feat(web): show upload error notification

* fix(web): album upload issue
This commit is contained in:
Thanh Pham 2022-08-31 20:12:31 +07:00 committed by GitHub
parent 75d2d82d05
commit f5f00e0f6c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 26 additions and 9 deletions

View File

@ -44,12 +44,15 @@
if (uploadAssets.length == uploadAssetsCount) {
// Filter assets that are already in the album
const assetsToAdd = uploadAssets.filter(
(asset) => !assetsInAlbum.some((a) => a.id === asset)
(asset) => !!asset && !assetsInAlbum.some((a) => a.id === asset)
);
// Add the just uploaded assets to the album
dispatch('create-album', {
assets: assetsToAdd
});
if (assetsToAdd.length) {
dispatch('create-album', {
assets: assetsToAdd
});
}
// Clean up states.
albumUploadAssetStore.asset.set([]);

View File

@ -63,7 +63,7 @@ export const openFileUploadDialog = (uploadType: UploadType) => {
fileSelector.click();
} catch (e) {
console.log('Error seelcting file', e);
console.log('Error selecting file', e);
}
};
@ -145,7 +145,7 @@ async function fileUploader(asset: File, uploadType: UploadType) {
uploadAssetsStore.addNewUploadAsset(newUploadAsset);
};
request.upload.onload = (e) => {
request.upload.onload = (event) => {
setTimeout(() => {
uploadAssetsStore.removeUploadAsset(deviceAssetId);
}, 1000);
@ -154,11 +154,15 @@ async function fileUploader(asset: File, uploadType: UploadType) {
request.onreadystatechange = () => {
try {
if (request.readyState === 4 && uploadType === UploadType.ALBUM) {
const res: AssetFileUploadResponseDto = JSON.parse(request.response);
const res: AssetFileUploadResponseDto = JSON.parse(request.response || '{}');
albumUploadAssetStore.asset.update((assets) => {
return [...assets, res.id];
return [...assets, res?.id || ''];
});
if (request.status !== 201) {
handleUploadError(asset, res);
}
}
} catch (e) {
console.error('ERROR parsing data JSON in upload onreadystatechange');
@ -166,7 +170,7 @@ async function fileUploader(asset: File, uploadType: UploadType) {
};
// listen for `error` event
request.upload.onerror = () => {
request.upload.onerror = (event) => {
uploadAssetsStore.removeUploadAsset(deviceAssetId);
};
@ -188,3 +192,13 @@ async function fileUploader(asset: File, uploadType: UploadType) {
console.log('error uploading file ', e);
}
}
function handleUploadError(asset: File, respBody?: any) {
let extraMsg = respBody ? ' ' + respBody.message : '';
notificationController.show({
type: NotificationType.Error,
message: `Cannot upload file ${asset.name}!${extraMsg}`,
timeout: 5000
});
}