cloudinary-community / next-cloudinary

⚡️ High-performance image delivery and uploading at scale in Next.js powered by Cloudinary.
https://next.cloudinary.dev
MIT License
257 stars 75 forks source link

Type Mismatch in onQueuesEnd Callback: returns a single file Instead of an array of files #569

Open markcnunes opened 2 weeks ago

markcnunes commented 2 weeks ago

Bug Report

Describe the bug

The onQueuesEnd callback is expected to return a single file's information according to its assigned type, but instead, it returns an array of files. This results in a type mismatch when logging the results from onQueuesEnd, as the actual output is an array, not a single file.

Is this a regression?

No, this is the first time using next-cloudinary, so it's unclear if this behavior existed in previous versions.

Steps To Reproduce the error

  1. Add a console.log statement to log the output of onQueuesEnd.
  2. Observe the type declared for onQueuesEnd in the codebase.
  3. Compare the console output to the expected type declaration.
  4. Notice that onQueuesEnd returns an array of files, not a single file's information.

Expected behaviour

The onQueuesEnd callback should return a result in the format of results.info.files, consistent with the declared type (an array of files) instead of a single file.

Screenshot or Video Recording

Images of the declared type: image image

Image of the console output: image

Additional context

I am currently using Zod to validate the results returned from onQueuesEnd.

<CldUploadWidget
  onQueuesEnd={(results) => {
    if (results.info === undefined || typeof results.info === 'string') {
      return;
    }
    const fileSchema = z.object({
      uploadInfo: z.object({
        width: z.number(),
        height: z.number(),
        asset_id: z.string(),
        format: z.string(),
        secure_url: z.string(),
        original_filename: z.string(),
        public_id: z.string(),
        // declare more fields here if needed
      }),
    });

    const onQueuesEndResultsSchema = z.object({
      info: z.object({
        files: z.array(fileSchema),
      }),
    });

    const validationResult =
      onQueuesEndResultsSchema.safeParse(results);
    if (!validationResult.success) {
      console.error('Invalid results structure', validationResult.error);
    } else {
      console.log('Valid results structure', validationResult.data);
    }
  }}
 >