URQL file exchange (which doesn't work at all)

fileExchange.ts

import { print } from "graphql";
import { pipe, map } from "wonka";
import { Exchange, Operation } from "urql";

type FetchExchangeFn = (
  operation: Operation,
  options: RequestInit
) => RequestInit;

const createFetchExchange = (fn: FetchExchangeFn): Exchange => {
  return ({ forward }) => {
    return ops$ =>
      pipe(
        ops$,
        map(op => {
          const fetchOptions =
            typeof op.context.fetchOptions === "function"
              ? op.context.fetchOptions()
              : op.context.fetchOptions || {};

          return {
            ...op,
            context: { ...op.context, fetchOptions: fn(op, fetchOptions) }
          };
        }),
        forward
      );
  };
};

export const fileExchange = createFetchExchange((operation, options) => {
  const body = new FormData();
  body.append("query", print(operation.query));
  body.append("variables", JSON.stringify(operation.variables));

  // Do the file extraction here and append the files to the form data.

  return {
    ...options,
    // Override the body that will be created in the `fetchExchange`
    body,
    headers: {
      ...options.headers,

      // Here's the problem. When we send the request, it's important that a content-type header
      // is NOT set. Otherwise the request will fail. Inside the `fetchExchange` the header is set
      // to application/json and provides no way to unset it.
      "content-type": "multipart/form-data"
    }
  };
});