From fe459295ea1ff1fb8421df336398c6ae182b24ac Mon Sep 17 00:00:00 2001
From: psychedelicious <4822129+psychedelicious@users.noreply.github.com>
Date: Tue, 30 Apr 2024 10:00:57 +1000
Subject: [PATCH] fix(ui): exclude disabled control adapters on control layers

---
 .../nodes/util/graph/addControlNetToLinearGraph.ts | 14 +++++++++-----
 .../nodes/util/graph/addIPAdapterToLinearGraph.ts  | 10 +++++++---
 .../nodes/util/graph/addT2IAdapterToLinearGraph.ts | 13 ++++++++-----
 3 files changed, 24 insertions(+), 13 deletions(-)

diff --git a/invokeai/frontend/web/src/features/nodes/util/graph/addControlNetToLinearGraph.ts b/invokeai/frontend/web/src/features/nodes/util/graph/addControlNetToLinearGraph.ts
index bc58af7525..ac3c7ba670 100644
--- a/invokeai/frontend/web/src/features/nodes/util/graph/addControlNetToLinearGraph.ts
+++ b/invokeai/frontend/web/src/features/nodes/util/graph/addControlNetToLinearGraph.ts
@@ -33,16 +33,20 @@ const getControlNets = (state: RootState) => {
   // accordion. We need to filter the list of valid T2I adapters according to the tab.
   const activeTabName = activeTabNameSelector(state);
 
-  // Collect all ControlNet ids for ControlNet layers
-  const layerControlNetIds = state.regionalPrompts.present.layers
-    .filter(isControlAdapterLayer)
-    .map((l) => l.controlNetId);
-
   if (activeTabName === 'txt2img') {
     // Add only the cnets that are used in control layers
+    // Collect all ControlNet ids for enabled ControlNet layers
+    const layerControlNetIds = state.regionalPrompts.present.layers
+      .filter(isControlAdapterLayer)
+      .filter((l) => l.isEnabled)
+      .map((l) => l.controlNetId);
     return intersectionWith(validControlNets, layerControlNetIds, (a, b) => a.id === b);
   } else {
     // Else, we want to exclude the cnets that are used in control layers
+    // Collect all ControlNet ids for all ControlNet layers
+    const layerControlNetIds = state.regionalPrompts.present.layers
+      .filter(isControlAdapterLayer)
+      .map((l) => l.controlNetId);
     return differenceWith(validControlNets, layerControlNetIds, (a, b) => a.id === b);
   }
 };
diff --git a/invokeai/frontend/web/src/features/nodes/util/graph/addIPAdapterToLinearGraph.ts b/invokeai/frontend/web/src/features/nodes/util/graph/addIPAdapterToLinearGraph.ts
index 746e2da81d..12e942ed59 100644
--- a/invokeai/frontend/web/src/features/nodes/util/graph/addIPAdapterToLinearGraph.ts
+++ b/invokeai/frontend/web/src/features/nodes/util/graph/addIPAdapterToLinearGraph.ts
@@ -37,14 +37,18 @@ const getIPAdapters = (state: RootState) => {
   // accordion. We need to filter the list of valid IP adapters according to the tab.
   const activeTabName = activeTabNameSelector(state);
 
-  // Collect all IP Adapter ids for IP adapter layers
-  const layerIPAdapterIds = state.regionalPrompts.present.layers.filter(isIPAdapterLayer).map((l) => l.ipAdapterId);
-
   if (activeTabName === 'txt2img') {
     // If we are on the t2i tab, we only want to add the IP adapters that are used in unmasked IP Adapter layers
+    // Collect all IP Adapter ids for enabled IP adapter layers
+    const layerIPAdapterIds = state.regionalPrompts.present.layers
+      .filter(isIPAdapterLayer)
+      .filter((l) => l.isEnabled)
+      .map((l) => l.ipAdapterId);
     return intersectionWith(nonMaskedIPAdapters, layerIPAdapterIds, (a, b) => a.id === b);
   } else {
     // Else, we want to exclude the IP adapters that are used in IP Adapter layers
+    // Collect all IP Adapter ids for enabled IP adapter layers
+    const layerIPAdapterIds = state.regionalPrompts.present.layers.filter(isIPAdapterLayer).map((l) => l.ipAdapterId);
     return differenceWith(nonMaskedIPAdapters, layerIPAdapterIds, (a, b) => a.id === b);
   }
 };
diff --git a/invokeai/frontend/web/src/features/nodes/util/graph/addT2IAdapterToLinearGraph.ts b/invokeai/frontend/web/src/features/nodes/util/graph/addT2IAdapterToLinearGraph.ts
index 0ac4affd1b..5fd168205f 100644
--- a/invokeai/frontend/web/src/features/nodes/util/graph/addT2IAdapterToLinearGraph.ts
+++ b/invokeai/frontend/web/src/features/nodes/util/graph/addT2IAdapterToLinearGraph.ts
@@ -33,16 +33,19 @@ const getT2IAdapters = (state: RootState) => {
   // accordion. We need to filter the list of valid T2I adapters according to the tab.
   const activeTabName = activeTabNameSelector(state);
 
-  // Collect all ids for control adapter layers
-  const layerControlAdapterIds = state.regionalPrompts.present.layers
-    .filter(isControlAdapterLayer)
-    .map((l) => l.controlNetId);
-
   if (activeTabName === 'txt2img') {
     // Add only the T2Is that are used in control layers
+    // Collect all ids for enabled control adapter layers
+    const layerControlAdapterIds = state.regionalPrompts.present.layers
+      .filter(isControlAdapterLayer)
+      .filter((l) => l.isEnabled)
+      .map((l) => l.controlNetId);
     return intersectionWith(validT2IAdapters, layerControlAdapterIds, (a, b) => a.id === b);
   } else {
     // Else, we want to exclude the T2Is that are used in control layers
+    const layerControlAdapterIds = state.regionalPrompts.present.layers
+      .filter(isControlAdapterLayer)
+      .map((l) => l.controlNetId);
     return differenceWith(validT2IAdapters, layerControlAdapterIds, (a, b) => a.id === b);
   }
 };