feat: batch admin configure mutations (#2089)

src/core/client/admin/routes/configure/containers/ConfigureContainer.tsx

@@ -56,25 +56,32 @@ class ConfigureContainer extends React.Component<Props> {
   ) => {
     let cancelled = false;
     let formErrors: Record<string, React.ReactNode> = {};
+    const executeCallbacks: Array<() => Promise<any>> = [];
     const cancel = (errors: Record<string, React.ReactNode>) => {
       cancelled = true;
       formErrors = { ...errors, ...formErrors };
     };
+    const onExecute = (cb: () => Promise<any>) => {
+      executeCallbacks.push(cb);
+    };
     try {
       // Call submit hooks, that can manipulate what
       // we send as the mutation.
       let nextData = data;
       for (const hook of this.submitHooks) {
-        const result = await hook(nextData, cancel);
-        if (cancelled) {
-          return formErrors;
-        }
+        const result = await hook(nextData, { cancel, onExecute });
         if (result) {
           nextData = result;
         }
       }
+      if (cancelled) {
+        return formErrors;
+      }
 
-      await this.props.updateSettings({ settings: nextData });
+      executeCallbacks.push(() =>
+        this.props.updateSettings({ settings: nextData })
+      );
+      await Promise.all(executeCallbacks.map(cb => cb()));
       form.initialize(data);
     } catch (error) {
       if (error instanceof BadUserInputError) {

src/core/client/admin/routes/configure/sections/auth/containers/AuthContainer.tsx

@@ -43,7 +43,7 @@ export default class AuthContainer extends React.Component<Props> {
     this.removeSubmitHook();
   }
 
-  private submitHook: SubmitHook = async (data, cancel) => {
+  private submitHook: SubmitHook = async (data, { cancel }) => {
     const integrations = [
       get(data, "auth.integrations.google"),
       get(data, "auth.integrations.facebook"),

src/core/client/admin/routes/configure/sections/auth/containers/OIDCConfigListContainer.tsx

@@ -43,19 +43,23 @@ class OIDCConfigListContainer extends React.Component<Props> {
     this.removeSubmitHook();
   }
 
-  private submitHook: SubmitHook = async (data: any) => {
+  private submitHook: SubmitHook = async (data: any, { onExecute }) => {
     const cloned = cloneDeep(data);
     const oidc = cloned.auth.integrations.oidc;
     delete cloned.auth.integrations.oidc;
     if (this.props.auth.integrations.oidc.length === 0) {
       if (oidc[0].enabled) {
-        await this.props.createOIDCAuthIntegration({ configuration: oidc[0] });
+        onExecute(() =>
+          this.props.createOIDCAuthIntegration({ configuration: oidc[0] })
+        );
       }
     } else {
-      await this.props.updateOIDCAuthIntegration({
-        configuration: oidc[0],
-        id: this.props.authReadOnly.integrations.oidc[0].id,
-      });
+      onExecute(() =>
+        this.props.updateOIDCAuthIntegration({
+          configuration: oidc[0],
+          id: this.props.authReadOnly.integrations.oidc[0].id,
+        })
+      );
     }
     return cloned;
   };

src/core/client/admin/routes/configure/submitHook/SubmitHookContext.tsx

@@ -3,7 +3,12 @@ import React from "react";
 
 export type SubmitHook = (
   data: any,
-  cancel: (errors?: Record<string, React.ReactNode>) => void
+  actions: {
+    // Callback will be called after all validations has passed and
+    // the submit has not been cancelled.
+    onExecute: (cb: () => Promise<any>) => void;
+    cancel: (errors?: Record<string, React.ReactNode>) => void;
+  }
 ) => Promise<any> | any;
 export type RemoveSubmitHook = () => void;
 export type AddSubmitHook = (hook: SubmitHook) => RemoveSubmitHook;

src/core/client/framework/lib/network/createNetwork.ts

@@ -26,7 +26,8 @@ export default function createNetwork(tokenGetter: TokenGetter) {
     }),
     batchMiddleware({
       batchUrl: (requestMap: any) => Promise.resolve(graphqlURL),
-      batchTimeout: 10,
+      batchTimeout: 0,
+      allowMutations: true,
     }),
     retryMiddleware({
       fetchTimeout: 15000,