Disable bin step kneeplot

src/__test__/components/data-processing/cellsize-distribution/CellSizeDistribution.test.jsx

@@ -10,6 +10,7 @@ import { initialPlotConfigStates } from 'redux/reducers/componentConfig/initialS
 import { generateDataProcessingPlotUuid } from 'utils/generateCustomPlotUuid';
 import CellSizeDistribution from 'components/data-processing/CellSizeDistribution/CellSizeDistribution';
 import CalculationConfig from 'components/data-processing/CellSizeDistribution/CalculationConfig';
+import SliderWithInput from 'components/SliderWithInput';
 import generateExperimentSettingsMock from '../../../test-utils/experimentSettings.mock';
 
 import filterStatisticsMock from '../../../test-utils/plotData.mock';
@@ -147,4 +148,31 @@ describe('CellSizeDistribution', () => {
     expect(plots.length).toEqual(3);
     expect(tables.length).toEqual(1);
   });
+  it('Disables bin step slider when plot type is knee plot', () => {
+    const modifiedWithData = {
+      ...withData,
+      componentConfig: {
+        ...withData.componentConfig,
+        plotType: 'kneePlot',
+      },
+    };
+
+    const store = mockStore(modifiedWithData);
+
+    const component = mount(
+      <Provider store={store}>
+        <CellSizeDistribution
+          experimentId={experimentId}
+          sampleId={sampleId}
+          sampleIds={sampleIds}
+          onConfigChange={() => { }}
+        />
+      </Provider>,
+    );
+
+    const page = component.find(CellSizeDistribution).at(0);
+    const calculationConfig = page.find(CalculationConfig);
+    const sliderWithInput = calculationConfig.find(SliderWithInput);
+    expect(sliderWithInput.props().disabled).toBe(true);
+  });
 });

src/components/data-processing/CellSizeDistribution/CalculationConfig.jsx

@@ -16,7 +16,7 @@ const MIN_CELL_SIZE_PLACEHOLDER = 10800;
 
 const CellSizeDistributionConfig = (props) => {
   const {
-    config, disabled, updateSettings, highestUmi,
+    config, disabled, updateSettings, highestUmi, plotType,
   } = props;
 
   const withinRange = (cellSize) => Math.max(Math.min(cellSize, highestUmi), 0);
@@ -54,7 +54,7 @@ const CellSizeDistributionConfig = (props) => {
           onUpdate={(value) => {
             updateSettings({ binStep: value });
           }}
-          disabled={disabled}
+          disabled={disabled || plotType === 'kneePlot'}
         />
       </Form.Item>
     </>
@@ -65,12 +65,14 @@ CellSizeDistributionConfig.defaultProps = {
   config: {},
   disabled: false,
   highestUmi: null,
+  plotType: null,
 };
 CellSizeDistributionConfig.propTypes = {
   updateSettings: PropTypes.func,
   config: PropTypes.object,
   disabled: PropTypes.bool,
   highestUmi: PropTypes.number,
+  plotType: PropTypes.string,
 };
 
 export default CellSizeDistributionConfig;