From 05553aa88ed60a2e18bddb61d1df15487b15dd49 Mon Sep 17 00:00:00 2001
From: Diana Baiceanu <diana@thehyve.nl>
Date: Wed, 19 Aug 2020 17:21:31 +0200
Subject: [PATCH] Changes based on review comments received

---
 src/pages/patientView/SampleManager.tsx       | 14 +++----
 .../patientView/mutation/VAFLineChartUtils.ts |  7 +++-
 .../patientView/timeline2/VAFChartWrapper.tsx | 40 +++++++++----------
 3 files changed, 32 insertions(+), 29 deletions(-)

diff --git a/src/pages/patientView/SampleManager.tsx b/src/pages/patientView/SampleManager.tsx
index aa584160a95..dc954c59619 100644
--- a/src/pages/patientView/SampleManager.tsx
+++ b/src/pages/patientView/SampleManager.tsx
@@ -294,27 +294,27 @@ class SampleManager {
     }
 
     getClinicalAttributeList(samples: Array<ClinicalDataBySampleId>) {
-        let clinicalAttributeIds: { [id: string]: ClinicalAttribute } = {};
-        let clinicalAttributes: { id: string; value: string }[] = [];
+        let clinicalAttributes: { [id: string]: ClinicalAttribute } = {};
+        let output: { id: string; value: string }[] = [];
         samples.forEach((sample, sampleIndex) => {
             sample.clinicalData.forEach((clinicalData, clinicalDataIndex) => {
                 if (
-                    clinicalAttributeIds[clinicalData.clinicalAttributeId] ===
+                    clinicalAttributes[clinicalData.clinicalAttributeId] ===
                     undefined
                 ) {
-                    clinicalAttributes.push({
+                    output.push({
                         id: clinicalData.clinicalAttributeId,
                         value: clinicalData.clinicalAttribute.displayName,
                     });
-                    clinicalAttributeIds[clinicalData.clinicalAttributeId] =
+                    clinicalAttributes[clinicalData.clinicalAttributeId] =
                         clinicalData.clinicalAttribute;
                 }
             });
         });
-        return clinicalAttributes;
+        return output;
     }
 
-    getClinicalAttributeSampleList(
+    getClinicalValueToSamplesMap(
         samples: Array<ClinicalDataBySampleId>,
         clinicalAttributeId: string
     ) {
diff --git a/src/pages/patientView/mutation/VAFLineChartUtils.ts b/src/pages/patientView/mutation/VAFLineChartUtils.ts
index 09ecaa84af7..a4088046e05 100644
--- a/src/pages/patientView/mutation/VAFLineChartUtils.ts
+++ b/src/pages/patientView/mutation/VAFLineChartUtils.ts
@@ -50,13 +50,16 @@ export function computeRenderData(
     mutationProfileId: string,
     coverageInformation: CoverageInformation,
     groupByOption: string,
-    sampleGroup: { [s: string]: string }
+    sampleIdToClinicalValue: { [sampleId: string]: string }
 ) {
     const grayPoints: IPoint[] = []; // points that are purely interpolated for rendering, dont have data of their own
     const lineData: IPoint[][] = [];
 
     if (groupByOption && groupByOption != GROUP_BY_NONE)
-        mutations = splitMutationsBySampleGroup(mutations, sampleGroup);
+        mutations = splitMutationsBySampleGroup(
+            mutations,
+            sampleIdToClinicalValue
+        );
 
     for (const mergedMutation of mutations) {
         // determine data points in line for this mutation
diff --git a/src/pages/patientView/timeline2/VAFChartWrapper.tsx b/src/pages/patientView/timeline2/VAFChartWrapper.tsx
index f5ebd3ae91d..85089c084ab 100644
--- a/src/pages/patientView/timeline2/VAFChartWrapper.tsx
+++ b/src/pages/patientView/timeline2/VAFChartWrapper.tsx
@@ -205,7 +205,7 @@ export default class VAFChartWrapper extends React.Component<
             this.props.mutationProfileId,
             this.props.coverageInformation,
             this.props.store.groupByOption!,
-            this.sampleGroupByValue
+            this.sampleToClinicalValue
         );
     }
 
@@ -286,38 +286,38 @@ export default class VAFChartWrapper extends React.Component<
         );
     }
 
-    @computed get sampleGroupByColors() {
-        let groupByColors: { [clinicalValue: string]: string } = {};
+    @computed get clinicalValueToColor() {
+        let clinicalValueToColor: { [clinicalValue: string]: string } = {};
         const uniqueColorGetter = makeUniqueColorGetter();
-        const clinicalAttributeSamplesMap = this.props.sampleManager.getClinicalAttributeSampleList(
+        const clinicalAttributeSamplesMap = this.props.sampleManager.getClinicalValueToSamplesMap(
             this.props.sampleManager.samples,
             this.props.store.groupByOption!
         );
         clinicalAttributeSamplesMap.forEach(
             (sampleList: string[], clinicalValue: any) => {
-                groupByColors[clinicalValue] = uniqueColorGetter();
+                clinicalValueToColor[clinicalValue] = uniqueColorGetter();
             }
         );
-        return groupByColors;
+        return clinicalValueToColor;
     }
 
-    @computed get sampleGroupByLabels() {
-        let groupByLabels: string[] = [];
+    @computed get clinicalValuesForGrouping() {
+        let clinicalValuesForGrouping: string[] = [];
         const uniqueColorGetter = makeUniqueColorGetter();
-        const clinicalAttributeSamplesMap = this.props.sampleManager.getClinicalAttributeSampleList(
+        const clinicalAttributeSamplesMap = this.props.sampleManager.getClinicalValueToSamplesMap(
             this.props.sampleManager.samples,
             this.props.store.groupByOption!
         );
         clinicalAttributeSamplesMap.forEach(
             (sampleList: string[], clinicalValue: any) => {
-                groupByLabels.push(clinicalValue);
+                clinicalValuesForGrouping.push(clinicalValue);
             }
         );
-        return groupByLabels;
+        return clinicalValuesForGrouping;
     }
 
-    @computed get sampleGroupByValue() {
-        let groupByValue: { [sampleId: string]: string } = {};
+    @computed get sampleToClinicalValue() {
+        let sampleToClinicalValue: { [sampleId: string]: string } = {};
         if (
             !(
                 this.props.store.groupByOption == null ||
@@ -325,7 +325,7 @@ export default class VAFChartWrapper extends React.Component<
             )
         ) {
             this.props.sampleManager.samples.forEach((sample, i) => {
-                groupByValue[
+                sampleToClinicalValue[
                     sample.id
                 ] = SampleManager!.getClinicalAttributeInSample(
                     sample,
@@ -333,7 +333,7 @@ export default class VAFChartWrapper extends React.Component<
                 )!.value;
             });
         }
-        return groupByValue;
+        return sampleToClinicalValue;
     }
 
     @computed get sampleYPosition() {
@@ -349,7 +349,7 @@ export default class VAFChartWrapper extends React.Component<
             )
         ) {
             // get for each clinical attribute value the list of corresponding samples
-            let clinicalAttributeSamplesMap = this.props.sampleManager.getClinicalAttributeSampleList(
+            let clinicalAttributeSamplesMap = this.props.sampleManager.getClinicalValueToSamplesMap(
                 this.props.sampleManager.samples,
                 this.props.store.groupByOption!
             );
@@ -555,8 +555,8 @@ export default class VAFChartWrapper extends React.Component<
                                         GROUP_BY_NONE
                                 )
                             )
-                                color = this.sampleGroupByColors[
-                                    this.sampleGroupByValue[d.sampleId]
+                                color = this.clinicalValueToColor[
+                                    this.sampleToClinicalValue[d.sampleId]
                                 ];
 
                             return (
@@ -616,14 +616,14 @@ export default class VAFChartWrapper extends React.Component<
                     )}
                 </g>
                 <g transform={`translate(0,${this.dataHeight})`}>
-                    {this.sampleGroupByLabels.map((label, index) => {
+                    {this.clinicalValuesForGrouping.map((label, index) => {
                         return (
                             <g transform={`translate(0,0)`}>
                                 <text
                                     y={this.sampleYPosition[label] + 15 + 7.5}
                                     font-family="sans-serif"
                                     font-size="12px"
-                                    fill={this.sampleGroupByColors[label]}
+                                    fill={this.clinicalValueToColor[label]}
                                 >
                                     {label}
                                 </text>