Upload relationships with hasMany: true result in Unexpected end of JSON input upon opening the modal window

hristokoev commented 1 month ago

Link to reproduction

https://github.com/hlinoteka-dev/hlinoteka-payload *The upload relationship field can be found in the Products collection

Payload Version

v3.0.0-beta.94

Node Version

20.14.0

Next.js Version

15.0.0-canary.104

Describe the Bug

When I set a relationship to a media upload collection with hasMany: true and I click on + Create New, I get ERROR: Unexpected end of JSON input. The feature still works and I can upload images (one by one). I can still drag and drop multiple images as well, but this error keeps showing up in the terminal:

[03:03:04] ERROR: Unexpected end of JSON input
    err: {
      "type": "SyntaxError",
      "message": "Unexpected end of JSON input",
      "stack":
          SyntaxError: Unexpected end of JSON input
              at JSON.parse (<anonymous>)
              at parseJSONFromBytes (node:internal/deps/undici/undici:4306:19)
              at successSteps (node:internal/deps/undici/undici:4288:27)
              at fullyReadBody (node:internal/deps/undici/undici:2724:9)
              at process.processTicksAndRejections (node:internal/process/task_queues:95:5)   
              at async consumeBody (node:internal/deps/undici/undici:4297:7)
              at async addDataAndFileToRequest (webpack-internal:///(rsc)/./node_modules/.pnpm/@payloadcms+next@3.0.0-beta.94_graphql@16.9.0_monaco-editor@0.38.0_next@15.0.0-canary.104_rea_wkimyxb5os6fmjklmfzrzeiuhi/node_modules/@payloadcms/next/dist/utilities/addDataAndFileToRequest.js:25:16)
              at async eval (webpack-internal:///(rsc)/./node_modules/.pnpm/@payloadcms+next@3.0.0-beta.94_graphql@16.9.0_monaco-editor@0.38.0_next@15.0.0-canary.104_rea_wkimyxb5os6fmjklmfzrzeiuhi/node_modules/@payloadcms/next/dist/routes/rest/index.js:474:9)

Reproduction Steps

Fresh install of beta.94
Set up a new collection and put an upload relationship field:

{
    name: 'image',
    type: 'upload',
    relationTo: 'media',
    hasMany: true,
}

Go to the dashboard and click on + Create new.

Clicking on the + Choose from existing button doesn't result in this error.

Adapters and Plugins

No response

hristokoev commented 1 month ago

Just in case, sharing the thread on Discord with a video, displaying the error.

hristokoev commented 1 week ago

Hi, I've updated to the latest version (v3.0.0-beta.111) and this issue persists. My server log is full of these errors, which happen every time the modal window of the upload field is opened (Create New button).

Is there anything I can do?

Reproduction Steps

Install a new instance of the blank template using npx create-payload-app@beta
Select the blank template

Create a new collection and add the following field:

{
name: 'image',
type: 'upload',
relationTo: 'media',
hasMany: true,
}

Run Payload CMS and navigate to the new collection, create a new document and click on the Create New button for the image (upload) field

payloadcms / payload