cBioPortal · alisman · Mar 6, 2025 · Feb 20, 2025 · Feb 24, 2025 · Feb 24, 2025
diff --git a/...e/excluding_unprofiled_samples_cancer_type_summary_element_chrome_1600x1000.png b/...e/excluding_unprofiled_samples_cancer_type_summary_element_chrome_1600x1000.png
diff --git a/...emote/screenshots/reference/group_by_detailed_type_element_chrome_1600x1000.png b/...emote/screenshots/reference/group_by_detailed_type_element_chrome_1600x1000.png
diff --git a/...s/reference/handles_change_to_absolute_value_yaxis_element_chrome_1600x1000.png b/...s/reference/handles_change_to_absolute_value_yaxis_element_chrome_1600x1000.png
diff --git a/...reference/handles_change_to_sample_total_threshold_element_chrome_1600x1000.png b/...reference/handles_change_to_sample_total_threshold_element_chrome_1600x1000.png
diff --git a/...eenshots/reference/handles_change_to_sort_of_xaxis_element_chrome_1600x1000.png b/...eenshots/reference/handles_change_to_sort_of_xaxis_element_chrome_1600x1000.png
diff --git a/...reenshots/reference/no_session_cancer_type_summary_element_chrome_1600x1000.png b/...reenshots/reference/no_session_cancer_type_summary_element_chrome_1600x1000.png
diff --git a/.../screenshots/reference/session_cancer_type_summary_element_chrome_1600x1000.png b/.../screenshots/reference/session_cancer_type_summary_element_chrome_1600x1000.png
diff --git a/src/pages/resultsView/cancerSummary/CancerSummaryChart.spec.tsx b/src/pages/resultsView/cancerSummary/CancerSummaryChart.spec.tsx
@@ -165,7 +165,7 @@ describe('CancerSummaryChart', () => {
             ],
             countsByGroup: {
                 'Lung Adenocarcinoma': {
-                    profiledSampleTotal: 660,
+                    profiledTotal: 660,
                     alterationTotal: 547,
                     alterationTypeCounts: {
                         mutated: 280,
@@ -180,11 +180,11 @@ describe('CancerSummaryChart', () => {
                         protExpressionLow: 0,
                         multiple: 87,
                     },
-                    alteredSampleCount: 460,
+                    alteredCount: 460,
                     parentCancerType: 'Non-Small Cell Lung Cancer',
                 },
                 'Lung Squamous Cell Carcinoma': {
-                    profiledSampleTotal: 484,
+                    profiledTotal: 484,
                     alterationTotal: 574,
                     alterationTypeCounts: {
                         mutated: 292,
@@ -199,7 +199,7 @@ describe('CancerSummaryChart', () => {
                         protExpressionLow: 0,
                         multiple: 131,
                     },
-                    alteredSampleCount: 443,
+                    alteredCount: 443,
                     parentCancerType: 'Non-Small Cell Lung Cancer',
                 },
             },

diff --git a/src/pages/resultsView/cancerSummary/CancerSummaryChart.tsx b/src/pages/resultsView/cancerSummary/CancerSummaryChart.tsx
@@ -62,6 +62,7 @@ interface CancerSummaryChartProps {
     countsByGroup: { [groupName: string]: IAlterationData };
     xLabels: string[];
     xAxisString: string;
+    countAlterationsBy: string;
     representedAlterations: { [alterationType: string]: boolean };
     isPercentage: boolean;
     showLinks: boolean;
@@ -111,6 +112,43 @@ export function mergeAlterationDataAcrossAlterationTypes(
     });
 }
 
+export function formatGeneAlteredText(
+    useSampleCounts: boolean,
+    tooltipModel: ITooltipModel
+) {
+    const alteredPercentage = percentageRounder(
+        tooltipModel.alterationData.alteredCount /
+            tooltipModel.alterationData.profiledTotal
+    );
+
+    const profiledTotal = tooltipModel.alterationData.profiledTotal;
+
+    const casesOrSamples = useSampleCounts ? 'samples' : 'cases';
+
+    return `Gene altered in ${alteredPercentage}% of ${profiledTotal} ${casesOrSamples}`;
+}
+
+export function formatFrequencyText(
+    useSampleCounts: boolean,
+    tooltipModel: ITooltipModel,
+    alterationType: string
+) {
+    const alterationCount = (tooltipModel!.alterationData
+        .alterationTypeCounts as any)[alterationType];
+    const profiledTotal = tooltipModel!.alterationData.profiledTotal;
+
+    const alteredPercentage = percentageRounder(
+        alterationCount / profiledTotal
+    );
+
+    const casesOrSamples = useSampleCounts ? 'sample' : 'case';
+
+    return `${alteredPercentage}% (${alterationCount} ${pluralize(
+        casesOrSamples,
+        alterationCount
+    )})`;
+}
+
 @observer
 export class CancerSummaryChart extends React.Component<
     CancerSummaryChartProps,
@@ -208,7 +246,9 @@ export class CancerSummaryChart extends React.Component<
             let tooltipMessage = 'Not profiled';
             if (profiledCount > 0) {
                 tooltipMessage = `${profiledCount} ${pluralize(
-                    'sample',
+                    this.props.countAlterationsBy === 'sampleCounts'
+                        ? 'sample'
+                        : 'patient',
                     profiledCount
                 )}  profiled`;
             }
@@ -248,6 +288,8 @@ export class CancerSummaryChart extends React.Component<
         if (!this.barPlotTooltipModel) {
             return null;
         } else {
+            const useSampleCounts =
+                this.props.countAlterationsBy === 'sampleCounts';
             const tooltipModel = this.barPlotTooltipModel;
             const maxWidth = 400;
             let tooltipPlacement =
@@ -303,15 +345,10 @@ export class CancerSummaryChart extends React.Component<
                             </Else>
                         </If>
                         <p>
-                            Gene altered in{' '}
-                            {percentageRounder(
-                                tooltipModel.alterationData.alteredSampleCount /
-                                    tooltipModel.alterationData
-                                        .profiledSampleTotal
+                            {formatGeneAlteredText(
+                                useSampleCounts,
+                                tooltipModel
                             )}
-                            % of{' '}
-                            {tooltipModel.alterationData.profiledSampleTotal}{' '}
-                            cases
                         </p>
                         <table className="table table-striped">
                             <thead>
@@ -333,31 +370,15 @@ export class CancerSummaryChart extends React.Component<
                                                 key
                                             ] > 0
                                         ) {
-                                            const alterationCount = (tooltipModel!
-                                                .alterationData
-                                                .alterationTypeCounts as any)[
-                                                key
-                                            ];
                                             memo.push(
                                                 <tr>
                                                     <td>{name}</td>
                                                     <td>
-                                                        {percentageRounder(
-                                                            (tooltipModel!
-                                                                .alterationData
-                                                                .alterationTypeCounts as any)[
-                                                                key
-                                                            ] /
-                                                                tooltipModel!
-                                                                    .alterationData
-                                                                    .profiledSampleTotal
-                                                        )}
-                                                        % ({alterationCount}{' '}
-                                                        {pluralize(
-                                                            'case',
-                                                            alterationCount
+                                                        {formatFrequencyText(
+                                                            useSampleCounts,
+                                                            tooltipModel,
+                                                            key
                                                         )}
-                                                        )
                                                     </td>
                                                 </tr>
                                             );

diff --git a/src/pages/resultsView/cancerSummary/CancerSummaryContainer.tsx b/src/pages/resultsView/cancerSummary/CancerSummaryContainer.tsx
@@ -37,6 +37,7 @@ export default class CancerSummaryContainer extends React.Component<
     @observable private activeTab: string = CANCER_SUMMARY_ALL_GENES;
     @observable private resultsViewPageWidth: number = 1150;
     @observable private groupAlterationsBy_userSelection: keyof ExtendedSample;
+    @observable private countAlterationsBy_userSelection: string;
 
     private resultsViewPageContent: HTMLElement;
 
@@ -45,6 +46,7 @@ export default class CancerSummaryContainer extends React.Component<
         makeObservable(this);
         this.handleTabClick = this.handleTabClick.bind(this);
         this.pivotData = this.pivotData.bind(this);
+        this.pivotCountData = this.pivotCountData.bind(this);
         this.mapStudyIdToName = this.mapStudyIdToName.bind(this);
     }
 
@@ -60,6 +62,10 @@ export default class CancerSummaryContainer extends React.Component<
         this.groupAlterationsBy_userSelection = str;
     }
 
+    public pivotCountData(str: string) {
+        this.countAlterationsBy_userSelection = str;
+    }
+
     public get groupAlterationsBy(): keyof ExtendedSample {
         if (this.groupAlterationsBy_userSelection === undefined) {
             if (this.props.store.studies.result!.length > 1) {
@@ -81,6 +87,10 @@ export default class CancerSummaryContainer extends React.Component<
         }
     }
 
+    public get countAlterationsBy(): string {
+        return this.countAlterationsBy_userSelection ?? 'patientCounts';
+    }
+
     // this is used to map study id to study name
     private mapStudyIdToName(str: string) {
         if (str in this.props.store.physicalStudySet) {
@@ -106,7 +116,8 @@ export default class CancerSummaryContainer extends React.Component<
             this.groupAlterationsBy,
             this.props.store.selectedMolecularProfileIdsByAlterationType
                 .result!,
-            this.props.store.coverageInformation.result!
+            this.props.store.coverageInformation.result!,
+            this.countAlterationsBy
         );
 
         const geneTabs = _.map(this.props.store.genes.result!, (gene: Gene) => {
@@ -142,9 +153,11 @@ export default class CancerSummaryContainer extends React.Component<
                         }
                         handleStudyLinkout={this.handleStudyLinkout}
                         groupAlterationsBy={this.groupAlterationsBy}
+                        countAlterationsBy={this.countAlterationsBy}
                         gene={gene.hugoGeneSymbol}
                         labelTransformer={labelTransformer}
                         handlePivotChange={this.pivotData}
+                        handlePivotCountChange={this.pivotCountData}
                         width={this.resultsViewPageWidth}
                     />
                 </MSKTab>
@@ -161,7 +174,8 @@ export default class CancerSummaryContainer extends React.Component<
                 this.groupAlterationsBy,
                 this.props.store.selectedMolecularProfileIdsByAlterationType
                     .result!,
-                this.props.store.coverageInformation.result!
+                this.props.store.coverageInformation.result!,
+                this.countAlterationsBy
             );
             geneTabs.unshift(
                 <MSKTab
@@ -174,8 +188,10 @@ export default class CancerSummaryContainer extends React.Component<
                         width={this.resultsViewPageWidth}
                         groupedAlterationData={groupedAlterationDataForAllGenes}
                         handlePivotChange={this.pivotData}
+                        handlePivotCountChange={this.pivotCountData}
                         labelTransformer={labelTransformer}
                         groupAlterationsBy={this.groupAlterationsBy}
+                        countAlterationsBy={this.countAlterationsBy}
                         handleStudyLinkout={this.handleStudyLinkout}
                     />
                 </MSKTab>