Add possibility to rename Upload scalar

[vladshcherbin]

Hey,

It would be great to have a possibility to rename scalar. I tried this code, but it is still named Upload:

import { GraphQLUpload } from 'apollo-upload-server'

const imageTypeDefs = `
  scalar Image
`

const imageResolvers = {
  Image: GraphQLUpload
}

[jaydenseric]

I like the convention of Upload being a defacto standard scalar; we don't want to encourage renaming it.

Perhaps being able to rename the Upload scalar would be useful if integrating uploads into an API that already has a type of the same name, but it looks like this is not your use case.

Image is not a good idea for a rename. Semantically it is not an image. The scalar is a Promise for an upload of any file type. If later on you need to upload non-image files to your API the name Image no longer makes sense. Image is better reserved for a type about an actual image, which might have properties such as url, width, height, etc.

[vladshcherbin]

@jaydenseric yep, Image was just a bad example. I actually like FileUpload and wanted to use it instead of just Upload.

[jaydenseric]

Keep in mind uploads can also be blobs, not just files.

[vladshcherbin]

@jaydenseric hm, but if I want to make it possible to receive only files, I can somehow forbid blobs in resolver, right?

ps sorry for such simple questions, it's really hard to find any info about this in readme :(

[jaydenseric]

That would be validation of the contents of the scalar, just like an invalid or valid email address is still a String scalar.

[jaydenseric]

We could export a new createUploadScalar() API, and export the standard scalar using createUploadScalar('Upload').

Alternatively, people could import { GraphQLScalarType } from 'graphql' (already a peer dep in their app) and copy how to create the scalar from scratch and name it whatever.

[vladshcherbin]

@jaydenseric yep, now I get it, GraphQLUpload is just a default resolver for Upload scalar and if I want to restrict it (to accept only files/images/etc) I need to write a custom one instead.

Thank you for clearing things out 🙏

[jaydenseric]

The best way to validate uploads is to do it the same way you would for any mutation argument; in the mutation resolver.

For example:

scalar Upload

type Image {
  filename: String!
  filesize: Int!
  width: Int!
  height: Int!
  url: String!
}

type UploadImageErrors {
  image: [String!]
}

type UploadImagePayload {
  errors: UploadImageErrors
  image: Image
}

uploadImage (image: Upload!): UploadImagePayload!

In the uploadImage mutation resolver:

(obj, { image }) => {
  const { stream, filename, mimetype, encoding } = await image

  const payload = {
    errors: {
      image: []
    }
  }

  if (mimetype !== 'image/png') payload.errors.image.push('Must be a PNG file.')

  // Handle stream, either wasting or storing it based on validation so far…

  if (
    // Image stream was truncated due to maxFileSize
  ) payload.errors.image.push('Filesize too big.')

  if (
    // Image stored ok, and we have determined filesize, width, etc.
  ) payload.image = {
    filename,
    filesize
    width
    height
    url
  }

  if (!payload.errors.image.length) delete payload.errors.image
  if (!Object.keys(payload.errors).length) delete payload.errors

  return payload
}

[vladshcherbin]

@jaydenseric yep, I'll validate the file input in input component and in mutation 👍

Still don't like the Upload title, it makes me feel so uncomfortable inside. It's a custom type and I understand Date, Blob types, but what is an Upload type. Since it accepts files, blobs I don't know how to name it better, though.

I guess I'll just have to live with this.

[jaydenseric]

@vladshcherbin I just updated the example to not throw validation errors, in the sort of payload mutation response format I am moving towards in my own projects. It is intended to scale well if you add other arguments to the mutation that need validation.

[vladshcherbin]

@jaydenseric thank you, this will definitely help 👍