lint fix

invokeai/frontend/web/src/app/store/middleware/listenerMiddleware/index.ts

@@ -55,6 +55,7 @@ import { addUpscaleRequestedListener } from 'app/store/middleware/listenerMiddle
 import { addWorkflowLoadRequestedListener } from 'app/store/middleware/listenerMiddleware/listeners/workflowLoadRequested';
 import type { AppDispatch, RootState } from 'app/store/store';
 
+import { addControlAdapterAutoProcessorUpdateListener } from './listeners/controlAdapterAutoProcessorUpdateListener';
 import { addSetDefaultSettingsListener } from './listeners/setDefaultSettings';
 
 export const listenerMiddleware = createListenerMiddleware();
@@ -125,6 +126,7 @@ addBulkDownloadListeners(startAppListening);
 // ControlNet
 addControlNetImageProcessedListener(startAppListening);
 addControlNetAutoProcessListener(startAppListening);
+addControlAdapterAutoProcessorUpdateListener(startAppListening);
 
 // Boards
 addImageAddedToBoardFulfilledListener(startAppListening);

invokeai/frontend/web/src/app/store/middleware/listenerMiddleware/listeners/controlAdapterAutoProcessorUpdateListener.ts

@@ -0,0 +1,77 @@
+import { isAnyOf } from '@reduxjs/toolkit';
+import type { AppStartListening } from 'app/store/middleware/listenerMiddleware';
+import { CONTROLNET_MODEL_DEFAULT_PROCESSORS } from 'features/controlAdapters/store/constants';
+import {
+  controlAdapterAutoConfigToggled,
+  controlAdapterModelChanged,
+  controlAdapterProcessortTypeChanged,
+  selectControlAdapterById,
+} from 'features/controlAdapters/store/controlAdaptersSlice';
+import type { ControlAdapterProcessorType } from 'features/controlAdapters/store/types';
+import { isControlNetOrT2IAdapter } from 'features/controlAdapters/store/types';
+import { modelsApi } from 'services/api/endpoints/models';
+
+export const addControlAdapterAutoProcessorUpdateListener = (startAppListening: AppStartListening) => {
+  startAppListening({
+    matcher: isAnyOf(controlAdapterModelChanged, controlAdapterAutoConfigToggled),
+    effect: async (action, { getState, dispatch }) => {
+      let id;
+      let model;
+
+      const state = getState();
+      const { controlAdapters: controlAdaptersState } = state;
+
+      if (controlAdapterModelChanged.match(action)) {
+        model = action.payload.model;
+        id = action.payload.id;
+
+        const cn = selectControlAdapterById(controlAdaptersState, id);
+        if (!cn) {
+          return;
+        }
+
+        if (!isControlNetOrT2IAdapter(cn)) {
+          return;
+        }
+      }
+
+      if (controlAdapterAutoConfigToggled.match(action)) {
+        id = action.payload.id;
+
+        const cn = selectControlAdapterById(controlAdaptersState, id);
+        if (!cn) {
+          return;
+        }
+
+        if (!isControlNetOrT2IAdapter(cn)) {
+          return;
+        }
+
+        // if they turned off autoconfig, return
+        if (!cn.shouldAutoConfig) {
+          return;
+        }
+
+        model = cn.model;
+      }
+
+      if (!model || !id) {
+        return;
+      }
+
+      let processorType: ControlAdapterProcessorType | undefined = undefined;
+      const { data: modelConfig } = modelsApi.endpoints.getModelConfig.select(model.key)(state);
+
+      for (const modelSubstring in CONTROLNET_MODEL_DEFAULT_PROCESSORS) {
+        if (modelConfig?.name.includes(modelSubstring)) {
+          processorType = CONTROLNET_MODEL_DEFAULT_PROCESSORS[modelSubstring];
+          break;
+        }
+      }
+
+      dispatch(
+        controlAdapterProcessortTypeChanged({ id, processorType: processorType || 'none', shouldAutoConfig: true })
+      );
+    },
+  });
+};

invokeai/frontend/web/src/features/controlAdapters/hooks/useAddControlAdapter.ts

@@ -1,6 +1,12 @@
 import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
+import { CONTROLNET_MODEL_DEFAULT_PROCESSORS, CONTROLNET_PROCESSORS } from 'features/controlAdapters/store/constants';
 import { controlAdapterAdded } from 'features/controlAdapters/store/controlAdaptersSlice';
-import type { ControlAdapterType } from 'features/controlAdapters/store/types';
+import type {
+  ControlAdapterProcessorType,
+  ControlAdapterType,
+  RequiredControlAdapterProcessorNode,
+} from 'features/controlAdapters/store/types';
+import { cloneDeep } from 'lodash-es';
 import { useCallback, useMemo } from 'react';
 
 import { useControlAdapterModels } from './useControlAdapterModels';
@@ -22,6 +28,29 @@ export const useAddControlAdapter = (type: ControlAdapterType) => {
     return models[0];
   }, [baseModel, models]);
 
