From 889e0e36d74913a3bd33edeb2f4e046fd635d836 Mon Sep 17 00:00:00 2001
From: mashazyu <mariya.z@gmail.com>
Date: Sun, 1 Sep 2019 20:28:02 +0200
Subject: [PATCH 1/4] make graph display for incomplete mucus and cervix values

---
 components/chart/day-column.js | 263 +++++++++++++--------------------
 1 file changed, 104 insertions(+), 159 deletions(-)

diff --git a/components/chart/day-column.js b/components/chart/day-column.js
index 834a618..4236c41 100644
--- a/components/chart/day-column.js
+++ b/components/chart/day-column.js
@@ -26,40 +26,55 @@ const label = styles.column.label
 class DayColumn extends Component {
   constructor(props) {
     super()
-    const dateString = props.dateString
-    const columnHeight = props.columnHeight
-    this.getCycleDayNumber = cycleModule().getCycleDayNumber
-    const cycleDay = getCycleDay(dateString)
+
+    const { dateString, columnHeight, chartSymptoms } = props
+    const cycleDayData = getCycleDay(dateString)
     this.data = {}
-    if (cycleDay) {
-      this.data = props.chartSymptoms.reduce((acc, symptom) => {
-        if (['bleeding', 'temperature', 'mucus', 'desire', 'note'].includes(symptom)) {
-          acc[symptom] = cycleDay[symptom] && cycleDay[symptom].value
-          if (symptom === 'temperature' && acc.temperature) {
-            acc.y = normalizeToScale(acc.temperature, columnHeight)
-            const neighbor = getInfoForNeighborColumns(dateString, columnHeight)
-            for (const key in neighbor) {
-              acc[key] = neighbor[key]
+
+    if (cycleDayData) {
+      this.data = chartSymptoms.reduce((symptomDataToDisplay, symptom) => {
+        const symptomData = cycleDayData[symptom]
+
+        if (symptomData && !this.isSymptomExcluded(symptomData)) {
+          symptomDataToDisplay[symptom] = {}
+          switch (symptom) {
+          case 'temperature': {
+            symptomDataToDisplay[symptom].data = symptomData.value
+            symptomDataToDisplay.y =
+              normalizeToScale(symptomData.value, columnHeight)
+            const neighbourTemperatureValue =
+              getInfoForNeighborColumns(dateString, columnHeight)
+            for (const key in neighbourTemperatureValue) {
+              symptomDataToDisplay[key] = neighbourTemperatureValue[key]
             }
+            break
+          }
+          case 'cervix':
+            symptomDataToDisplay[symptom].data =
+              (symptomData.opening + symptomData.firmness) > 0 ? 2 : 0
+            symptomDataToDisplay[symptom].isComplete =
+              this.isCervixDataComplete(symptomData)
+            break
+          case 'mucus':
+            symptomDataToDisplay[symptom].data =
+              (symptomData.feeling + symptomData.texture) > 0 ? 2 : 0
+            symptomDataToDisplay[symptom].isComplete =
+              this.isMucusDataComplete(symptomData)
+            break
+          case 'sex':
+            symptomDataToDisplay[symptom].data =
+              symptomData.solo + 2 * symptomData.partner - 1
+            break
+          case 'bleeding':
+          case 'desire':
+            symptomDataToDisplay[symptom].data = symptomData.value
+            break
+          default: // pain, mood, note
+            symptomDataToDisplay[symptom].data = 0
           }
-        } else if (symptom === 'cervix') {
-          acc.cervix = cycleDay.cervix &&
-            (cycleDay.cervix.opening + cycleDay.cervix.firmness)
-        } else if (symptom === 'sex') {
-          // solo = 1 + partner = 2
-          acc.sex = cycleDay.sex &&
-            (cycleDay.sex.solo + 2 * cycleDay.sex.partner)
-        } else if (symptom === 'pain') {
-          // is any pain documented?
-          acc.pain = cycleDay.pain &&
-            Object.values({...cycleDay.pain}).some(x => x === true)
-        } else if (symptom === 'mood') {
-          // is mood documented?
-          acc.mood = cycleDay.mood &&
-            Object.values({...cycleDay.mood}).some(x => x === true)
         }
-        acc[`${symptom}Exclude`] = cycleDay[symptom] && cycleDay[symptom].exclude
-        return acc
+
+        return symptomDataToDisplay
       }, this.data)
     }
 
@@ -70,6 +85,16 @@ class DayColumn extends Component {
     )
   }
 
+  isSymptomExcluded = (symptomData) => {
+    return symptomData && symptomData.exclude ? symptomData.exclude : false
+  }
+
+  isCervixDataComplete = (symptomData) =>
+    (symptomData.opening != null) && (symptomData.firmness != null)
+
+  isMucusDataComplete = (symptomData) =>
+    (symptomData.feeling != null) && (symptomData.texture != null)
+
   onDaySelect = (date) => {
     this.props.setDate(date)
     this.props.navigate('CycleDay')
@@ -79,10 +104,50 @@ class DayColumn extends Component {
     return false
   }
 
+  drawSypmtom = (symptom) => {
+
+    const { symptomHeight } = this.props
+    const shouldDrawSymptom = this.data.hasOwnProperty(symptom)
+    const styleParent = [styles.symptomRow, {height: symptomHeight}]
+
+    if (shouldDrawSymptom) {
+      const styleSymptom = styles.iconShades[symptom]
+      const symptomData = this.data[symptom]
+
+      const isDataIncomplete = !symptomData.isComplete
+      const isMucusOrCervix = (symptom === 'mucus') || (symptom === 'cervix')
+
+      const backgroundColor = ( isMucusOrCervix && isDataIncomplete) ?
+        'white' : styleSymptom[symptomData.data]
+      const borderWidth = ( isMucusOrCervix && isDataIncomplete) ? 2 : 0
+      const borderColor = styleSymptom[0]
+
+      const styleChild = [styles.symptomIcon, {
+        backgroundColor,
+        borderColor,
+        borderWidth
+      }]
+
+      return (
+        <View style={styleParent} key={symptom}>
+          {shouldDrawSymptom && <View style={styleChild} />}
+        </View>
+      )
+    } else {
+      return (
+        <View style={styleParent} key={symptom} />
+      )
+    }
+  }
+
   render() {
     const columnElements = []
-    const dateString = this.props.dateString
-    const symptomHeight = this.props.symptomHeight
+    const { dateString,
+      symptomRowSymptoms,
+      chartHeight,
+      columnHeight,
+      xAxisHeight } = this.props
+
 
     if(this.fhmAndLtl.drawLtlAt) {
       const ltlLine = (<Shape
@@ -103,16 +168,12 @@ class DayColumn extends Component {
         fill="red"
         stroke={styles.nfpLine.stroke}
         strokeWidth={styles.nfpLine.strokeWidth}
-        d={new Path()
-          .moveTo(x, x)
-          .lineTo(x, this.props.columnHeight)
-        }
+        d={new Path().moveTo(x, x).lineTo(x, columnHeight)}
         key='fhm'
       />)
       columnElements.push(fhmLine)
     }
 
-
     if (this.data.y) {
       columnElements.push(
         <DotAndLine
@@ -127,13 +188,14 @@ class DayColumn extends Component {
       )
     }
 
-    const cycleDayNumber = this.getCycleDayNumber(dateString)
+    const cycleDayNumber = cycleModule().getCycleDayNumber(dateString)
     const dayDate = LocalDate.parse(dateString)
     const shortDate = dayDate.dayOfMonth() === 1 ?
       moment(dateString, "YYYY-MM-DD").format('MMM')
       :
       moment(dateString, "YYYY-MM-DD").format('Do')
     const boldDateLabel = dayDate.dayOfMonth() === 1 ? {fontWeight: 'bold'} : {}
+
     const cycleDayLabel = (
       <Text style = {label.number}>
         {cycleDayNumber ? cycleDayNumber : ' '}
@@ -149,131 +211,26 @@ class DayColumn extends Component {
         <Shape
           stroke={styles.column.stroke.color}
           strokeWidth={styles.column.stroke.width}
-          d={new Path().lineTo(0, this.props.chartHeight)}
+          d={new Path().lineTo(0, chartHeight)}
         />
         { columnElements }
       </G>
     )
 
-    const symptomIconViews = {
-      bleeding: (
-        <SymptomIconView
-          value={this.data.bleeding}
-          symptomHeight={symptomHeight}
-          key='bleeding'
-        >
-          <View
-            {...styles.symptomIcon}
-            backgroundColor={styles.iconShades.bleeding[this.data.bleeding]}
-          />
-        </SymptomIconView>
-      ),
-      mucus: (
-        <SymptomIconView
-          value={this.data.mucus}
-          symptomHeight={symptomHeight}
-          key='mucus'
-        >
-          <View
-            {...styles.symptomIcon}
-            backgroundColor={styles.iconShades.mucus[this.data.mucus]}
-          />
-        </SymptomIconView>
-      ),
-      cervix: (
-        <SymptomIconView
-          value={this.data.cervix}
-          symptomHeight={symptomHeight}
-          key='cervix'
-        >
-          <View
-            {...styles.symptomIcon}
-            // cervix is sum of openess and firmness - fertile only when closed and hard (=0)
-            backgroundColor={this.data.cervix > 0 ?
-              styles.iconShades.cervix[2] :
-              styles.iconShades.cervix[0]
-            }
-          />
-        </SymptomIconView>
-      ),
-      sex: (
-        <SymptomIconView
-          value={this.data.sex}
-          symptomHeight={symptomHeight}
-          key='sex'
-        >
-          <View
-            {...styles.symptomIcon}
-            backgroundColor={styles.iconShades.sex[this.data.sex - 1]}
-          />
-        </SymptomIconView>
-      ),
-      desire: (
-        <SymptomIconView
-          value={this.data.desire}
-          symptomHeight={symptomHeight}
-          key='desire'
-        >
-          <View
-            {...styles.symptomIcon}
-            backgroundColor={styles.iconShades.desire[this.data.desire]}
-          />
-        </SymptomIconView>
-      ),
-      pain: (
-        <SymptomIconView
-          value={this.data.pain}
-          symptomHeight={symptomHeight}
-          key='pain'
-        >
-          <View
-            {...styles.symptomIcon}
-            backgroundColor={styles.iconShades.pain}
-          />
-        </SymptomIconView>
-      ),
-      mood: (
-        <SymptomIconView
-          value={this.data.mood}
-          symptomHeight={symptomHeight}
-          key='mood'
-        >
-          <View
-            {...styles.symptomIcon}
-            backgroundColor={styles.iconShades.mood}
-          />
-        </SymptomIconView>
-      ),
-      note: (
-        <SymptomIconView
-          value={this.data.note}
-          symptomHeight={symptomHeight}
-          key='note'
-        >
-          <View
-            {...styles.symptomIcon}
-            backgroundColor={styles.iconShades.note}
-          />
-        </SymptomIconView>
-      )
-    }
-
     return (
       <TouchableOpacity
         onPress={() => this.onDaySelect(dateString)}
         activeOpacity={1}
       >
         <View>
-          {this.props.symptomRowSymptoms.map(symptomName => {
-            return symptomIconViews[symptomName]
-          })}
+          {symptomRowSymptoms.map(symptom => this.drawSypmtom(symptom))}
         </View>
 
-        <Surface width={config.columnWidth} height={this.props.columnHeight}>
+        <Surface width={config.columnWidth} height={columnHeight}>
           {column}
         </Surface>
 
-        <View style={{height: this.props.xAxisHeight}}>
+        <View style={{height: xAxisHeight}}>
           {cycleDayLabel}
           {dateLabel}
         </View>
@@ -294,18 +251,6 @@ export default connect(
 )(DayColumn)
 
 
-
-function SymptomIconView(props) {
-  const style = [styles.symptomRow, {height: props.symptomHeight}]
-  return (
-    <View style={style}>
-      {(typeof props.value === 'number' || props.value === true || typeof props.value === 'string') &&
-        props.children
-      }
-    </View>
-  )
-}
-
 function getInfoForNeighborColumns(dateString, columnHeight) {
   const ret = {
     rightY: null,

From f376602843c6429937635c047c5dad2318bd883a Mon Sep 17 00:00:00 2001
From: mashazyu <mariya.z@gmail.com>
Date: Mon, 23 Sep 2019 15:04:46 +0200
Subject: [PATCH 2/4] Naming update, change switch to object, fertility logic
 review

---
 components/chart/day-column.js | 153 ++++++++++++++++++++-------------
 1 file changed, 94 insertions(+), 59 deletions(-)

diff --git a/components/chart/day-column.js b/components/chart/day-column.js
index 4236c41..2404887 100644
--- a/components/chart/day-column.js
+++ b/components/chart/day-column.js
@@ -27,50 +27,21 @@ class DayColumn extends Component {
   constructor(props) {
     super()
 
-    const { dateString, columnHeight, chartSymptoms } = props
+    const { dateString, chartSymptoms, columnHeight } = props
     const cycleDayData = getCycleDay(dateString)
     this.data = {}
 
     if (cycleDayData) {
-      this.data = chartSymptoms.reduce((symptomDataToDisplay, symptom) => {
+      this.data = chartSymptoms.reduce((symptomDataToDisplay, symptom, ) => {
         const symptomData = cycleDayData[symptom]
 
-        if (symptomData && !this.isSymptomExcluded(symptomData)) {
-          symptomDataToDisplay[symptom] = {}
-          switch (symptom) {
-          case 'temperature': {
-            symptomDataToDisplay[symptom].data = symptomData.value
-            symptomDataToDisplay.y =
-              normalizeToScale(symptomData.value, columnHeight)
-            const neighbourTemperatureValue =
-              getInfoForNeighborColumns(dateString, columnHeight)
-            for (const key in neighbourTemperatureValue) {
-              symptomDataToDisplay[key] = neighbourTemperatureValue[key]
-            }
-            break
-          }
-          case 'cervix':
-            symptomDataToDisplay[symptom].data =
-              (symptomData.opening + symptomData.firmness) > 0 ? 2 : 0
-            symptomDataToDisplay[symptom].isComplete =
-              this.isCervixDataComplete(symptomData)
-            break
-          case 'mucus':
-            symptomDataToDisplay[symptom].data =
-              (symptomData.feeling + symptomData.texture) > 0 ? 2 : 0
-            symptomDataToDisplay[symptom].isComplete =
-              this.isMucusDataComplete(symptomData)
-            break
-          case 'sex':
-            symptomDataToDisplay[symptom].data =
-              symptomData.solo + 2 * symptomData.partner - 1
-            break
-          case 'bleeding':
-          case 'desire':
-            symptomDataToDisplay[symptom].data = symptomData.value
-            break
-          default: // pain, mood, note
-            symptomDataToDisplay[symptom].data = 0
+        if (symptomData && symptom === 'temperature') {
+          symptomDataToDisplay[symptom] =
+           this.getTemperatureProps(symptomData, columnHeight, dateString)
+        } else {
+          if (symptomData && ! symptomData.exclude) {
+            symptomDataToDisplay[symptom] =
+              (this.getSymptomColorIndex[symptom] || this.getSymptomColorIndex['default'])(symptomData)
           }
         }
 
@@ -80,20 +51,78 @@ class DayColumn extends Component {
 
     this.fhmAndLtl = props.getFhmAndLtlInfo(
       props.dateString,
-      this.data.temperature,
+      this.data.temperature ? this.data.temperature.value : null,
       props.columnHeight
     )
   }
 
-  isSymptomExcluded = (symptomData) => {
-    return symptomData && symptomData.exclude ? symptomData.exclude : false
+  getTemperatureProps = (symptomData, columnHeight, dateString) => {
+    const extractedData = {}
+    const { value, exclude } = symptomData
+    const neighborTemperatureGraphPoints =
+      getInfoForNeighborColumns(dateString, columnHeight)
+
+    for (const key in neighborTemperatureGraphPoints) {
+      extractedData[key] = neighborTemperatureGraphPoints[key]
+    }
+    return Object.assign({
+      value,
+      y: normalizeToScale(value, columnHeight),
+      temperatureExclude: exclude,
+    }, extractedData)
   }
 
-  isCervixDataComplete = (symptomData) =>
-    (symptomData.opening != null) && (symptomData.firmness != null)
+  getSymptomColorIndex = {
+    'mucus': (symptomData) => {
+      const { feeling, texture } = symptomData
+      const colorIndex = feeling + texture
+      return colorIndex
+    },
+    'cervix': (symptomData) => {
+      const { opening, firmness } = symptomData
+      const isDataComplete = opening !== null && firmness !== null
+      // is fertile? fertile only when opening=closed and firmness=hard (=0)
+      const isFertile = isDataComplete && (opening === 0 && firmness === 0)
+      const colorIndex = isFertile ? 0 : 2
+      return colorIndex
+    },
+    'sex': (symptomData) => {
+      const { solo, partner } = symptomData
+      const colorIndex = (solo !== null && partner !== null) ?
+        (solo + 2 * partner - 1) : 0
+      return colorIndex
+    },
+    'bleeding': (symptomData) => {
+      const { value } = symptomData
+      const colorIndex = value
+      return colorIndex
+    },
+    'default': () => { // desire, pain, mood, note
+      const colorIndex = 0
+      return colorIndex
+    }
+  }
 
-  isMucusDataComplete = (symptomData) =>
-    (symptomData.feeling != null) && (symptomData.texture != null)
+  isSymptomDataComplete = (symptom) => {
+    const { dateString } = this.props
+    const cycleDayData = getCycleDay(dateString)
+    const symptomData = cycleDayData[symptom]
+
+    const dataCompletenessCheck = {
+      'cervix': () => {
+        const { opening, firmness } = symptomData
+        return (opening !== null) && (firmness !== null)
+      },
+      'mucus': () => {
+        const { feeling, texture } = symptomData
+        return (feeling !== null) && (texture !== null)
+      },
+      'default': () => {
+        return true
+      }
+    }
+    return (dataCompletenessCheck[symptom] || dataCompletenessCheck['default'])()
+  }
 
   onDaySelect = (date) => {
     this.props.setDate(date)
@@ -114,14 +143,13 @@ class DayColumn extends Component {
       const styleSymptom = styles.iconShades[symptom]
       const symptomData = this.data[symptom]
 
-      const isDataIncomplete = !symptomData.isComplete
+      const dataIsComplete = this.isSymptomDataComplete(symptom)
       const isMucusOrCervix = (symptom === 'mucus') || (symptom === 'cervix')
 
-      const backgroundColor = ( isMucusOrCervix && isDataIncomplete) ?
-        'white' : styleSymptom[symptomData.data]
-      const borderWidth = ( isMucusOrCervix && isDataIncomplete) ? 2 : 0
+      const backgroundColor = (isMucusOrCervix && !dataIsComplete) ?
+        'white' : styleSymptom[symptomData]
+      const borderWidth = (isMucusOrCervix && !dataIsComplete) ? 2 : 0
       const borderColor = styleSymptom[0]
-
       const styleChild = [styles.symptomIcon, {
         backgroundColor,
         borderColor,
@@ -130,7 +158,7 @@ class DayColumn extends Component {
 
       return (
         <View style={styleParent} key={symptom}>
-          {shouldDrawSymptom && <View style={styleChild} />}
+          <View style={styleChild} />
         </View>
       )
     } else {
@@ -148,7 +176,6 @@ class DayColumn extends Component {
       columnHeight,
       xAxisHeight } = this.props
 
-
     if(this.fhmAndLtl.drawLtlAt) {
       const ltlLine = (<Shape
         stroke={styles.nfpLine.stroke}
@@ -174,15 +201,23 @@ class DayColumn extends Component {
       columnElements.push(fhmLine)
     }
 
-    if (this.data.y) {
+    if (this.data && this.data.temperature && this.data.temperature.y) {
+      const { temperatureExclude,
+        y,
+        rightY,
+        leftY,
+        rightTemperatureExclude,
+        leftTemperatureExclude
+      } = this.data.temperature
+
       columnElements.push(
         <DotAndLine
-          y={this.data.y}
-          exclude={this.data.temperatureExclude}
-          rightY={this.data.rightY}
-          rightTemperatureExclude={this.data.rightTemperatureExclude}
-          leftY={this.data.leftY}
-          leftTemperatureExclude={this.data.leftTemperatureExclude}
+          y={y}
+          exclude={temperatureExclude}
+          rightY={rightY}
+          rightTemperatureExclude={rightTemperatureExclude}
+          leftY={leftY}
+          leftTemperatureExclude={leftTemperatureExclude}
           key='dotandline'
         />
       )

From 7514b01cf4e183953506a159d080b9352a93c119 Mon Sep 17 00:00:00 2001
From: mashazyu <mariya.z@gmail.com>
Date: Wed, 2 Oct 2019 13:49:18 +0200
Subject: [PATCH 3/4] Naming update: isFertile>isClosedAndHard,
 getSymptomColorIndex>symptomColorMethods; update of symptom index retrieval
 for the sake of readibility

---
 components/chart/day-column.js | 19 +++++++++++++------
 1 file changed, 13 insertions(+), 6 deletions(-)

diff --git a/components/chart/day-column.js b/components/chart/day-column.js
index 2404887..c7b3646 100644
--- a/components/chart/day-column.js
+++ b/components/chart/day-column.js
@@ -40,8 +40,14 @@ class DayColumn extends Component {
            this.getTemperatureProps(symptomData, columnHeight, dateString)
         } else {
           if (symptomData && ! symptomData.exclude) {
-            symptomDataToDisplay[symptom] =
-              (this.getSymptomColorIndex[symptom] || this.getSymptomColorIndex['default'])(symptomData)
+            // if symptomColorMethods entry doesn't exist for given symptom,
+            // use 'default'
+            const getSymptomColorIndex =
+              this.symptomColorMethods[symptom] ||
+              this.symptomColorMethods['default']
+
+            getSymptomColorIndex(symptomData)
+            symptomDataToDisplay[symptom] = getSymptomColorIndex(symptomData)
           }
         }
 
@@ -72,7 +78,7 @@ class DayColumn extends Component {
     }, extractedData)
   }
 
-  getSymptomColorIndex = {
+  symptomColorMethods = {
     'mucus': (symptomData) => {
       const { feeling, texture } = symptomData
       const colorIndex = feeling + texture
@@ -81,9 +87,10 @@ class DayColumn extends Component {
     'cervix': (symptomData) => {
       const { opening, firmness } = symptomData
       const isDataComplete = opening !== null && firmness !== null
-      // is fertile? fertile only when opening=closed and firmness=hard (=0)
-      const isFertile = isDataComplete && (opening === 0 && firmness === 0)
-      const colorIndex = isFertile ? 0 : 2
+      const isClosedAndHard =
+        isDataComplete &&
+        (opening === 0 && firmness === 0)
+      const colorIndex = isClosedAndHard ? 0 : 2
       return colorIndex
     },
     'sex': (symptomData) => {

From e14bd690dc93e5aa1b2b3e84b403cbef0cdb1ee6 Mon Sep 17 00:00:00 2001
From: Sofiya Tepikin <sofiya.tepikin@gmail.com>
Date: Fri, 15 Nov 2019 17:52:12 +0100
Subject: [PATCH 4/4] Fixes typo, and removes a redundant line

---
 components/chart/day-column.js | 5 ++---
 1 file changed, 2 insertions(+), 3 deletions(-)

diff --git a/components/chart/day-column.js b/components/chart/day-column.js
index c7b3646..c49f9db 100644
--- a/components/chart/day-column.js
+++ b/components/chart/day-column.js
@@ -46,7 +46,6 @@ class DayColumn extends Component {
               this.symptomColorMethods[symptom] ||
               this.symptomColorMethods['default']
 
-            getSymptomColorIndex(symptomData)
             symptomDataToDisplay[symptom] = getSymptomColorIndex(symptomData)
           }
         }
@@ -140,7 +139,7 @@ class DayColumn extends Component {
     return false
   }
 
-  drawSypmtom = (symptom) => {
+  drawSymptom = (symptom) => {
 
     const { symptomHeight } = this.props
     const shouldDrawSymptom = this.data.hasOwnProperty(symptom)
@@ -265,7 +264,7 @@ class DayColumn extends Component {
         activeOpacity={1}
       >
         <View>
-          {symptomRowSymptoms.map(symptom => this.drawSypmtom(symptom))}
+          {symptomRowSymptoms.map(symptom => this.drawSymptom(symptom))}
         </View>
 
         <Surface width={config.columnWidth} height={columnHeight}>