Catch s3 upload errors (#1400)

* Catch s3 upload errors

* Include file name in error message

* More renaming from image to file
This commit is contained in:
ekzyis 2024-09-13 17:41:07 +02:00 committed by GitHub
parent e09e1398fd
commit 30d5eb9801
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 17 additions and 14 deletions

View File

@ -29,11 +29,12 @@ export default {
}
}
// width and height is 0 for videos
if (width * height > IMAGE_PIXELS_MAX) {
throw new GqlInputError(`image must be less than ${IMAGE_PIXELS_MAX} pixels`)
}
const imgParams = {
const fileParams = {
type,
size,
width,
@ -44,10 +45,10 @@ export default {
if (avatar) {
if (!me) throw new GqlAuthenticationError()
imgParams.paid = undefined
fileParams.paid = undefined
}
const upload = await models.upload.create({ data: { ...imgParams } })
const upload = await models.upload.create({ data: { ...fileParams } })
return createPresignedPost({ key: String(upload.id), type, size })
}
}

View File

@ -39,8 +39,8 @@ export const FileUpload = forwardRef(({ children, className, onSelect, onUpload,
try {
({ data } = await getSignedPOST({ variables }))
} catch (e) {
toaster.danger('error initiating upload: ' + e.message || e.toString?.())
onError?.({ ...variables, name: file.name, file })
reject(e)
return
}
@ -58,10 +58,8 @@ export const FileUpload = forwardRef(({ children, className, onSelect, onUpload,
if (!res.ok) {
// TODO make sure this is actually a helpful error message and does not expose anything to the user we don't want
const err = res.statusText
toaster.danger('error uploading: ' + err)
onError?.({ ...variables, name: file.name, file })
reject(err)
reject(new Error(res.statusText))
return
}
@ -96,16 +94,20 @@ export const FileUpload = forwardRef(({ children, className, onSelect, onUpload,
onChange={async (e) => {
const fileList = e.target.files
for (const file of Array.from(fileList)) {
if (accept.indexOf(file.type) === -1) {
toaster.danger(`image must be ${accept.map(t => t.replace('image/', '').replace('video/', '')).join(', ')}`)
try {
if (accept.indexOf(file.type) === -1) {
throw new Error(`file must be ${accept.map(t => t.replace(/^(image|video)\//, '')).join(', ')}`)
}
if (onSelect) await onSelect?.(file, s3Upload)
else await s3Upload(file)
} catch (e) {
toaster.danger(`upload of '${file.name}' failed: ` + e.message || e.toString?.())
continue
}
if (onSelect) await onSelect?.(file, s3Upload)
else await s3Upload(file)
// reset file input
// see https://bobbyhadz.com/blog/react-reset-file-input#reset-a-file-input-in-react
e.target.value = null
}
// reset file input
// see https://bobbyhadz.com/blog/react-reset-file-input#reset-a-file-input-in-react
e.target.value = null
}}
/>
<div