fix(ui): fix image upload

`openapi-fetch` does not handle non-JSON `body`s, always stringifying them, and sets the `content-type` to `application/json`.

The patch here does two things:
- Do not stringify `body` if it is one of the types that should not be stringified (https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch#body)
- Do not add `content-type: application/json` unless it really is stringified JSON.

Upstream issue: openapi-ts/openapi-typescript#1123

I'm not a bit lost on fixing the types and adding tests, so not raising a PR upstream.

Author: psychedelicious

invokeai/frontend/web/patches/openapi-fetch+0.4.0.patch

@@ -0,0 +1,55 @@
+diff --git a/node_modules/openapi-fetch/dist/index.js b/node_modules/openapi-fetch/dist/index.js
+index cd4528a..8976b51 100644
+--- a/node_modules/openapi-fetch/dist/index.js
++++ b/node_modules/openapi-fetch/dist/index.js
+@@ -1,5 +1,5 @@
+ // settings & const
+-const DEFAULT_HEADERS = {
++const CONTENT_TYPE_APPLICATION_JSON = {
+     "Content-Type": "application/json",
+ };
+ const TRAILING_SLASH_RE = /\/*$/;
+@@ -29,18 +29,29 @@ export function createFinalURL(url, options) {
+     }
+     return finalURL;
+ }
++function stringifyBody(body) {
++    if (body instanceof ArrayBuffer || body instanceof File || body instanceof DataView || body instanceof Blob || ArrayBuffer.isView(body) || body instanceof URLSearchParams || body instanceof FormData) {
++      return;
++    }
++  
++    if (typeof body === "string") {
++      return body;
++    }
++  
++    return JSON.stringify(body);
++  }
++  
+ export default function createClient(clientOptions = {}) {
+     const { fetch = globalThis.fetch, ...options } = clientOptions;
+-    const defaultHeaders = new Headers({
+-        ...DEFAULT_HEADERS,
+-        ...(options.headers ?? {}),
+-    });
++    const defaultHeaders = new Headers(options.headers ?? {});
+     async function coreFetch(url, fetchOptions) {
+         const { headers, body: requestBody, params = {}, parseAs = "json", querySerializer = defaultSerializer, ...init } = fetchOptions || {};
+         // URL
+         const finalURL = createFinalURL(url, { baseUrl: options.baseUrl, params, querySerializer });
++        // Stringify body if needed
++        const stringifiedBody = stringifyBody(requestBody);
+         // headers
+-        const baseHeaders = new Headers(defaultHeaders); // clone defaults (don’t overwrite!)
++        const baseHeaders = new Headers(stringifiedBody ? { ...CONTENT_TYPE_APPLICATION_JSON, ...defaultHeaders } : defaultHeaders); // clone defaults (don’t overwrite!)
+         const headerOverrides = new Headers(headers);
+         for (const [k, v] of headerOverrides.entries()) {
+             if (v === undefined || v === null)
+@@ -54,7 +65,7 @@ export default function createClient(clientOptions = {}) {
+             ...options,
+             ...init,
+             headers: baseHeaders,
+-            body: typeof requestBody === "string" ? requestBody : JSON.stringify(requestBody),
++            body: stringifiedBody ?? requestBody,
+         });
+         // handle empty content
+         // note: we return `{}` because we want user truthy checks for `.data` or `.error` to succeed

invokeai/frontend/web/src/services/api/thunks/image.ts

@@ -151,6 +151,8 @@ export const imageUploaded = createAppAsyncThunk<
     is_intermediate,
     session_id,
   } = arg;
+  const formData = new FormData();
+  formData.append('file', file);
   const { data, error, response } = await post('/api/v1/images/', {
     params: {
       query: {
@@ -161,8 +163,7 @@ export const imageUploaded = createAppAsyncThunk<
     },
     // TODO: Proper handling of `multipart/form-data` is coming soon, will fix type issues
     // https://github.com/drwpow/openapi-typescript/issues/1123
-    // @ts-ignore
-    body: file,
+    body: formData,
   });
 
   if (error || !data) {