feat(ui): prevent invoking when >1 control lora enabled

Author: psychedelicious

invokeai/frontend/web/public/locales/en.json

@@ -1033,6 +1033,7 @@
             "fluxModelIncompatibleBboxHeight": "$t(parameters.invoke.fluxRequiresDimensionsToBeMultipleOf16), bbox height is {{height}}",
             "fluxModelIncompatibleScaledBboxWidth": "$t(parameters.invoke.fluxRequiresDimensionsToBeMultipleOf16), scaled bbox width is {{width}}",
             "fluxModelIncompatibleScaledBboxHeight": "$t(parameters.invoke.fluxRequiresDimensionsToBeMultipleOf16), scaled bbox height is {{height}}",
+            "fluxModelMultipleControlLoRAs": "Can only use 1 Control LoRA at a time",
             "canvasIsFiltering": "Canvas is busy (filtering)",
             "canvasIsTransforming": "Canvas is busy (transforming)",
             "canvasIsRasterizing": "Canvas is busy (rasterizing)",

invokeai/frontend/web/src/features/queue/store/readiness.ts

@@ -278,20 +278,29 @@ const getReasonsWhyCannotEnqueueCanvasTab = (arg: {
     }
   }
 
-  canvas.controlLayers.entities
-    .filter((controlLayer) => controlLayer.isEnabled)
-    .forEach((controlLayer, i) => {
-      const layerLiteral = i18n.t('controlLayers.layer_one');
-      const layerNumber = i + 1;
-      const layerType = i18n.t(LAYER_TYPE_TO_TKEY['control_layer']);
-      const prefix = `${layerLiteral} #${layerNumber} (${layerType})`;
-      const problems = getControlLayerWarnings(controlLayer, model);
+  const enabledControlLayers = canvas.controlLayers.entities.filter((controlLayer) => controlLayer.isEnabled);
 
-      if (problems.length) {
-        const content = upperFirst(problems.map((p) => i18n.t(p)).join(', '));
-        reasons.push({ prefix, content });
-      }
-    });
+  // FLUX only supports 1x Control LoRA at a time.
+  const controlLoRACount = enabledControlLayers.filter(
+    (controlLayer) => controlLayer.controlAdapter?.model?.type === 'control_lora'
+  ).length;
+
+  if (model?.base === 'flux' && controlLoRACount > 1) {
+    reasons.push({ content: i18n.t('parameters.invoke.fluxModelMultipleControlLoRAs') });
+  }
+
+  enabledControlLayers.forEach((controlLayer, i) => {
+    const layerLiteral = i18n.t('controlLayers.layer_one');
+    const layerNumber = i + 1;
+    const layerType = i18n.t(LAYER_TYPE_TO_TKEY['control_layer']);
+    const prefix = `${layerLiteral} #${layerNumber} (${layerType})`;
+    const problems = getControlLayerWarnings(controlLayer, model);
+
+    if (problems.length) {
+      const content = upperFirst(problems.map((p) => i18n.t(p)).join(', '));
+      reasons.push({ prefix, content });
+    }
+  });
 
   canvas.referenceImages.entities
     .filter((entity) => entity.isEnabled)