Netlify-cms: Image validation

[erquhart]

- Do you want to request a feature or report a bug?

feature

- What is the current behavior?

No validation is available for the file/image widgets.

- If the current behavior is a bug, please provide the steps to reproduce.

- What is the expected behavior?

Allow files to be validated by max size, and images by width/height.

[haileypate]

I like this a lot. One way I'd use it is to provide my users with a warning that the file they're about to publish is really big and could take too long to load. Or I might provide a warning when the image width is too small and that it may not look right

[idiazroncero]

I'd like to see this feature as well. Image constraints are important: on my experience, educating end-users is not enough. Many of them will keep uploading 5MB images if not prevented...

The possibility of adding a simple validation of max filesize and height/width constraints that prevent form submission would be great.

[Undistraction]

Would be great to have validations for:

• Filesize
• Extension
• Width
• Height
• Aspect ratio (this would need to be a little bit fuzzy to deal with pixel-rounding).

[mb21]

How are you people currently preventing your users from uploading very large images? Or do you just resize them in the static site generator step? Do you have some hack in place, or use something like https://github.com/netlify/netlify-cms/blob/master/website/content/docs/uploadcare.md ? Thanks!

https://github.com/netlify/netlify-cms/issues/2243 would of course also solve this... but work doesn't seem to have started on that?

P.S. other than image handling, netlify-cms is really great! thanks for the tool!

[fabianrios]

one of my editors just upload a 58mb image to it. we need this.

[mb21]

As #2243 is stalled, as a stopgap, we could at least implement the file size check. The option would probably go into the YAML config like this?

  media_library:
    config:
      multiple: true # existing option
      maxFileSize: 100000  # in bytes

and then passed through the redux store all the way to src/components/MediaLibrary/MediaLibrary.js#handlePersist, where we could do something like:

if (file.size > config.maxFileSize) {
   // alert ?

What do you think?

[fabianrios]

Better than nothing

[erquhart]

@mb21 that'd be a great PR, just needs to be camel_case (max_file_size).