diff --git a/packages/react-mutation-mapper/src/component/lollipopMutationPlot/AxisScaleSwitch.tsx b/packages/react-mutation-mapper/src/component/lollipopMutationPlot/AxisScaleSwitch.tsx index fe156e726da..252a987ad34 100644 --- a/packages/react-mutation-mapper/src/component/lollipopMutationPlot/AxisScaleSwitch.tsx +++ b/packages/react-mutation-mapper/src/component/lollipopMutationPlot/AxisScaleSwitch.tsx @@ -55,6 +55,11 @@ export class AxisScaleSwitch extends React.Component< this.props.selectedScale === scale ? 'bolder' : 'normal', + color: + this.props.selectedScale === scale ? '#fff' : '#6c757d', + backgroundColor: + this.props.selectedScale === scale ? '#6c757d' : '#fff', + borderColor: '#6c757d', }} onClick={onClick} > diff --git a/packages/react-mutation-mapper/src/util/LollipopPlotUtils.ts b/packages/react-mutation-mapper/src/util/LollipopPlotUtils.ts index 4ba65a819fd..352839bdbf8 100644 --- a/packages/react-mutation-mapper/src/util/LollipopPlotUtils.ts +++ b/packages/react-mutation-mapper/src/util/LollipopPlotUtils.ts @@ -89,12 +89,18 @@ export function calcYMaxInput( if (input === undefined) { input = yAxisSameScale - ? getCommonYAxisMaxSliderValue( - yMaxStep, - countRange, - oppositeCountRange + ? parseFloat( + getCommonYAxisMaxSliderValue( + yMaxStep, + countRange, + oppositeCountRange + ).toFixed(Math.log10(yMaxStep) * -1) ) - : getYAxisMaxSliderValue(yMaxStep, countRange); + : parseFloat( + getYAxisMaxSliderValue(yMaxStep, countRange).toFixed( + Math.log10(yMaxStep) * -1 + ) + ); } return input; @@ -148,7 +154,9 @@ export function calcCountRange( for (const lollipop of lollipops) { max = Math.max(max, lollipop.count); - min = Math.min(min, lollipop.count); + min = Number.isInteger(lollipop.count) + ? Math.min(min, lollipop.count) + : Math.min(0.1, lollipop.count); } return [min, Math.max(min, max)]; diff --git a/src/pages/groupComparison/GroupComparisonMutationsTab.tsx b/src/pages/groupComparison/GroupComparisonMutationsTab.tsx index fb3444c2803..3c7b85f411f 100644 --- a/src/pages/groupComparison/GroupComparisonMutationsTab.tsx +++ b/src/pages/groupComparison/GroupComparisonMutationsTab.tsx @@ -132,6 +132,7 @@ export default class GroupComparisonMutationsTab extends React.Component< { - @observable public axisMode: AxisScale = AxisScale.PERCENT; + @observable public axisMode: AxisScale = + this.props.urlWrapper.query.axisMode || AxisScale.PERCENT; constructor(props: IGroupComparisonMutationsTabPlotProps) { super(props); makeObservable(this); @@ -84,6 +87,9 @@ export default class GroupComparisonMutationsTabPlot extends React.Component< @action.bound private onScaleToggle(selectedScale: AxisScale) { + this.props.urlWrapper.updateURL({ + axisMode: selectedScale, + }); this.axisMode = selectedScale; } diff --git a/src/pages/groupComparison/GroupComparisonURLWrapper.ts b/src/pages/groupComparison/GroupComparisonURLWrapper.ts index eccffca06b1..e398e83af90 100644 --- a/src/pages/groupComparison/GroupComparisonURLWrapper.ts +++ b/src/pages/groupComparison/GroupComparisonURLWrapper.ts @@ -15,6 +15,7 @@ import { } from 'shared/lib/comparison/ComparisonStoreUtils'; import { getServerConfig } from 'config/config'; import { MapValues } from 'shared/lib/TypeScriptUtils'; +import { AxisScale } from 'react-mutation-mapper'; export type GroupComparisonURLQuery = { comparisonId: string; @@ -24,6 +25,7 @@ export type GroupComparisonURLQuery = { patientEnrichments?: string; selectedEnrichmentEventTypes: string; selectedGene?: string; + axisMode?: AxisScale; }; export default class GroupComparisonURLWrapper @@ -40,6 +42,7 @@ export default class GroupComparisonURLWrapper patientEnrichments: { isSessionProp: false }, selectedEnrichmentEventTypes: { isSessionProp: true }, selectedGene: { isSessionProp: false }, + axisMode: { isSessionProp: false }, }, true, getServerConfig().session_url_length_threshold