✨New Feature: Remove Gene Tracks from Oncoprint

cBioPortal · Mar 29, 2024 · 1aae7cd · 1aae7cd
1 parent 88b2c64
commit 1aae7cd
Show file tree

Hide file tree

Showing 7 changed files with 289 additions and 29 deletions.
diff --git a/...th_clinical_tracks_sorted_-_sorted_patient_order_2_element_chrome_1600x1000.png b/...th_clinical_tracks_sorted_-_sorted_patient_order_2_element_chrome_1600x1000.png
diff --git a/end-to-end-test/remote/specs/core/oncoprint.screenshot.spec.js b/end-to-end-test/remote/specs/core/oncoprint.screenshot.spec.js
@@ -131,7 +131,7 @@ describe('oncoprint screenshot tests', function() {
             elements.dropdown_selector,
             'Couldnt open top treatment track options'
         );
-        $(elements.dropdown_selector + ' li:nth-child(3)').click(); // Click Remove
+        $(elements.dropdown_selector + ' li:nth-child(3)').click();
         waitForOncoprint(ONCOPRINT_TIMEOUT);
 
         var res = checkOncoprintElement('.oncoprintContainer');
@@ -417,7 +417,7 @@ describe('sorting', function() {
         $(overallSurvivalElements.dropdown_selector).waitForDisplayed({
             timeout: 1000,
         }); // wait for menu to appear
-        overallSurvivalElements.dropdown.$('li:nth-child(5)').click(); // Click sort a-Z
+        overallSurvivalElements.dropdown.$('li=Sort a-Z').click(); // Click sort a-Z
 
         browser.pause(100); // give time to sort
 
@@ -440,7 +440,7 @@ describe('sorting', function() {
             overallSurvivalElements.dropdown_selector,
             'couldnt show overall survival dropdown'
         );
-        overallSurvivalElements.dropdown.$('li:nth-child(6)').click(); // Click sort Z-a
+        overallSurvivalElements.dropdown.$('li=Sort Z-a').click(); // Click sort Z-a
         browser.pause(100); // give time to sort
 
         var res = checkOncoprintElement();
@@ -455,7 +455,7 @@ describe('sorting', function() {
         $(karnofskyPerformanceElements.dropdown_selector).waitForDisplayed({
             timeout: 1000,
         }); // wait for menu to appear
-        karnofskyPerformanceElements.dropdown.$('li:nth-child(6)').click(); // Click sort Z-a
+        karnofskyPerformanceElements.dropdown.$('li=Sort Z-a').click(); // Click sort Z-a
         browser.pause(100); // give time to sort
 
         var res = checkOncoprintElement();
@@ -472,7 +472,7 @@ describe('sorting', function() {
             karnofskyPerformanceElements.dropdown_selector,
             'couldnt show karnofsky performance dropdown'
         );
-        karnofskyPerformanceElements.dropdown.$('li:nth-child(5)').click(); // Click sort a-Z
+        karnofskyPerformanceElements.dropdown.$('li=Sort a-Z').click(); // Click sort a-Z
         browser.pause(100); // give time to sort
 
         var res = checkOncoprintElement();
@@ -505,7 +505,7 @@ describe('sorting', function() {
         $(diseaseFreeElements.dropdown_selector).waitForDisplayed({
             timeout: 1000,
         }); // wait for menu to appear
-        diseaseFreeElements.dropdown.$('li:nth-child(5)').click(); // Click sort a-Z
+        diseaseFreeElements.dropdown.$('li=Sort a-Z').click(); // Click sort a-Z
         browser.pause(100); // give time to sort
 
         var res = checkOncoprintElement();
@@ -520,7 +520,7 @@ describe('sorting', function() {
             diseaseFreeElements.dropdown_selector,
             'couldnt show disease free dropdown'
         );
-        diseaseFreeElements.dropdown.$('li:nth-child(6)').click(); // Click sort Z-a
+        diseaseFreeElements.dropdown.$('li=Sort Z-a').click(); // Click sort Z-a
         browser.pause(100); // give time to sort
 
         var res = checkOncoprintElement();
@@ -535,7 +535,7 @@ describe('sorting', function() {
         $(fractionGenomeAlteredElements.dropdown_selector).waitForDisplayed({
             timeout: 1000,
         }); // wait for menu to appear
-        fractionGenomeAlteredElements.dropdown.$('li:nth-child(6)').click(); // Click sort Z-a
+        fractionGenomeAlteredElements.dropdown.$('li=Sort Z-a').click(); // Click sort Z-a
         browser.pause(100); // give time to sort
 
         var res = checkOncoprintElement();
@@ -552,7 +552,7 @@ describe('sorting', function() {
             fractionGenomeAlteredElements.dropdown_selector,
             'couldnt show fraction genome altered dropdown'
         );
-        fractionGenomeAlteredElements.dropdown.$('li:nth-child(5)').click(); // Click sort a-Z
+        fractionGenomeAlteredElements.dropdown.$('li=Sort a-Z').click(); // Click sort a-Z
         browser.pause(100); // give time to sort
 
         var res = checkOncoprintElement();
@@ -566,10 +566,12 @@ describe('sorting', function() {
         $(TP53HeatmapElements.dropdown_selector).waitForDisplayed({
             timeout: 1000,
         }); // wait for menu to appear
-        $(
-            TP53HeatmapElements.dropdown_selector + ' li:nth-child(6)'
-        ).scrollIntoView();
-        $(TP53HeatmapElements.dropdown_selector + ' li:nth-child(6)').click(); // Click sort Z-a
+        $(TP53HeatmapElements.dropdown_selector)
+            .$('li=Sort Z-a')
+            .scrollIntoView();
+        $(TP53HeatmapElements.dropdown_selector)
+            .$('li=Sort Z-a')
+            .click(); // Click sort Z-a
         browser.pause(100); // give time to sort
 
         var res = checkOncoprintElement();
@@ -583,22 +585,15 @@ describe('sorting', function() {
 
         waitForOncoprint(ONCOPRINT_TIMEOUT);
 
-        // first get rid of the Profiled track
-        var profiledElements = getNthOncoprintTrackOptionsElements(5);
-        $(profiledElements.button_selector).click();
-        $(profiledElements.dropdown_selector).waitForDisplayed({
-            timeout: 1000,
-        }); // wait for menu to appear
-        $(`${profiledElements.dropdown_selector} li:nth-child(3)`).click(); // Click Remove Track
-        browser.pause(100); // give time to take effect
-
         // Sort heatmap tracks
         var TP53HeatmapElements = getNthOncoprintTrackOptionsElements(8);
         $(TP53HeatmapElements.button_selector).click(); // open track menu
         $(TP53HeatmapElements.dropdown_selector).waitForDisplayed({
             timeout: 1000,
         }); // wait for menu to appear
-        $(TP53HeatmapElements.dropdown_selector + ' li:nth-child(6)').click(); // Click sort Z-a
+        $(TP53HeatmapElements.dropdown_selector)
+            .$('li=Sort Z-a')
+            .click(); // Click sort Z-a
         browser.pause(100); // give time to sort
 
         var res = checkOncoprintElement();
@@ -613,7 +608,7 @@ describe('sorting', function() {
             TP53HeatmapElements.dropdown_selector,
             'couldnt show TP53 heatmap dropdown'
         );
-        TP53HeatmapElements.dropdown.$('li:nth-child(5)').click(); // Click sort a-Z
+        TP53HeatmapElements.dropdown.$('li=Sort a-Z').click(); // Click sort a-Z
         browser.pause(100); // give time to sort
 
         var res = checkOncoprintElement();
@@ -634,7 +629,7 @@ describe('sorting', function() {
         $(MDM4HeatmapElements.dropdown_selector).waitForDisplayed({
             timeout: 1000,
         }); // wait for menu to appear
-        MDM4HeatmapElements.dropdown.$('li:nth-child(5)').click(); // Click sort a-Z
+        MDM4HeatmapElements.dropdown.$('li=Sort a-Z').click(); // Click sort a-Z
         browser.pause(100); // give time to sort
 
         var res = checkOncoprintElement();
@@ -649,7 +644,7 @@ describe('sorting', function() {
             MDM4HeatmapElements.dropdown_selector,
             'couldnt show MDM4 heatmap dropdown'
         );
-        MDM4HeatmapElements.dropdown.$('li:nth-child(6)').click(); // Click sort Z-a
+        MDM4HeatmapElements.dropdown.$('li=Sort Z-a').click(); // Click sort Z-a
         browser.pause(100); // give time to sort
 
         var res = checkOncoprintElement();
@@ -662,7 +657,7 @@ describe('sorting', function() {
         $(TP53HeatmapElements.dropdown_selector).waitForDisplayed({
             timeout: 1000,
         }); // wait for menu to appear
-        TP53HeatmapElements.dropdown.$('li:nth-child(7)').click(); // Click Don't sort
+        TP53HeatmapElements.dropdown.$(`li=Don't sort track`).click(); // Click Don't sort
         browser.pause(100); // give time to sort
 
         var res = checkOncoprintElement();

diff --git a/end-to-end-test/shared/wdio/wdio.conf.js b/end-to-end-test/shared/wdio/wdio.conf.js
@@ -165,9 +165,11 @@ exports.config = {
     //
     //
 
+    //port: 9515,
+
     specs: [SPEC_FILE_PATTERN],
 
-    //specs: ['./remote/specs/core/comparisonTab.screenshot.spec.js'],
+    //specs: ['./remote/specs/core/oncoprint.screenshot.spec.js'],
 
     // Patterns to exclude.
     exclude: [

diff --git a/src/shared/api/session-service/sessionServiceModels.ts b/src/shared/api/session-service/sessionServiceModels.ts
@@ -1,6 +1,9 @@
 import { ClinicalData, StudyViewFilter } from 'cbioportal-ts-api-client';
 import { ChartType } from 'pages/studyView/StudyViewUtils';
-import { ClinicalTrackConfig } from 'shared/components/oncoprint/Oncoprint';
+import {
+    ClinicalTrackConfig,
+    GeneticTrackConfig,
+} from 'shared/components/oncoprint/Oncoprint';
 import { PageSettingsIdentifier } from 'shared/userSession/PageSettingsIdentifier';
 
 export interface Session {
@@ -99,6 +102,7 @@ export type StudyPageSettings = {
 
 export type ResultPageSettings = {
     clinicallist?: ClinicalTrackConfig[];
+    geneticlist?: GeneticTrackConfig[];
 };
 
 export type PageSettingsData = StudyPageSettings | ResultPageSettings;

diff --git a/src/shared/components/oncoprint/DeltaUtils.ts b/src/shared/components/oncoprint/DeltaUtils.ts
@@ -1139,10 +1139,27 @@ function transitionGeneticTrack(
             $track_info_tooltip_elt: nextSpec.infoTooltip
                 ? $('<div>' + nextSpec.infoTooltip + '</div>')
                 : undefined,
+            removable: nextProps.geneticTracks.length > 1 ? true : false,
             removeCallback: () => {
                 delete getTrackSpecKeyToTrackId()[nextSpec.key];
                 if (nextSpec.removeCallback) nextSpec.removeCallback();
             },
+            onClickRemoveInTrackMenu: () => {
+                const oql = nextSpec.oql;
+                const sublabel = nextSpec.sublabel;
+                if (oql) {
+                    const geneLabelsRegex = /[A-Z0-9]+(?=:)/g;
+                    const geneLabels = oql.match(geneLabelsRegex);
+                    if (geneLabels) {
+                        const geneLabelsString = geneLabels.join(' ');
+                        nextProps.onDeleteGeneticTrack &&
+                            nextProps.onDeleteGeneticTrack(
+                                geneLabelsString,
+                                sublabel || ''
+                            );
+                    }
+                }
+            },
             expandCallback: nextSpec.expansionCallback || undefined,
             expandButtonTextGetter: () => 'Expand',
             expansion_of: expansionParentKey

diff --git a/src/shared/components/oncoprint/Oncoprint.tsx b/src/shared/components/oncoprint/Oncoprint.tsx
@@ -179,6 +179,21 @@ export type GeneticTrackSpec = {
     customOptions?: CustomTrackOption[];
 };
 
+export class GeneticTrackConfig {
+    constructor(stableId: string) {
+        this.stableId = stableId;
+    }
+    public stableId: string;
+}
+
+export type GeneticTrackConfigChange = {
+    stableId?: string;
+};
+
+export type GeneticTrackConfigMap = {
+    [geneticAttribute: string]: GeneticTrackConfig;
+};
+
 export interface IBaseHeatmapTrackSpec {
     key: string; // for efficient diffing, just like in React. must be unique
     label: string;
@@ -296,6 +311,7 @@ export interface IOncoprintProps {
 
     onMinimapClose?: () => void;
     onDeleteClinicalTrack?: (key: string) => void;
+    onDeleteGeneticTrack?: (key: string, sublabel: string) => void;
     onTrackSortDirectionChange?: (trackId: TrackId, dir: number) => void;
     onTrackGapChange?: (trackId: TrackId, gap: boolean) => void;