Skip to content

feat(ui): improve admin upload error for Vercel 4.5 MB function body limit#16562

Open
premsreelathasugeendran wants to merge 1 commit intopayloadcms:mainfrom
premsreelathasugeendran:fix/upload-413-vercel-message
Open

feat(ui): improve admin upload error for Vercel 4.5 MB function body limit#16562
premsreelathasugeendran wants to merge 1 commit intopayloadcms:mainfrom
premsreelathasugeendran:fix/upload-413-vercel-message

Conversation

@premsreelathasugeendran
Copy link
Copy Markdown

Summary

Closes #16484. When a Payload admin upload hits HTTP 413, the toast now reports the actual file size and points contributors at the recommended fix (`clientUploads: true` on cloud-storage adapters) instead of the generic "request was too large to submit successfully".

Before / After

Before (static `errorMessages[413]`):

Your request was too large to submit successfully.

After (when a file is present in the FormData — most uploads):

Upload failed: this file is 5.1 MB, but this deployment can only accept about 4.5 MB through the server upload route. Hosted / serverless providers (e.g. Vercel Functions) cap the request body lower than Payload's configured upload.limits.fileSize. For cloud-storage adapters like @payloadcms/storage-vercel-blob, enable clientUploads to bypass this limit, or upload a smaller file.

The 5.1 MB number is computed from the actual file the user just tried to submit.

Files

  • `packages/ui/src/forms/Form/errorMessages.ts` — adds `buildPayloadTooLargeMessage` helper + tightens the static fallback string
  • `packages/ui/src/forms/Form/index.tsx` — branches on `res.status === 413` and calls the helper

How it works

```ts
const message =
res.status === 413
? buildPayloadTooLargeMessage({ body: formData })
: errorMessages?.[res.status] || res?.statusText || t('error:unknown')
```

The helper scans the submitted `FormData` for the largest `Blob`/`File` and formats a context-rich message; if the body is not FormData (e.g. a JSON request that happens to 413), it falls back to the static map entry — which now also mentions `clientUploads` and the ~4.5 MB Vercel limit so non-FormData 413s still get actionable copy.

Test plan

  • No new dependencies; the helper is pure and uses standard `FormData` / `Blob` APIs
  • Non-413 errors take exactly the same path as before — diff is additive at the 413 branch only
  • Reviewer step: deploy a sandbox to Vercel with `@payloadcms/storage-vercel-blob` and `clientUploads: false`, attempt to upload a 5+ MB file, confirm the new toast renders with the actual size
  • Reviewer step: upload a 1 MB file (no 413) and confirm normal success path is unchanged

Notes for review

…on limit

Closes payloadcms#16484

When a Payload admin upload hits HTTP 413 (e.g. Vercel Functions'
request body limit), the toast now reports the actual file size and
points contributors at the recommended fix instead of just saying the
request was too large.

Before:

    Your request was too large to submit successfully.

After (when a file is in the FormData):

    Upload failed: this file is 5.1 MB, but this deployment can only
    accept about 4.5 MB through the server upload route. Hosted /
    serverless providers (e.g. Vercel Functions) cap the request body
    lower than Payload's configured upload.limits.fileSize. For
    cloud-storage adapters like @payloadcms/storage-vercel-blob,
    enable clientUploads to bypass this limit, or upload a smaller
    file.

Implementation:

  - Added a `buildPayloadTooLargeMessage` helper next to the existing
    `errorMessages` map. It scans the submitted FormData for the
    largest Blob/File and formats a context-rich message; falls back
    to the static map entry when no file is in the body.
  - Form/index.tsx now branches on `res.status === 413` and calls the
    helper instead of the static lookup.
  - The static 413 string was also tightened — same hint about
    clientUploads, no file-size context — so non-FormData submissions
    that 413 still get the actionable copy.

No new dependencies, no behavior change for non-413 errors.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Improve admin upload error for Vercel 4.5 MB function body limit

2 participants