show mutation count and number of samples in tooltip

src/pages/groupComparison/GroupComparisonMutationsTabPlot.tsx

@@ -14,7 +14,8 @@ import _ from 'lodash';
 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 { AxisScale } from 'react-mutation-mapper';
+import { LollipopTooltipCountInfo } from './LollipopTooltipCountInfo';
 
 interface IGroupComparisonMutationsTabPlotProps {
     store: GroupComparisonStore;

src/pages/groupComparison/LollipopTooltipCountInfo.tsx

@@ -0,0 +1,40 @@
+import { action, makeObservable, observable } from 'mobx';
+import { observer } from 'mobx-react';
+import { Mutation } from 'cbioportal-ts-api-client';
+import * as React from 'react';
+import {
+    formatPercentValue,
+    numberOfLeadingDecimalZeros,
+} from 'cbioportal-utils';
+import { AxisScale } from 'react-mutation-mapper';
+import { countUniqueMutations } from 'shared/lib/MutationUtils';
+
+interface ILollipopTooltipCountInfoProps {
+    count: number;
+    mutations?: Mutation[];
+    axisMode?: AxisScale;
+}
+
+export const LollipopTooltipCountInfo: React.FC<ILollipopTooltipCountInfoProps> = ({
+    count,
+    mutations,
+    axisMode,
+}: ILollipopTooltipCountInfoProps) => {
+    const decimalZeros = numberOfLeadingDecimalZeros(count);
+    const fractionDigits = decimalZeros < 0 ? 1 : decimalZeros + 2;
+
+    return mutations &&
+        mutations.length > 0 &&
+        axisMode === AxisScale.PERCENT ? (
+        <strong>
+            {formatPercentValue(count, fractionDigits)}% mutation rate (
+            {countUniqueMutations(mutations)} of{' '}
+            {Math.round((countUniqueMutations(mutations) / count) * 100)}{' '}
+            samples)
+        </strong>
+    ) : (
+        <strong>
+            {count} mutation{`${count !== 1 ? 's' : ''}`}
+        </strong>
+    );
+};