diff --git a/invokeai/frontend/web/src/features/controlNet/components/ControlNet.tsx b/invokeai/frontend/web/src/features/controlNet/components/ControlNet.tsx
index b131e8641c..82398a7483 100644
--- a/invokeai/frontend/web/src/features/controlNet/components/ControlNet.tsx
+++ b/invokeai/frontend/web/src/features/controlNet/components/ControlNet.tsx
@@ -80,8 +80,8 @@ const ControlNet = (props: ControlNetProps) => {
     >
       <Flex sx={{ gap: 2 }}>
         <IAISwitch
-          tooltip="Toggle"
-          aria-label="Toggle"
+          tooltip={'Toggle this ControlNet'}
+          aria-label={'Toggle this ControlNet'}
           isChecked={isEnabled}
           onChange={handleToggleIsEnabled}
         />
@@ -143,9 +143,9 @@ const ControlNet = (props: ControlNetProps) => {
               borderRadius: 'full',
               top: 4,
               insetInlineEnd: 4,
-              bg: 'error.700',
+              bg: 'accent.700',
               _dark: {
-                bg: 'error.200',
+                bg: 'accent.400',
               },
             }}
           />
diff --git a/invokeai/frontend/web/src/features/controlNet/components/ControlNetImagePreview.tsx b/invokeai/frontend/web/src/features/controlNet/components/ControlNetImagePreview.tsx
index f82e39d34e..bb4ca07bbb 100644
--- a/invokeai/frontend/web/src/features/controlNet/components/ControlNetImagePreview.tsx
+++ b/invokeai/frontend/web/src/features/controlNet/components/ControlNetImagePreview.tsx
@@ -29,13 +29,18 @@ const ControlNetImagePreview = (props: Props) => {
         stateSelector,
         ({ controlNet }) => {
           const { pendingControlImages } = controlNet;
-          const { controlImage, processedControlImage, processorType } =
-            controlNet.controlNets[controlNetId];
+          const {
+            controlImage,
+            processedControlImage,
+            processorType,
+            isEnabled,
+          } = controlNet.controlNets[controlNetId];
 
           return {
             controlImageName: controlImage,
             processedControlImageName: processedControlImage,
             processorType,
+            isEnabled,
             pendingControlImages,
           };
         },
@@ -49,6 +54,7 @@ const ControlNetImagePreview = (props: Props) => {
     processedControlImageName,
     processorType,
     pendingControlImages,
+    isEnabled,
   } = useAppSelector(selector);
 
   const [isMouseOverImage, setIsMouseOverImage] = useState(false);
@@ -119,6 +125,8 @@ const ControlNetImagePreview = (props: Props) => {
         h: height,
         alignItems: 'center',
         justifyContent: 'center',
+        pointerEvents: isEnabled ? 'auto' : 'none',
+        opacity: isEnabled ? 1 : 0.5,
       }}
     >
       <IAIDndImage
diff --git a/invokeai/frontend/web/src/features/controlNet/components/ControlNetProcessorComponent.tsx b/invokeai/frontend/web/src/features/controlNet/components/ControlNetProcessorComponent.tsx
index 863e42632c..b7fa329eac 100644
--- a/invokeai/frontend/web/src/features/controlNet/components/ControlNetProcessorComponent.tsx
+++ b/invokeai/frontend/web/src/features/controlNet/components/ControlNetProcessorComponent.tsx
@@ -27,26 +27,36 @@ const ControlNetProcessorComponent = (props: ControlNetProcessorProps) => {
     () =>
       createSelector(
         stateSelector,
-        ({ controlNet }) => controlNet.controlNets[controlNetId]?.processorNode,
+        ({ controlNet }) => {
+          const { isEnabled, processorNode } =
+            controlNet.controlNets[controlNetId];
+
+          return { isEnabled, processorNode };
+        },
         defaultSelectorOptions
       ),
     [controlNetId]
   );
 
-  const processorNode = useAppSelector(selector);
+  const { isEnabled, processorNode } = useAppSelector(selector);
 
   if (processorNode.type === 'canny_image_processor') {
     return (
       <CannyProcessor
         controlNetId={controlNetId}
         processorNode={processorNode}
+        isEnabled={isEnabled}
       />
     );
   }
 
   if (processorNode.type === 'hed_image_processor') {
     return (
-      <HedProcessor controlNetId={controlNetId} processorNode={processorNode} />
+      <HedProcessor
+        controlNetId={controlNetId}
+        processorNode={processorNode}
+        isEnabled={isEnabled}
+      />
     );
   }
 
@@ -55,6 +65,7 @@ const ControlNetProcessorComponent = (props: ControlNetProcessorProps) => {
       <LineartProcessor
         controlNetId={controlNetId}
         processorNode={processorNode}
+        isEnabled={isEnabled}
       />
     );
   }
@@ -64,6 +75,7 @@ const ControlNetProcessorComponent = (props: ControlNetProcessorProps) => {
       <ContentShuffleProcessor
         controlNetId={controlNetId}
         processorNode={processorNode}
+        isEnabled={isEnabled}
       />
     );
   }
@@ -73,6 +85,7 @@ const ControlNetProcessorComponent = (props: ControlNetProcessorProps) => {
       <LineartAnimeProcessor
         controlNetId={controlNetId}
         processorNode={processorNode}
+        isEnabled={isEnabled}
       />
     );
   }
@@ -82,6 +95,7 @@ const ControlNetProcessorComponent = (props: ControlNetProcessorProps) => {
       <MediapipeFaceProcessor
         controlNetId={controlNetId}
         processorNode={processorNode}
+        isEnabled={isEnabled}
       />
     );
   }
@@ -91,6 +105,7 @@ const ControlNetProcessorComponent = (props: ControlNetProcessorProps) => {
       <MidasDepthProcessor
         controlNetId={controlNetId}
         processorNode={processorNode}
+        isEnabled={isEnabled}
       />
     );
   }
@@ -100,6 +115,7 @@ const ControlNetProcessorComponent = (props: ControlNetProcessorProps) => {
       <MlsdImageProcessor
         controlNetId={controlNetId}
         processorNode={processorNode}
+        isEnabled={isEnabled}
       />
     );
   }
@@ -109,6 +125,7 @@ const ControlNetProcessorComponent = (props: ControlNetProcessorProps) => {
       <NormalBaeProcessor
         controlNetId={controlNetId}
         processorNode={processorNode}
+        isEnabled={isEnabled}
       />
     );
   }
