feat!: remove file uploads feature (#501)

Author: jasonkuhrt

README.md

@@ -28,9 +28,6 @@ Minimal GraphQL client supporting Node and browsers for scripts or simple apps
   - [Cookie support for `node`](#cookie-support-for-node)
   - [Using a custom `fetch` method](#using-a-custom-fetch-method)
   - [Receiving a raw response](#receiving-a-raw-response)
-  - [File Upload](#file-upload)
-    - [Browser](#browser)
-    - [Node](#node)
   - [Batching](#batching)
   - [Cancellation](#cancellation)
   - [Middleware](#middleware)
@@ -39,6 +36,7 @@ Minimal GraphQL client supporting Node and browsers for scripts or simple apps
     - [Ignore](#ignore)
     - [All](#all)
 - [Knowledge Base](#knowledge-base)
+  - [Why was the file upload feature taken away? Will it return?](#why-was-the-file-upload-feature-taken-away-will-it-return)
   - [Why do I have to install `graphql`?](#why-do-i-have-to-install-graphql)
   - [Do I need to wrap my GraphQL documents inside the `gql` template exported by `graphql-request`?](#do-i-need-to-wrap-my-graphql-documents-inside-the-gql-template-exported-by-graphql-request)
   - [What's the difference between `graphql-request`, Apollo and Relay?](#whats-the-difference-between-graphql-request-apollo-and-relay)
@@ -565,45 +563,6 @@ async function main() {
 main().catch((error) => console.error(error))
 ```
 
-### File Upload
-
-#### Browser
-
-```js
-import { request } from 'graphql-request'
-
-const UploadUserAvatar = gql`
-  mutation uploadUserAvatar($userId: Int!, $file: Upload!) {
-    updateUser(id: $userId, input: { avatar: $file })
-  }
-`
-
-request('/api/graphql', UploadUserAvatar, {
-  userId: 1,
-  file: document.querySelector('input#avatar').files[0],
-})
-```
-
-#### Node
-
-```js
-import { createReadStream } from 'fs'
-import { request } from 'graphql-request'
-
-const UploadUserAvatar = gql`
-  mutation uploadUserAvatar($userId: Int!, $file: Upload!) {
-    updateUser(id: $userId, input: { avatar: $file })
-  }
-`
-
-request('/api/graphql', UploadUserAvatar, {
-  userId: 1,
-  file: createReadStream('./avatar.img'),
-})
-```
-
-[TypeScript Source](examples/receiving-a-raw-response.ts)
-
 ### Batching
 
 It is possible with `graphql-request` to use [batching](https://github.com/graphql/graphql-over-http/blob/main/rfcs/Batching.md) via the `batchRequests()` function. Example available at [examples/batching-requests.ts](examples/batching-requests.ts)
@@ -745,6 +704,10 @@ Return both the errors and data, only works with `rawRequest`.
 
 ## Knowledge Base
 
+#### Why was the file upload feature taken away? Will it return?
+
+In [this issue](https://github.com/jasonkuhrt/graphql-request/issues/500) we decided to make this library more stable and maintainable. In principal the feature is still in scope of this library and will make a return when we find time to do the feature right.
+
 #### Why do I have to install `graphql`?
 
 `graphql-request` uses methods exposed by the `graphql` package to handle some internal logic. On top of that, for TypeScript users, some types are used from the `graphql` package to provide better typings.

package.json

@@ -62,9 +62,7 @@
   },
   "dependencies": {
     "@graphql-typed-document-node/core": "^3.2.0",
-    "cross-fetch": "^3.1.5",
-    "extract-files": "^9.0.0",
-    "form-data": "^3.0.0"
+    "cross-fetch": "^3.1.5"
   },
   "peerDependencies": {
     "graphql": "14 - 16"
@@ -75,7 +73,6 @@
     "@tsconfig/node16": "^1.0.3",
     "@types/body-parser": "^1.19.2",
     "@types/express": "^4.17.17",
-    "@types/extract-files": "^8.1.1",
     "@types/node": "^18.15.11",
     "@types/ws": "^8.5.4",
     "@typescript-eslint/eslint-plugin": "^5.57.1",

pnpm-lock.yaml

@@ -1,4 +1,3 @@
-import createRequestBody from './createRequestBody.js'
 import { defaultJsonSerializer } from './defaultJsonSerializer.js'
 import { HeadersInstanceToPlainObject, uppercase } from './helpers.js'
 import {
@@ -597,7 +596,32 @@ const parseBatchRequestsArgsExtended = (args: BatchRequestsArgs): BatchRequestsE
   }
 }
 
-export default request
+const createRequestBody = (
+  query: string | string[],
+  variables?: Variables | Variables[],
+  operationName?: string,
+  jsonSerializer?: JsonSerializer
+): string => {
+  const jsonSerializer_ = jsonSerializer ?? defaultJsonSerializer
+  if (!Array.isArray(query)) {
+    return jsonSerializer_.stringify({ query, variables, operationName })
+  }
+
+  if (typeof variables !== `undefined` && !Array.isArray(variables)) {
+    throw new Error(`Cannot create request body with given variable type, array expected`)
+  }
+
+  // Batch support
+  const payload = query.reduce<{ query: string; variables: Variables | undefined }[]>(
+    (acc, currentQuery, index) => {
+      acc.push({ query: currentQuery, variables: variables ? variables[index] : undefined })
+      return acc
+    },
+    []
+  )
+
+  return jsonSerializer_.stringify(payload)
+}
 
 const getResult = async (
   response: Response,
@@ -655,3 +679,4 @@ export const gql = (chunks: TemplateStringsArray, ...variables: unknown[]): stri
 
 export { GraphQLWebSocketClient } from './graphql-ws.js'
 export { resolveRequestDocument } from './resolveRequestDocument.js'
+export default request