Lack of validations for Image() and File()

[noor-codes]

Lack of validations for Image() and File()

If we look at text() or other types, There are validations like if the field is required or not. We don't seem to have the same validations options for file() and image() type.

Currently I have to write down my own complex hooks to achieve the same results which can be less than a line.

Any specific reason?

[noor-codes]

What I'm currently very interested in is the required flag in validations. Just makes life so easy.

[dcousens]

@noor-codes what type of validation did you have in mind?
Can you provide your response as an example of what you might put in a resolveInput hook?

[noor-codes]

Right now, In Keystone-v6 If we have an image() or a file() type, There are no validation options.

Let's say I want to upload an image or a file from the admin-ui and do not select any image or file and hit create button The file isn't uploaded, An ID is generated related to that file which isn't defined. We can avoid all of that by adding a required field for the file() or image().

What we have:

export const lists = {
  Profile: list({
    fields: {
      profile_img: image() //No Options to validate the image() or file().
    }
  })
}

What we want:

export const lists = {
  Profile: list({
    fields: {
      profile_img: image({ validation: { isRequired: true }, acceptable_files: [`.jpg`, '.png'] })
    }
  })
}

[noor-codes]

This is what I do in the custom hook

export const file_ValidateInput = async ({ operation, resolvedData, addValidationError }) => {
  // Check if the user creates a file.
  if (operation === 'create') {
    //Check if the user has selected any file.
    if (!resolvedData?.file.filename) {
      return addValidationError('Please select a file!')
    }

    // Generate Required Information.
    const fileName: string = resolvedData?.file.filename
    const extension: string = fileName.split('.')[1]
    const acceptable_files: string[] = ['zip']
    const content_type: string = generateFile_content_type(extension)

    // Check if the file has any extension.
    if (!extension) {
      return addValidationError('The file is not supported!')
    }

    // Check if the file is acceptable.
    if (!acceptable_files.includes(extension)) {
      addValidationError(`${extension.toUpperCase()} files are not allowed to be uploaded!`)
      addValidationError(`You can upload .zip files only.`)
    }

    // Perform all changes before saving the information.
    resolvedData.content_type = content_type
    resolvedData.extension = extension
    resolvedData.created_at = new Date()
  }
}

The things I do in this piece of code. validateInput() custom hook

• Check if the file.filename property exists on resolvedData. If yes, that means the user submitted a file, If not. return a addValidationError() message reminding the user that they have to select a a file.
• I have to get the extension of the file which is something that exists on image() fields but not on files. I would love to see that generated and stored automatically in the database.
• In the validations if I can specify which type of files a user can upload, that would be awesome. In this code I get the extension of the file and check if I have to accept them or reject them. It can simply be an array of strings where each extensions can be passed to the image() or file() types as a validation option.
• I want Keystone to automatically generate the content_type of the file if possible. if .jpg is the extension then its content_type would be image/jpg. Coding wise, this isn't a huge deal but it would be a great Developer Experience.
• Last but not least. I believe most of Keystone should have a created_at data related to each entry. This helps devs to track what happened when. I achieve that easily through the custom hook which isn't a big deal but the rest of them are. (at least to me).

That's what I personally think should be included in the next release hopefully. If I can achieve what I just said using the existing features and I am missing on them. That can be a possibility but I've read the docs many times and couldn't find a solution. This is what I would love to have on the next release.

Let me know if you have any questions related to this issue.

Thanks
Noor

[NoTuxNoBux]

Is it also just me, or are files already uploaded before validateInput is called? I have validation in validateInput for a file field that validates they are not too large, but at that point, the inputResolver of the file field has already executed, which also uploaded it, because it does a stat afterwards to see what the size is.

This means that if I want to validate files are 10 MB at most, a user can pass in a 1 GB file, upload that to my server, after which my validation hook will say "nope, too big", but my storage is already full at that time.

[pc-erin]

@NoTuxNoBux You can limit upload sizes in a roundabout way by passing options to the graphql.apolloConfig object in the keystone config.

That'll work for the whole application, not just some fields. It'll also apply to files uploaded from the admin panel.

The only method I know of to limit them in a more granular way would be to write a custom storage type for keystone.

[yorkeJohn]

Still looking for this; validation support for files and images would be nice without a custom hook.