@@ -118,6 +135,7 @@ const ControlNetProcessorComponent = (props: ControlNetProcessorProps) => {
       <OpenposeProcessor
         controlNetId={controlNetId}
         processorNode={processorNode}
+        isEnabled={isEnabled}
       />
     );
   }
@@ -127,6 +145,7 @@ const ControlNetProcessorComponent = (props: ControlNetProcessorProps) => {
       <PidiProcessor
         controlNetId={controlNetId}
         processorNode={processorNode}
+        isEnabled={isEnabled}
       />
     );
   }
@@ -136,6 +155,7 @@ const ControlNetProcessorComponent = (props: ControlNetProcessorProps) => {
       <ZoeDepthProcessor
         controlNetId={controlNetId}
         processorNode={processorNode}
+        isEnabled={isEnabled}
       />
     );
   }
diff --git a/invokeai/frontend/web/src/features/controlNet/components/ParamControlNetShouldAutoConfig.tsx b/invokeai/frontend/web/src/features/controlNet/components/ParamControlNetShouldAutoConfig.tsx
index 8c0963561c..285fcf7b80 100644
--- a/invokeai/frontend/web/src/features/controlNet/components/ParamControlNetShouldAutoConfig.tsx
+++ b/invokeai/frontend/web/src/features/controlNet/components/ParamControlNetShouldAutoConfig.tsx
@@ -18,14 +18,17 @@ const ParamControlNetShouldAutoConfig = (props: Props) => {
     () =>
       createSelector(
         stateSelector,
-        ({ controlNet }) =>
-          controlNet.controlNets[controlNetId]?.shouldAutoConfig,
+        ({ controlNet }) => {
+          const { isEnabled, shouldAutoConfig } =
+            controlNet.controlNets[controlNetId];
+          return { isEnabled, shouldAutoConfig };
+        },
         defaultSelectorOptions
       ),
     [controlNetId]
   );
 
