feat(ui): improve accordion ux

- Accordions now may be opened or closed regardless of whether or not their contents are enabled or active
- Accordions have a short text indicator alerting the user if their contents are enabled, either a simple `Enabled` or, for accordions like LoRA or ControlNet, `X Active` if any are active

invokeai/frontend/web/src/features/controlNet/components/parameters/ParamControlNetFeatureToggle.tsx

@@ -0,0 +1,36 @@
+import { createSelector } from '@reduxjs/toolkit';
+import { stateSelector } from 'app/store/store';
+import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
+import { defaultSelectorOptions } from 'app/store/util/defaultMemoizeOptions';
+import IAISwitch from 'common/components/IAISwitch';
+import { isControlNetEnabledToggled } from 'features/controlNet/store/controlNetSlice';
+import { useCallback } from 'react';
+
+const selector = createSelector(
+  stateSelector,
+  (state) => {
+    const { isEnabled } = state.controlNet;
+
+    return { isEnabled };
+  },
+  defaultSelectorOptions
+);
+
+const ParamControlNetFeatureToggle = () => {
+  const { isEnabled } = useAppSelector(selector);
+  const dispatch = useAppDispatch();
+
+  const handleChange = useCallback(() => {
+    dispatch(isControlNetEnabledToggled());
+  }, [dispatch]);
+
+  return (
+    <IAISwitch
+      label="Enable ControlNet"
+      isChecked={isEnabled}
+      onChange={handleChange}
+    />
+  );
+};
+
+export default ParamControlNetFeatureToggle;

invokeai/frontend/web/src/features/controlNet/util/getValidControlNets.ts

@@ -0,0 +1,15 @@
+import { filter } from 'lodash-es';
+import { ControlNetConfig } from '../store/controlNetSlice';
+
+export const getValidControlNets = (
+  controlNets: Record<string, ControlNetConfig>
+) => {
+  const validControlNets = filter(
+    controlNets,
+    (c) =>
+      c.isEnabled &&
+      (Boolean(c.processedControlImage) ||
+        (c.processorType === 'none' && Boolean(c.controlImage)))
+  );
+  return validControlNets;
+};