feat: builds a way for multipart/form-data reqs to retain non-string …

…values

src/admin/components/elements/SaveDraft/index.tsx

@@ -18,8 +18,6 @@ const SaveDraft: React.FC = () => {
 
   const canSaveDraft = modified;
 
-  console.log({ modified });
-
   const saveDraft = useCallback(() => {
     const search = `?locale=${locale}&depth=0&fallback-locale=null&draft=true`;
     let action;

src/admin/components/forms/Form/index.tsx

@@ -288,13 +288,24 @@ const Form: React.FC<Props> = (props) => {
   const createFormData = useCallback((overrides: any = {}) => {
     const data = reduceFieldsToValues(contextRef.current.fields);
 
+    const file = data?.file;
+
+    if (file) {
+      delete data.file;
+    }
+
     const dataWithOverrides = {
       ...data,
       ...overrides,
     };
 
+    const dataToSerialize = {
+      _payload: JSON.stringify(dataWithOverrides),
+      file,
+    };
+
     // nullAsUndefineds is important to allow uploads and relationship fields to clear themselves
-    const formData = serialize(dataWithOverrides, { indices: true, nullsAsUndefineds: false });
+    const formData = serialize(dataToSerialize, { indices: true, nullsAsUndefineds: false });
     return formData;
   }, [contextRef]);
 

src/admin/components/forms/field-types/RichText/RichText.tsx

@@ -185,10 +185,6 @@ const RichText: React.FC<Props> = (props) => {
 
   if (!valueToRender) valueToRender = defaultValue;
 
-  if (path === 'defaultRichText') {
-    console.log(valueToRender);
-  }
-
   return (
     <div
       className={classes}

src/express/middleware/convertPayload.ts

@@ -0,0 +1,14 @@
+import { Request, Response, NextFunction } from 'express';
+
+export default (req: Request, _: Response, next: NextFunction): void => {
+  if (req.body?._payload) {
+    const payloadJSON = JSON.parse(req.body._payload);
+
+    req.body = {
+      ...req.body,
+      ...payloadJSON,
+    };
+  }
+
+  next();
+};

src/express/middleware/index.ts

@@ -12,6 +12,7 @@ import identifyAPI from './identifyAPI';
 import { Payload } from '../..';
 import { PayloadRequest } from '../types';
 import corsHeaders from './corsHeaders';
+import convertPayload from './convertPayload';
 
 const middleware = (payload: Payload): any => {
   const rateLimitOptions: {
@@ -39,6 +40,7 @@ const middleware = (payload: Payload): any => {
       parseNested: true,
       ...payload.config.upload,
     }),
+    convertPayload,
     corsHeaders(payload.config),
     authenticate(payload.config),
     ...(payload.config.express.middleware || []),