feat: disable inputs if peq dont use them

src/features/dsp408/components/ChannelSection/ChannelSection.tsx

@@ -11,6 +11,8 @@ import {
   PEQ_FILTERS_LABEL,
   PEQ_Q_RANGES,
   PEAK_Q_VALUES,
+  PEQ_Q_UNUSED,
+  PEQ_GAIN_USED,
 } from '../../constants';
 import { Channel, PEQBand, PEQFilter, PEQ, Crossover } from '../../types';
 import { DSP408 as DSP } from '../../../../types';
@@ -128,6 +130,8 @@ function PeqPanelSliders({
   onLiveValue: (value: PEQ) => void;
 }) {
   const [qMin, qMax] = PEQ_Q_RANGES[peq.filter_type];
+  const qDisabled = PEQ_Q_UNUSED.has(peq.filter_type);
+  const gainDisabled = !PEQ_GAIN_USED.has(peq.filter_type);
 
   const commit = (overrides: Partial<PEQ>) => {
     const next = { ...peq, ...overrides };
@@ -168,6 +172,7 @@ function PeqPanelSliders({
             value={peq.q}
             onChange={(value) => commit({ q: value })}
             onInput={(value) => onLiveValue({ ...peq, q: value })}
+            disabled={qDisabled}
             style={{ width: '100%', flex: '1 1 auto' }}
           />
 
@@ -184,6 +189,7 @@ function PeqPanelSliders({
             formatValue={(v, d) => (v > 0 ? `+${v.toFixed(d)}` : v.toFixed(d))}
             onChange={(value) => commit({ gain: value })}
             onInput={(value) => onLiveValue({ ...peq, gain: value })}
+            disabled={gainDisabled}
             style={{ width: '100%', flex: '1 1 auto' }}
           />
 
@@ -335,6 +341,9 @@ function PeqBandList({
         const [qMin, qMax] = PEQ_Q_RANGES[peq.filter_type];
         const qValues = PEAK_Q_VALUES.filter((q) => q >= qMin && q <= qMax);
 
+        const qDisabled = PEQ_Q_UNUSED.has(peq.filter_type);
+        const gainDisabled = !PEQ_GAIN_USED.has(peq.filter_type);
+
         return (
           <div
             className={`peq-band-list__row${isActive ? ' peq-band-list__row--active' : ''}`}
@@ -370,6 +379,7 @@ function PeqBandList({
               value={peq.q}
               values={qValues}
               formatLabel={(v) => v.toFixed(2)}
+              disabled={qDisabled}
               onChange={(value) => commit(band, { q: value })}
             />
 
@@ -380,6 +390,7 @@ function PeqBandList({
               max={12}
               step={0.1}
               formatLabel={(v) => `${v > 0 ? '+' : ''}${v.toFixed(1)} dB`}
+              disabled={gainDisabled}
               onChange={(value) => commit(band, { gain: value })}
             />
 
@@ -715,8 +726,8 @@ function ChannelSection({
           <div className="confirm-modal" onClick={(e) => e.stopPropagation()}>
             <h3>Reset {activeChannelState.name} PEQ?</h3>
             <p>
-              This will set all PEQ bands on {activeChannelState.name} back to flat (0 dB,
-              Peak). This action cannot be undone.
+              This will set all PEQ bands on {activeChannelState.name} back to flat (0 dB, Peak).
+              This action cannot be undone.
             </p>
 
             <div className="confirm-modal__actions">