+  const processor = useMemo(() => {
+    let processorType;
+    for (const modelSubstring in CONTROLNET_MODEL_DEFAULT_PROCESSORS) {
+      if (firstModel?.name.includes(modelSubstring)) {
+        processorType = CONTROLNET_MODEL_DEFAULT_PROCESSORS[modelSubstring];
+        break;
+      }
+    }
+
+    if (!processorType) {
+      processorType = 'none';
+    }
+
+    const processorNode =
+      processorType === 'none'
+        ? (cloneDeep(CONTROLNET_PROCESSORS.none.default) as RequiredControlAdapterProcessorNode)
+        : (cloneDeep(
+            CONTROLNET_PROCESSORS[processorType as ControlAdapterProcessorType].default
+          ) as RequiredControlAdapterProcessorNode);
+
+    return { processorType, processorNode };
+  }, [firstModel]);
+
   const isDisabled = useMemo(() => !firstModel, [firstModel]);
 
   const addControlAdapter = useCallback(() => {
@@ -31,10 +60,10 @@ export const useAddControlAdapter = (type: ControlAdapterType) => {
     dispatch(
       controlAdapterAdded({
         type,
-        overrides: { model: firstModel },
+        overrides: { model: firstModel, ...processor },
       })
     );
-  }, [dispatch, firstModel, isDisabled, type]);
+  }, [dispatch, firstModel, isDisabled, type, processor]);
 
   return [addControlAdapter, isDisabled] as const;
 };

invokeai/frontend/web/src/features/controlAdapters/store/controlAdaptersSlice.ts

@@ -13,10 +13,7 @@ import { socketInvocationError } from 'services/events/actions';
 import { v4 as uuidv4 } from 'uuid';
 
 import { controlAdapterImageProcessed } from './actions';
-import {
-  CONTROLNET_MODEL_DEFAULT_PROCESSORS as CONTROLADAPTER_MODEL_DEFAULT_PROCESSORS,
-  CONTROLNET_PROCESSORS,
-} from './constants';
+import { CONTROLNET_PROCESSORS } from './constants';
 import type {
   ControlAdapterConfig,
   ControlAdapterProcessorType,
@@ -215,25 +212,6 @@ export const controlAdaptersSlice = createSlice({
 
       update.changes.processedControlImage = null;
 
-      let processorType: ControlAdapterProcessorType | undefined = undefined;
-
-      for (const modelSubstring in CONTROLADAPTER_MODEL_DEFAULT_PROCESSORS) {
-        // TODO(MM2): matching modelSubstring to the model key is no longer a valid way to figure out the default processorType
-        if (model.key.includes(modelSubstring)) {
-          processorType = CONTROLADAPTER_MODEL_DEFAULT_PROCESSORS[modelSubstring];
-          break;
-        }
-      }
-
-      if (processorType) {
-        update.changes.processorType = processorType;
-        update.changes.processorNode = CONTROLNET_PROCESSORS[processorType]
-          .default as RequiredControlAdapterProcessorNode;
-      } else {
-        update.changes.processorType = 'none';
-        update.changes.processorNode = CONTROLNET_PROCESSORS.none.default as RequiredControlAdapterProcessorNode;
-      }
-
       caAdapter.updateOne(state, update);
     },
     controlAdapterWeightChanged: (state, action: PayloadAction<{ id: string; weight: number }>) => {
@@ -298,17 +276,19 @@ export const controlAdaptersSlice = createSlice({
       action: PayloadAction<{
         id: string;
         processorType: ControlAdapterProcessorType;
+        shouldAutoConfig?: boolean;
       }>
     ) => {
-      const { id, processorType } = action.payload;
+      const { id, processorType, shouldAutoConfig = false } = action.payload;
       const cn = selectControlAdapterById(state, id);
       if (!cn || !isControlNetOrT2IAdapter(cn)) {
         return;
       }
 
-      const processorNode = cloneDeep(
-        CONTROLNET_PROCESSORS[processorType].default
-      ) as RequiredControlAdapterProcessorNode;
+      const processorNode =
+        processorType === 'none'
+          ? (cloneDeep(CONTROLNET_PROCESSORS.none.default) as RequiredControlAdapterProcessorNode)
+          : (cloneDeep(CONTROLNET_PROCESSORS[processorType].default) as RequiredControlAdapterProcessorNode);
 
       caAdapter.updateOne(state, {
         id,
@@ -316,7 +296,7 @@ export const controlAdaptersSlice = createSlice({
           processorType,
           processedControlImage: null,
           processorNode,
-          shouldAutoConfig: false,
+          shouldAutoConfig,
         },
       });
     },
@@ -337,28 +317,6 @@ export const controlAdaptersSlice = createSlice({
         changes: { shouldAutoConfig: !cn.shouldAutoConfig },
       };
 
-      if (update.changes.shouldAutoConfig) {
-        // manage the processor for the user
-        let processorType: ControlAdapterProcessorType | undefined = undefined;
-
-        for (const modelSubstring in CONTROLADAPTER_MODEL_DEFAULT_PROCESSORS) {
-          // TODO(MM2): matching modelSubstring to the model key is no longer a valid way to figure out the default processorType
-          if (cn.model?.key.includes(modelSubstring)) {
-            processorType = CONTROLADAPTER_MODEL_DEFAULT_PROCESSORS[modelSubstring];
-            break;
-          }
-        }
-
-        if (processorType) {
-          update.changes.processorType = processorType;
-          update.changes.processorNode = CONTROLNET_PROCESSORS[processorType]
-            .default as RequiredControlAdapterProcessorNode;
-        } else {
-          update.changes.processorType = 'none';
-          update.changes.processorNode = CONTROLNET_PROCESSORS.none.default as RequiredControlAdapterProcessorNode;
-        }
-      }
-
       caAdapter.updateOne(state, update);
     },
     controlAdaptersReset: () => {