add selected axis mode to url and format y axis max label float

cBioPortal · Dec 1, 2022 · 334f741 · 334f741
1 parent 2e7d3ac
commit 334f741
Show file tree

Hide file tree

Showing 5 changed files with 30 additions and 7 deletions.
diff --git 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
@@ -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
@@ -132,6 +132,7 @@ export default class GroupComparisonMutationsTab extends React.Component<
                     </div>
                     <GroupComparisonMutationsTabPlot
                         store={this.props.store}
+                        urlWrapper={this.props.urlWrapper}
                         mutations={_(this.props.store.mutationsByGroup.result!)
                             .values()
                             .flatten()

diff --git a/src/pages/groupComparison/GroupComparisonMutationsTabPlot.tsx b/src/pages/groupComparison/GroupComparisonMutationsTabPlot.tsx
@@ -15,9 +15,11 @@ import { MakeMobxView } from 'shared/components/MobxView';
 import { countUniqueMutations } from 'shared/lib/MutationUtils';
 import ErrorMessage from 'shared/components/ErrorMessage';
 import { AxisScale, LollipopTooltipCountInfo } from 'react-mutation-mapper';
+import GroupComparisonURLWrapper from './GroupComparisonURLWrapper';
 
 interface IGroupComparisonMutationsTabPlotProps {
     store: GroupComparisonStore;
+    urlWrapper: GroupComparisonURLWrapper;
     mutations?: Mutation[];
     filters?: any;
 }
@@ -59,7 +61,8 @@ export default class GroupComparisonMutationsTabPlot extends React.Component<
     IGroupComparisonMutationsTabPlotProps,
     {}
 > {
-    @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
@@ -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