-  const shouldAutoConfig = useAppSelector(selector);
+  const { isEnabled, shouldAutoConfig } = useAppSelector(selector);
   const isBusy = useAppSelector(selectIsBusy);
 
   const handleShouldAutoConfigChanged = useCallback(() => {
@@ -38,7 +41,7 @@ const ParamControlNetShouldAutoConfig = (props: Props) => {
       aria-label="Auto configure processor"
       isChecked={shouldAutoConfig}
       onChange={handleShouldAutoConfigChanged}
-      isDisabled={isBusy}
+      isDisabled={isBusy || !isEnabled}
     />
   );
 };
diff --git a/invokeai/frontend/web/src/features/controlNet/components/parameters/ParamControlNetBeginEnd.tsx b/invokeai/frontend/web/src/features/controlNet/components/parameters/ParamControlNetBeginEnd.tsx
index 57cf3f439e..f2f8a8bef2 100644
--- a/invokeai/frontend/web/src/features/controlNet/components/parameters/ParamControlNetBeginEnd.tsx
+++ b/invokeai/frontend/web/src/features/controlNet/components/parameters/ParamControlNetBeginEnd.tsx
@@ -34,16 +34,16 @@ const ParamControlNetBeginEnd = (props: Props) => {
       createSelector(
         stateSelector,
         ({ controlNet }) => {
-          const { beginStepPct, endStepPct } =
+          const { beginStepPct, endStepPct, isEnabled } =
             controlNet.controlNets[controlNetId];
-          return { beginStepPct, endStepPct };
+          return { beginStepPct, endStepPct, isEnabled };
         },
         defaultSelectorOptions
       ),
     [controlNetId]
   );
 
-  const { beginStepPct, endStepPct } = useAppSelector(selector);
+  const { beginStepPct, endStepPct, isEnabled } = useAppSelector(selector);
 
   const handleStepPctChanged = useCallback(
     (v: number[]) => {
@@ -61,7 +61,7 @@ const ParamControlNetBeginEnd = (props: Props) => {
   }, [controlNetId, dispatch]);
 
   return (
-    <FormControl>
+    <FormControl isDisabled={!isEnabled}>
       <FormLabel>Begin / End Step Percentage</FormLabel>
       <HStack w="100%" gap={2} alignItems="center">
         <RangeSlider
@@ -72,6 +72,7 @@ const ParamControlNetBeginEnd = (props: Props) => {
           max={1}
           step={0.01}
           minStepsBetweenThumbs={5}
+          isDisabled={!isEnabled}
         >
           <RangeSliderTrack>
             <RangeSliderFilledTrack />
diff --git a/invokeai/frontend/web/src/features/controlNet/components/parameters/ParamControlNetControlMode.tsx b/invokeai/frontend/web/src/features/controlNet/components/parameters/ParamControlNetControlMode.tsx
index 07b58384e1..a1eff1263a 100644
--- a/invokeai/frontend/web/src/features/controlNet/components/parameters/ParamControlNetControlMode.tsx
+++ b/invokeai/frontend/web/src/features/controlNet/components/parameters/ParamControlNetControlMode.tsx
@@ -30,13 +30,17 @@ export default function ParamControlNetControlMode(
     () =>
       createSelector(
         stateSelector,
-        ({ controlNet }) => controlNet.controlNets[controlNetId]?.controlMode,
+        ({ controlNet }) => {
+          const { controlMode, isEnabled } =
+            controlNet.controlNets[controlNetId];
+          return { controlMode, isEnabled };
+        },
         defaultSelectorOptions
       ),
     [controlNetId]
   );
 
-  const controlMode = useAppSelector(selector);
+  const { controlMode, isEnabled } = useAppSelector(selector);
 
   const { t } = useTranslation();
 
@@ -49,6 +53,7 @@ export default function ParamControlNetControlMode(
 
   return (
     <IAIMantineSelect
+      disabled={!isEnabled}
       label={t('parameters.controlNetControlMode')}
       data={CONTROL_MODE_DATA}
       value={String(controlMode)}
diff --git a/invokeai/frontend/web/src/features/controlNet/components/parameters/ParamControlNetIsEnabled.tsx b/invokeai/frontend/web/src/features/controlNet/components/parameters/ParamControlNetIsEnabled.tsx
deleted file mode 100644
index d7f519a7b6..0000000000
--- a/invokeai/frontend/web/src/features/controlNet/components/parameters/ParamControlNetIsEnabled.tsx
+++ /dev/null
@@ -1,28 +0,0 @@
-import { useAppDispatch } from 'app/store/storeHooks';
-import IAISwitch from 'common/components/IAISwitch';
-import { controlNetToggled } from 'features/controlNet/store/controlNetSlice';
-import { memo, useCallback } from 'react';
-
-type ParamControlNetIsEnabledProps = {
-  controlNetId: string;
-  isEnabled: boolean;
-};
-
-const ParamControlNetIsEnabled = (props: ParamControlNetIsEnabledProps) => {
-  const { controlNetId, isEnabled } = props;
-  const dispatch = useAppDispatch();
-
-  const handleIsEnabledChanged = useCallback(() => {
-    dispatch(controlNetToggled({ controlNetId }));
-  }, [dispatch, controlNetId]);
-
-  return (
-    <IAISwitch
-      label="Enabled"
-      isChecked={isEnabled}
-      onChange={handleIsEnabledChanged}
-    />
-  );
-};
-
-export default memo(ParamControlNetIsEnabled);
diff --git a/invokeai/frontend/web/src/features/controlNet/components/parameters/ParamControlNetModel.tsx b/invokeai/frontend/web/src/features/controlNet/components/parameters/ParamControlNetModel.tsx
index 548acfaea7..8392bdd2e3 100644
--- a/invokeai/frontend/web/src/features/controlNet/components/parameters/ParamControlNetModel.tsx
+++ b/invokeai/frontend/web/src/features/controlNet/components/parameters/ParamControlNetModel.tsx
@@ -29,14 +29,15 @@ const ParamControlNetModel = (props: ParamControlNetModelProps) => {
         ({ generation, controlNet }) => {
           const { model } = generation;
           const controlNetModel = controlNet.controlNets[controlNetId]?.model;
-          return { mainModel: model, controlNetModel };
+          const isEnabled = controlNet.controlNets[controlNetId]?.isEnabled;
+          return { mainModel: model, controlNetModel, isEnabled };
         },
         defaultSelectorOptions
       ),
     [controlNetId]
   );
 
-  const { mainModel, controlNetModel } = useAppSelector(selector);
+  const { mainModel, controlNetModel, isEnabled } = useAppSelector(selector);
 
   const { data: controlNetModels } = useGetControlNetModelsQuery();
 
@@ -110,7 +111,7 @@ const ParamControlNetModel = (props: ParamControlNetModelProps) => {
       placeholder="Select a model"
       value={selectedModel?.id ?? null}
       onChange={handleModelChanged}
-      disabled={isBusy}
+      disabled={isBusy || !isEnabled}
       tooltip={selectedModel?.description}
     />
   );
diff --git a/invokeai/frontend/web/src/features/controlNet/components/parameters/ParamControlNetProcessorSelect.tsx b/invokeai/frontend/web/src/features/controlNet/components/parameters/ParamControlNetProcessorSelect.tsx
index a57de5d70e..83c66363ac 100644
--- a/invokeai/frontend/web/src/features/controlNet/components/parameters/ParamControlNetProcessorSelect.tsx
+++ b/invokeai/frontend/web/src/features/controlNet/components/parameters/ParamControlNetProcessorSelect.tsx
@@ -57,16 +57,18 @@ const ParamControlNetProcessorSelect = (
     () =>
       createSelector(
         stateSelector,
-        ({ controlNet }) => ({
-          processorNode: controlNet.controlNets[controlNetId]?.processorNode,
-        }),
+        ({ controlNet }) => {
+          const { isEnabled, processorNode } =
+            controlNet.controlNets[controlNetId];
+          return { isEnabled, processorNode };
+        },
         defaultSelectorOptions
       ),
     [controlNetId]
   );
   const isBusy = useAppSelector(selectIsBusy);
   const controlNetProcessors = useAppSelector(selector);
-  const { processorNode } = useAppSelector(processorNodeSelector);
+  const { isEnabled, processorNode } = useAppSelector(processorNodeSelector);
 
   const handleProcessorTypeChanged = useCallback(
     (v: string | null) => {
@@ -86,7 +88,7 @@ const ParamControlNetProcessorSelect = (
       value={processorNode.type ?? 'canny_image_processor'}
       data={controlNetProcessors}
       onChange={handleProcessorTypeChanged}
-      disabled={isBusy}
+      disabled={isBusy || !isEnabled}
     />
   );
 };
diff --git a/invokeai/frontend/web/src/features/controlNet/components/parameters/ParamControlNetWeight.tsx b/invokeai/frontend/web/src/features/controlNet/components/parameters/ParamControlNetWeight.tsx
index f7a2a24cd5..8643fd7dad 100644
--- a/invokeai/frontend/web/src/features/controlNet/components/parameters/ParamControlNetWeight.tsx
+++ b/invokeai/frontend/web/src/features/controlNet/components/parameters/ParamControlNetWeight.tsx
@@ -17,13 +17,16 @@ const ParamControlNetWeight = (props: ParamControlNetWeightProps) => {
     () =>
       createSelector(
         stateSelector,
-        ({ controlNet }) => controlNet.controlNets[controlNetId]?.weight,
+        ({ controlNet }) => {
+          const { weight, isEnabled } = controlNet.controlNets[controlNetId];
+          return { weight, isEnabled };
+        },
         defaultSelectorOptions
       ),
     [controlNetId]
   );
 
-  const weight = useAppSelector(selector);
+  const { weight, isEnabled } = useAppSelector(selector);
   const handleWeightChanged = useCallback(
     (weight: number) => {
       dispatch(controlNetWeightChanged({ controlNetId, weight }));
@@ -33,6 +36,7 @@ const ParamControlNetWeight = (props: ParamControlNetWeightProps) => {
 
   return (
     <IAISlider
+      isDisabled={!isEnabled}
       label={'Weight'}
       value={weight}
       onChange={handleWeightChanged}
diff --git a/invokeai/frontend/web/src/features/controlNet/components/processors/CannyProcessor.tsx b/invokeai/frontend/web/src/features/controlNet/components/processors/CannyProcessor.tsx
index 1b62056c7a..e226e2a55c 100644
--- a/invokeai/frontend/web/src/features/controlNet/components/processors/CannyProcessor.tsx
+++ b/invokeai/frontend/web/src/features/controlNet/components/processors/CannyProcessor.tsx
@@ -1,22 +1,25 @@
+import { useAppSelector } from 'app/store/storeHooks';
 import IAISlider from 'common/components/IAISlider';
 import { CONTROLNET_PROCESSORS } from 'features/controlNet/store/constants';
 import { RequiredCannyImageProcessorInvocation } from 'features/controlNet/store/types';
+import { selectIsBusy } from 'features/system/store/systemSelectors';
 import { memo, useCallback } from 'react';
 import { useProcessorNodeChanged } from '../hooks/useProcessorNodeChanged';
 import ProcessorWrapper from './common/ProcessorWrapper';
-import { useIsReadyToInvoke } from 'common/hooks/useIsReadyToInvoke';
 
-const DEFAULTS = CONTROLNET_PROCESSORS.canny_image_processor.default;
+const DEFAULTS = CONTROLNET_PROCESSORS.canny_image_processor
+  .default as RequiredCannyImageProcessorInvocation;
 
 type CannyProcessorProps = {
   controlNetId: string;
   processorNode: RequiredCannyImageProcessorInvocation;
+  isEnabled: boolean;
 };
 
 const CannyProcessor = (props: CannyProcessorProps) => {
-  const { controlNetId, processorNode } = props;
+  const { controlNetId, processorNode, isEnabled } = props;
   const { low_threshold, high_threshold } = processorNode;
-  const isReady = useIsReadyToInvoke();
+  const isBusy = useAppSelector(selectIsBusy);
   const processorChanged = useProcessorNodeChanged();
 
   const handleLowThresholdChanged = useCallback(
@@ -48,7 +51,7 @@ const CannyProcessor = (props: CannyProcessorProps) => {
   return (
     <ProcessorWrapper>
       <IAISlider
-        isDisabled={!isReady}
+        isDisabled={isBusy || !isEnabled}
         label="Low Threshold"
         value={low_threshold}
         onChange={handleLowThresholdChanged}
@@ -60,7 +63,7 @@ const CannyProcessor = (props: CannyProcessorProps) => {
         withSliderMarks
       />
       <IAISlider
-        isDisabled={!isReady}
+        isDisabled={isBusy || !isEnabled}
         label="High Threshold"
         value={high_threshold}
         onChange={handleHighThresholdChanged}
diff --git a/invokeai/frontend/web/src/features/controlNet/components/processors/ContentShuffleProcessor.tsx b/invokeai/frontend/web/src/features/controlNet/components/processors/ContentShuffleProcessor.tsx
index 70f97fc6ad..d66f0a0aa8 100644
--- a/invokeai/frontend/web/src/features/controlNet/components/processors/ContentShuffleProcessor.tsx
+++ b/invokeai/frontend/web/src/features/controlNet/components/processors/ContentShuffleProcessor.tsx
@@ -4,20 +4,23 @@ import { RequiredContentShuffleImageProcessorInvocation } from 'features/control
 import { memo, useCallback } from 'react';
 import { useProcessorNodeChanged } from '../hooks/useProcessorNodeChanged';
 import ProcessorWrapper from './common/ProcessorWrapper';
-import { useIsReadyToInvoke } from 'common/hooks/useIsReadyToInvoke';
+import { useAppSelector } from 'app/store/storeHooks';
+import { selectIsBusy } from 'features/system/store/systemSelectors';
 
-const DEFAULTS = CONTROLNET_PROCESSORS.content_shuffle_image_processor.default;
+const DEFAULTS = CONTROLNET_PROCESSORS.content_shuffle_image_processor
+  .default as RequiredContentShuffleImageProcessorInvocation;
 
 type Props = {
   controlNetId: string;
   processorNode: RequiredContentShuffleImageProcessorInvocation;
+  isEnabled: boolean;
 };
 
 const ContentShuffleProcessor = (props: Props) => {
-  const { controlNetId, processorNode } = props;
+  const { controlNetId, processorNode, isEnabled } = props;
   const { image_resolution, detect_resolution, w, h, f } = processorNode;
   const processorChanged = useProcessorNodeChanged();
-  const isReady = useIsReadyToInvoke();
+  const isBusy = useAppSelector(selectIsBusy);
 
   const handleDetectResolutionChanged = useCallback(
     (v: number) => {
@@ -96,7 +99,7 @@ const ContentShuffleProcessor = (props: Props) => {
         max={4096}
         withInput
         withSliderMarks
-        isDisabled={!isReady}
+        isDisabled={isBusy || !isEnabled}
       />
       <IAISlider
         label="Image Resolution"
@@ -108,7 +111,7 @@ const ContentShuffleProcessor = (props: Props) => {
         max={4096}
         withInput
         withSliderMarks
-        isDisabled={!isReady}
+        isDisabled={isBusy || !isEnabled}
       />
       <IAISlider
         label="W"
@@ -120,7 +123,7 @@ const ContentShuffleProcessor = (props: Props) => {
         max={4096}
         withInput
         withSliderMarks
-        isDisabled={!isReady}
+        isDisabled={isBusy || !isEnabled}
       />
       <IAISlider
         label="H"
@@ -132,7 +135,7 @@ const ContentShuffleProcessor = (props: Props) => {
         max={4096}
         withInput
         withSliderMarks
-        isDisabled={!isReady}
+        isDisabled={isBusy || !isEnabled}
       />
       <IAISlider
         label="F"
@@ -144,7 +147,7 @@ const ContentShuffleProcessor = (props: Props) => {
         max={4096}
         withInput
         withSliderMarks
-        isDisabled={!isReady}
+        isDisabled={isBusy || !isEnabled}
       />
     </ProcessorWrapper>
   );
diff --git a/invokeai/frontend/web/src/features/controlNet/components/processors/HedProcessor.tsx b/invokeai/frontend/web/src/features/controlNet/components/processors/HedProcessor.tsx
index c51a44d1c3..04d6027ff9 100644
--- a/invokeai/frontend/web/src/features/controlNet/components/processors/HedProcessor.tsx
+++ b/invokeai/frontend/web/src/features/controlNet/components/processors/HedProcessor.tsx
@@ -1,25 +1,29 @@
+import { useAppSelector } from 'app/store/storeHooks';
 import IAISlider from 'common/components/IAISlider';
 import IAISwitch from 'common/components/IAISwitch';
 import { CONTROLNET_PROCESSORS } from 'features/controlNet/store/constants';
 import { RequiredHedImageProcessorInvocation } from 'features/controlNet/store/types';
+import { selectIsBusy } from 'features/system/store/systemSelectors';
 import { ChangeEvent, memo, useCallback } from 'react';
 import { useProcessorNodeChanged } from '../hooks/useProcessorNodeChanged';
 import ProcessorWrapper from './common/ProcessorWrapper';
-import { useIsReadyToInvoke } from 'common/hooks/useIsReadyToInvoke';
 
-const DEFAULTS = CONTROLNET_PROCESSORS.hed_image_processor.default;
+const DEFAULTS = CONTROLNET_PROCESSORS.hed_image_processor
+  .default as RequiredHedImageProcessorInvocation;
 
 type HedProcessorProps = {
   controlNetId: string;
   processorNode: RequiredHedImageProcessorInvocation;
+  isEnabled: boolean;
 };
 
 const HedPreprocessor = (props: HedProcessorProps) => {
   const {
     controlNetId,
     processorNode: { detect_resolution, image_resolution, scribble },
+    isEnabled,
   } = props;
-  const isReady = useIsReadyToInvoke();
+  const isBusy = useAppSelector(selectIsBusy);
   const processorChanged = useProcessorNodeChanged();
 
   const handleDetectResolutionChanged = useCallback(
@@ -67,7 +71,7 @@ const HedPreprocessor = (props: HedProcessorProps) => {
         max={4096}
         withInput
         withSliderMarks
-        isDisabled={!isReady}
+        isDisabled={isBusy || !isEnabled}
       />
       <IAISlider
         label="Image Resolution"
@@ -79,13 +83,13 @@ const HedPreprocessor = (props: HedProcessorProps) => {
         max={4096}
         withInput
         withSliderMarks
-        isDisabled={!isReady}
+        isDisabled={isBusy || !isEnabled}
       />
       <IAISwitch
         label="Scribble"
         isChecked={scribble}
         onChange={handleScribbleChanged}
-        isDisabled={!isReady}
+        isDisabled={isBusy || !isEnabled}
       />
     </ProcessorWrapper>
   );
diff --git a/invokeai/frontend/web/src/features/controlNet/components/processors/LineartAnimeProcessor.tsx b/invokeai/frontend/web/src/features/controlNet/components/processors/LineartAnimeProcessor.tsx
index bc64e3c843..90177e7ceb 100644
--- a/invokeai/frontend/web/src/features/controlNet/components/processors/LineartAnimeProcessor.tsx
+++ b/invokeai/frontend/web/src/features/controlNet/components/processors/LineartAnimeProcessor.tsx
@@ -1,23 +1,26 @@
+import { useAppSelector } from 'app/store/storeHooks';
 import IAISlider from 'common/components/IAISlider';
 import { CONTROLNET_PROCESSORS } from 'features/controlNet/store/constants';
 import { RequiredLineartAnimeImageProcessorInvocation } from 'features/controlNet/store/types';
+import { selectIsBusy } from 'features/system/store/systemSelectors';
 import { memo, useCallback } from 'react';
 import { useProcessorNodeChanged } from '../hooks/useProcessorNodeChanged';
 import ProcessorWrapper from './common/ProcessorWrapper';
-import { useIsReadyToInvoke } from 'common/hooks/useIsReadyToInvoke';
 
-const DEFAULTS = CONTROLNET_PROCESSORS.lineart_anime_image_processor.default;
+const DEFAULTS = CONTROLNET_PROCESSORS.lineart_anime_image_processor
+  .default as RequiredLineartAnimeImageProcessorInvocation;
 
 type Props = {
   controlNetId: string;
   processorNode: RequiredLineartAnimeImageProcessorInvocation;
+  isEnabled: boolean;
 };
 
 const LineartAnimeProcessor = (props: Props) => {
-  const { controlNetId, processorNode } = props;
+  const { controlNetId, processorNode, isEnabled } = props;
   const { image_resolution, detect_resolution } = processorNode;
   const processorChanged = useProcessorNodeChanged();
-  const isReady = useIsReadyToInvoke();
+  const isBusy = useAppSelector(selectIsBusy);
 
   const handleDetectResolutionChanged = useCallback(
     (v: number) => {
@@ -57,7 +60,7 @@ const LineartAnimeProcessor = (props: Props) => {
         max={4096}
         withInput
         withSliderMarks
-        isDisabled={!isReady}
+        isDisabled={isBusy || !isEnabled}
       />
       <IAISlider
         label="Image Resolution"
@@ -69,7 +72,7 @@ const LineartAnimeProcessor = (props: Props) => {
         max={4096}
         withInput
         withSliderMarks
-        isDisabled={!isReady}
+        isDisabled={isBusy || !isEnabled}
       />
     </ProcessorWrapper>
   );
diff --git a/invokeai/frontend/web/src/features/controlNet/components/processors/LineartProcessor.tsx b/invokeai/frontend/web/src/features/controlNet/components/processors/LineartProcessor.tsx
index 11245bf4a7..7f661b1cb9 100644
--- a/invokeai/frontend/web/src/features/controlNet/components/processors/LineartProcessor.tsx
+++ b/invokeai/frontend/web/src/features/controlNet/components/processors/LineartProcessor.tsx
@@ -1,24 +1,27 @@
+import { useAppSelector } from 'app/store/storeHooks';
 import IAISlider from 'common/components/IAISlider';
 import IAISwitch from 'common/components/IAISwitch';
 import { CONTROLNET_PROCESSORS } from 'features/controlNet/store/constants';
 import { RequiredLineartImageProcessorInvocation } from 'features/controlNet/store/types';
+import { selectIsBusy } from 'features/system/store/systemSelectors';
 import { ChangeEvent, memo, useCallback } from 'react';
 import { useProcessorNodeChanged } from '../hooks/useProcessorNodeChanged';
 import ProcessorWrapper from './common/ProcessorWrapper';
-import { useIsReadyToInvoke } from 'common/hooks/useIsReadyToInvoke';
 
-const DEFAULTS = CONTROLNET_PROCESSORS.lineart_image_processor.default;
+const DEFAULTS = CONTROLNET_PROCESSORS.lineart_image_processor
+  .default as RequiredLineartImageProcessorInvocation;
 
 type LineartProcessorProps = {
   controlNetId: string;
   processorNode: RequiredLineartImageProcessorInvocation;
+  isEnabled: boolean;
 };
 
 const LineartProcessor = (props: LineartProcessorProps) => {
-  const { controlNetId, processorNode } = props;
+  const { controlNetId, processorNode, isEnabled } = props;
   const { image_resolution, detect_resolution, coarse } = processorNode;
   const processorChanged = useProcessorNodeChanged();
-  const isReady = useIsReadyToInvoke();
+  const isBusy = useAppSelector(selectIsBusy);
 
   const handleDetectResolutionChanged = useCallback(
     (v: number) => {
@@ -65,7 +68,7 @@ const LineartProcessor = (props: LineartProcessorProps) => {
         max={4096}
         withInput
         withSliderMarks
-        isDisabled={!isReady}
+        isDisabled={isBusy || !isEnabled}
       />
       <IAISlider
         label="Image Resolution"
@@ -77,13 +80,13 @@ const LineartProcessor = (props: LineartProcessorProps) => {
         max={4096}
         withInput
         withSliderMarks
-        isDisabled={!isReady}
+        isDisabled={isBusy || !isEnabled}
       />
       <IAISwitch
         label="Coarse"
         isChecked={coarse}
         onChange={handleCoarseChanged}
-        isDisabled={!isReady}
+        isDisabled={isBusy || !isEnabled}
       />
     </ProcessorWrapper>
   );
diff --git a/invokeai/frontend/web/src/features/controlNet/components/processors/MediapipeFaceProcessor.tsx b/invokeai/frontend/web/src/features/controlNet/components/processors/MediapipeFaceProcessor.tsx
index 27aa22ca40..b8b24ce877 100644
--- a/invokeai/frontend/web/src/features/controlNet/components/processors/MediapipeFaceProcessor.tsx
+++ b/invokeai/frontend/web/src/features/controlNet/components/processors/MediapipeFaceProcessor.tsx
@@ -1,23 +1,26 @@
+import { useAppSelector } from 'app/store/storeHooks';
 import IAISlider from 'common/components/IAISlider';
 import { CONTROLNET_PROCESSORS } from 'features/controlNet/store/constants';
 import { RequiredMediapipeFaceProcessorInvocation } from 'features/controlNet/store/types';
+import { selectIsBusy } from 'features/system/store/systemSelectors';
 import { memo, useCallback } from 'react';
 import { useProcessorNodeChanged } from '../hooks/useProcessorNodeChanged';
 import ProcessorWrapper from './common/ProcessorWrapper';
-import { useIsReadyToInvoke } from 'common/hooks/useIsReadyToInvoke';
 
-const DEFAULTS = CONTROLNET_PROCESSORS.mediapipe_face_processor.default;
+const DEFAULTS = CONTROLNET_PROCESSORS.mediapipe_face_processor
+  .default as RequiredMediapipeFaceProcessorInvocation;
 
 type Props = {
   controlNetId: string;
   processorNode: RequiredMediapipeFaceProcessorInvocation;
+  isEnabled: boolean;
 };
 
 const MediapipeFaceProcessor = (props: Props) => {
-  const { controlNetId, processorNode } = props;
+  const { controlNetId, processorNode, isEnabled } = props;
   const { max_faces, min_confidence } = processorNode;
   const processorChanged = useProcessorNodeChanged();
-  const isReady = useIsReadyToInvoke();
+  const isBusy = useAppSelector(selectIsBusy);
 
   const handleMaxFacesChanged = useCallback(
     (v: number) => {
@@ -53,7 +56,7 @@ const MediapipeFaceProcessor = (props: Props) => {
         max={20}
         withInput
         withSliderMarks
-        isDisabled={!isReady}
+        isDisabled={isBusy || !isEnabled}
       />
       <IAISlider
         label="Min Confidence"
@@ -66,7 +69,7 @@ const MediapipeFaceProcessor = (props: Props) => {
         step={0.01}
         withInput
         withSliderMarks
-        isDisabled={!isReady}
+        isDisabled={isBusy || !isEnabled}
       />
     </ProcessorWrapper>
   );
diff --git a/invokeai/frontend/web/src/features/controlNet/components/processors/MidasDepthProcessor.tsx b/invokeai/frontend/web/src/features/controlNet/components/processors/MidasDepthProcessor.tsx
index ffecb68061..54b174b5df 100644
--- a/invokeai/frontend/web/src/features/controlNet/components/processors/MidasDepthProcessor.tsx
+++ b/invokeai/frontend/web/src/features/controlNet/components/processors/MidasDepthProcessor.tsx
@@ -1,23 +1,26 @@
+import { useAppSelector } from 'app/store/storeHooks';
 import IAISlider from 'common/components/IAISlider';
 import { CONTROLNET_PROCESSORS } from 'features/controlNet/store/constants';
 import { RequiredMidasDepthImageProcessorInvocation } from 'features/controlNet/store/types';
+import { selectIsBusy } from 'features/system/store/systemSelectors';
 import { memo, useCallback } from 'react';
 import { useProcessorNodeChanged } from '../hooks/useProcessorNodeChanged';
 import ProcessorWrapper from './common/ProcessorWrapper';
-import { useIsReadyToInvoke } from 'common/hooks/useIsReadyToInvoke';
 
-const DEFAULTS = CONTROLNET_PROCESSORS.midas_depth_image_processor.default;
+const DEFAULTS = CONTROLNET_PROCESSORS.midas_depth_image_processor
+  .default as RequiredMidasDepthImageProcessorInvocation;
 
 type Props = {
   controlNetId: string;
   processorNode: RequiredMidasDepthImageProcessorInvocation;
+  isEnabled: boolean;
 };
 
 const MidasDepthProcessor = (props: Props) => {
-  const { controlNetId, processorNode } = props;
+  const { controlNetId, processorNode, isEnabled } = props;
   const { a_mult, bg_th } = processorNode;
   const processorChanged = useProcessorNodeChanged();
-  const isReady = useIsReadyToInvoke();
+  const isBusy = useAppSelector(selectIsBusy);
 
   const handleAMultChanged = useCallback(
     (v: number) => {
@@ -54,7 +57,7 @@ const MidasDepthProcessor = (props: Props) => {
         step={0.01}
         withInput
         withSliderMarks
-        isDisabled={!isReady}
+        isDisabled={isBusy || !isEnabled}
       />
       <IAISlider
         label="bg_th"
@@ -67,7 +70,7 @@ const MidasDepthProcessor = (props: Props) => {
         step={0.01}
         withInput
         withSliderMarks
-        isDisabled={!isReady}
+        isDisabled={isBusy || !isEnabled}
       />
     </ProcessorWrapper>
   );
diff --git a/invokeai/frontend/web/src/features/controlNet/components/processors/MlsdImageProcessor.tsx b/invokeai/frontend/web/src/features/controlNet/components/processors/MlsdImageProcessor.tsx
index 728c4b44fa..9a86cd2cb5 100644
--- a/invokeai/frontend/web/src/features/controlNet/components/processors/MlsdImageProcessor.tsx
+++ b/invokeai/frontend/web/src/features/controlNet/components/processors/MlsdImageProcessor.tsx
@@ -1,23 +1,26 @@
+import { useAppSelector } from 'app/store/storeHooks';
 import IAISlider from 'common/components/IAISlider';
 import { CONTROLNET_PROCESSORS } from 'features/controlNet/store/constants';
 import { RequiredMlsdImageProcessorInvocation } from 'features/controlNet/store/types';
+import { selectIsBusy } from 'features/system/store/systemSelectors';
 import { memo, useCallback } from 'react';
 import { useProcessorNodeChanged } from '../hooks/useProcessorNodeChanged';
 import ProcessorWrapper from './common/ProcessorWrapper';
-import { useIsReadyToInvoke } from 'common/hooks/useIsReadyToInvoke';
 
-const DEFAULTS = CONTROLNET_PROCESSORS.mlsd_image_processor.default;
+const DEFAULTS = CONTROLNET_PROCESSORS.mlsd_image_processor
+  .default as RequiredMlsdImageProcessorInvocation;
 
 type Props = {
   controlNetId: string;
   processorNode: RequiredMlsdImageProcessorInvocation;
+  isEnabled: boolean;
 };
 
 const MlsdImageProcessor = (props: Props) => {
-  const { controlNetId, processorNode } = props;
+  const { controlNetId, processorNode, isEnabled } = props;
   const { image_resolution, detect_resolution, thr_d, thr_v } = processorNode;
   const processorChanged = useProcessorNodeChanged();
-  const isReady = useIsReadyToInvoke();
+  const isBusy = useAppSelector(selectIsBusy);
 
   const handleDetectResolutionChanged = useCallback(
     (v: number) => {
@@ -79,7 +82,7 @@ const MlsdImageProcessor = (props: Props) => {
         max={4096}
         withInput
         withSliderMarks
-        isDisabled={!isReady}
+        isDisabled={isBusy || !isEnabled}
       />
       <IAISlider
         label="Image Resolution"
@@ -91,7 +94,7 @@ const MlsdImageProcessor = (props: Props) => {
         max={4096}
         withInput
         withSliderMarks
-        isDisabled={!isReady}
+        isDisabled={isBusy || !isEnabled}
       />
       <IAISlider
         label="W"
@@ -104,7 +107,7 @@ const MlsdImageProcessor = (props: Props) => {
         step={0.01}
         withInput
         withSliderMarks
-        isDisabled={!isReady}
+        isDisabled={isBusy || !isEnabled}
       />
       <IAISlider
         label="H"
@@ -117,7 +120,7 @@ const MlsdImageProcessor = (props: Props) => {
         step={0.01}
         withInput
         withSliderMarks
-        isDisabled={!isReady}
+        isDisabled={isBusy || !isEnabled}
       />
     </ProcessorWrapper>
   );
diff --git a/invokeai/frontend/web/src/features/controlNet/components/processors/NormalBaeProcessor.tsx b/invokeai/frontend/web/src/features/controlNet/components/processors/NormalBaeProcessor.tsx
index d5dce8d492..a0a8ad72cf 100644
--- a/invokeai/frontend/web/src/features/controlNet/components/processors/NormalBaeProcessor.tsx
+++ b/invokeai/frontend/web/src/features/controlNet/components/processors/NormalBaeProcessor.tsx
@@ -1,23 +1,26 @@
+import { useAppSelector } from 'app/store/storeHooks';
 import IAISlider from 'common/components/IAISlider';
 import { CONTROLNET_PROCESSORS } from 'features/controlNet/store/constants';
 import { RequiredNormalbaeImageProcessorInvocation } from 'features/controlNet/store/types';
+import { selectIsBusy } from 'features/system/store/systemSelectors';
 import { memo, useCallback } from 'react';
 import { useProcessorNodeChanged } from '../hooks/useProcessorNodeChanged';
 import ProcessorWrapper from './common/ProcessorWrapper';
-import { useIsReadyToInvoke } from 'common/hooks/useIsReadyToInvoke';
 
-const DEFAULTS = CONTROLNET_PROCESSORS.normalbae_image_processor.default;
+const DEFAULTS = CONTROLNET_PROCESSORS.normalbae_image_processor
+  .default as RequiredNormalbaeImageProcessorInvocation;
 
 type Props = {
   controlNetId: string;
   processorNode: RequiredNormalbaeImageProcessorInvocation;
+  isEnabled: boolean;
 };
 
 const NormalBaeProcessor = (props: Props) => {
-  const { controlNetId, processorNode } = props;
+  const { controlNetId, processorNode, isEnabled } = props;
   const { image_resolution, detect_resolution } = processorNode;
   const processorChanged = useProcessorNodeChanged();
-  const isReady = useIsReadyToInvoke();
+  const isBusy = useAppSelector(selectIsBusy);
 
   const handleDetectResolutionChanged = useCallback(
     (v: number) => {
@@ -57,7 +60,7 @@ const NormalBaeProcessor = (props: Props) => {
         max={4096}
         withInput
         withSliderMarks
-        isDisabled={!isReady}
+        isDisabled={isBusy || !isEnabled}
       />
       <IAISlider
         label="Image Resolution"
@@ -69,7 +72,7 @@ const NormalBaeProcessor = (props: Props) => {
         max={4096}
         withInput
         withSliderMarks
-        isDisabled={!isReady}
+        isDisabled={isBusy || !isEnabled}
       />
     </ProcessorWrapper>
   );
diff --git a/invokeai/frontend/web/src/features/controlNet/components/processors/OpenposeProcessor.tsx b/invokeai/frontend/web/src/features/controlNet/components/processors/OpenposeProcessor.tsx
index e97b933b6b..8335a5f75d 100644
--- a/invokeai/frontend/web/src/features/controlNet/components/processors/OpenposeProcessor.tsx
+++ b/invokeai/frontend/web/src/features/controlNet/components/processors/OpenposeProcessor.tsx
@@ -1,24 +1,27 @@
+import { useAppSelector } from 'app/store/storeHooks';
 import IAISlider from 'common/components/IAISlider';
 import IAISwitch from 'common/components/IAISwitch';
 import { CONTROLNET_PROCESSORS } from 'features/controlNet/store/constants';
 import { RequiredOpenposeImageProcessorInvocation } from 'features/controlNet/store/types';
+import { selectIsBusy } from 'features/system/store/systemSelectors';
 import { ChangeEvent, memo, useCallback } from 'react';
 import { useProcessorNodeChanged } from '../hooks/useProcessorNodeChanged';
 import ProcessorWrapper from './common/ProcessorWrapper';
-import { useIsReadyToInvoke } from 'common/hooks/useIsReadyToInvoke';
 
-const DEFAULTS = CONTROLNET_PROCESSORS.openpose_image_processor.default;
+const DEFAULTS = CONTROLNET_PROCESSORS.openpose_image_processor
+  .default as RequiredOpenposeImageProcessorInvocation;
 
 type Props = {
   controlNetId: string;
   processorNode: RequiredOpenposeImageProcessorInvocation;
+  isEnabled: boolean;
 };
 
 const OpenposeProcessor = (props: Props) => {
-  const { controlNetId, processorNode } = props;
+  const { controlNetId, processorNode, isEnabled } = props;
   const { image_resolution, detect_resolution, hand_and_face } = processorNode;
   const processorChanged = useProcessorNodeChanged();
-  const isReady = useIsReadyToInvoke();
+  const isBusy = useAppSelector(selectIsBusy);
 
   const handleDetectResolutionChanged = useCallback(
     (v: number) => {
@@ -65,7 +68,7 @@ const OpenposeProcessor = (props: Props) => {
         max={4096}
         withInput
         withSliderMarks
-        isDisabled={!isReady}
+        isDisabled={isBusy || !isEnabled}
       />
       <IAISlider
         label="Image Resolution"
@@ -77,13 +80,13 @@ const OpenposeProcessor = (props: Props) => {
         max={4096}
         withInput
         withSliderMarks
-        isDisabled={!isReady}
+        isDisabled={isBusy || !isEnabled}
       />
       <IAISwitch
         label="Hand and Face"
         isChecked={hand_and_face}
         onChange={handleHandAndFaceChanged}
-        isDisabled={!isReady}
+        isDisabled={isBusy || !isEnabled}
       />
     </ProcessorWrapper>
   );
diff --git a/invokeai/frontend/web/src/features/controlNet/components/processors/PidiProcessor.tsx b/invokeai/frontend/web/src/features/controlNet/components/processors/PidiProcessor.tsx
index 8251447195..4eab83136d 100644
--- a/invokeai/frontend/web/src/features/controlNet/components/processors/PidiProcessor.tsx
+++ b/invokeai/frontend/web/src/features/controlNet/components/processors/PidiProcessor.tsx
@@ -1,24 +1,27 @@
+import { useAppSelector } from 'app/store/storeHooks';
 import IAISlider from 'common/components/IAISlider';
 import IAISwitch from 'common/components/IAISwitch';
 import { CONTROLNET_PROCESSORS } from 'features/controlNet/store/constants';
 import { RequiredPidiImageProcessorInvocation } from 'features/controlNet/store/types';
+import { selectIsBusy } from 'features/system/store/systemSelectors';
 import { ChangeEvent, memo, useCallback } from 'react';
 import { useProcessorNodeChanged } from '../hooks/useProcessorNodeChanged';
 import ProcessorWrapper from './common/ProcessorWrapper';
-import { useIsReadyToInvoke } from 'common/hooks/useIsReadyToInvoke';
 
-const DEFAULTS = CONTROLNET_PROCESSORS.pidi_image_processor.default;
+const DEFAULTS = CONTROLNET_PROCESSORS.pidi_image_processor
+  .default as RequiredPidiImageProcessorInvocation;
 
 type Props = {
   controlNetId: string;
   processorNode: RequiredPidiImageProcessorInvocation;
+  isEnabled: boolean;
 };
 
 const PidiProcessor = (props: Props) => {
-  const { controlNetId, processorNode } = props;
+  const { controlNetId, processorNode, isEnabled } = props;
   const { image_resolution, detect_resolution, scribble, safe } = processorNode;
   const processorChanged = useProcessorNodeChanged();
-  const isReady = useIsReadyToInvoke();
+  const isBusy = useAppSelector(selectIsBusy);
 
   const handleDetectResolutionChanged = useCallback(
     (v: number) => {
@@ -72,7 +75,7 @@ const PidiProcessor = (props: Props) => {
         max={4096}
         withInput
         withSliderMarks
-        isDisabled={!isReady}
+        isDisabled={isBusy || !isEnabled}
       />
       <IAISlider
         label="Image Resolution"
@@ -84,7 +87,7 @@ const PidiProcessor = (props: Props) => {
         max={4096}
         withInput
         withSliderMarks
-        isDisabled={!isReady}
+        isDisabled={isBusy || !isEnabled}
       />
       <IAISwitch
         label="Scribble"
@@ -95,7 +98,7 @@ const PidiProcessor = (props: Props) => {
         label="Safe"
         isChecked={safe}
         onChange={handleSafeChanged}
-        isDisabled={!isReady}
+        isDisabled={isBusy || !isEnabled}
       />
     </ProcessorWrapper>
   );
diff --git a/invokeai/frontend/web/src/features/controlNet/components/processors/ZoeDepthProcessor.tsx b/invokeai/frontend/web/src/features/controlNet/components/processors/ZoeDepthProcessor.tsx
index d0a34784bf..b4b45025eb 100644
--- a/invokeai/frontend/web/src/features/controlNet/components/processors/ZoeDepthProcessor.tsx
+++ b/invokeai/frontend/web/src/features/controlNet/components/processors/ZoeDepthProcessor.tsx
@@ -4,6 +4,7 @@ import { memo } from 'react';
 type Props = {
   controlNetId: string;
   processorNode: RequiredZoeDepthImageProcessorInvocation;
+  isEnabled: boolean;
 };
 
 const ZoeDepthProcessor = (props: Props) => {