Merge branch 'master' into 117-implement-pain

components/cycle-day/cycle-day-overview.js

@@ -51,6 +51,7 @@ export default class CycleDayOverView extends Component {
     const cycleDay = this.state.cycleDay
     const getCycleDayNumber = cycleModule().getCycleDayNumber
     const cycleDayNumber = getCycleDayNumber(cycleDay.date)
+    const dateInFuture = LocalDate.now().isBefore(LocalDate.parse(this.state.cycleDay.date))
     return (
       <View style={{ flex: 1 }}>
         <Header
@@ -65,36 +66,42 @@ export default class CycleDayOverView extends Component {
               title='Bleeding'
               onPress={() => this.navigate('BleedingEditView')}
               data={getLabel('bleeding', cycleDay.bleeding)}
+              disabled={dateInFuture}
             />
             <SymptomBox
               title='Temperature'
               onPress={() => this.navigate('TemperatureEditView')}
               data={getLabel('temperature', cycleDay.temperature)}
+              disabled={dateInFuture}
             />
             <SymptomBox
               title='Mucus'
               onPress={() => this.navigate('MucusEditView')}
               data={getLabel('mucus', cycleDay.mucus)}
+              disabled={dateInFuture}
             />
             <SymptomBox
               title='Cervix'
               onPress={() => this.navigate('CervixEditView')}
               data={getLabel('cervix', cycleDay.cervix)}
-            />
-            <SymptomBox
-              title='Note'
-              onPress={() => this.navigate('NoteEditView')}
-              data={getLabel('note', cycleDay.note)}
+              disabled={dateInFuture}
             />
             <SymptomBox
               title='Desire'
               onPress={() => this.navigate('DesireEditView')}
               data={getLabel('desire', cycleDay.desire)}
+              disabled={dateInFuture}
             />
             <SymptomBox
               title='Sex'
               onPress={() => this.navigate('SexEditView')}
               data={getLabel('sex', cycleDay.sex)}
+              disabled={dateInFuture}
+            />
+            <SymptomBox
+              title='Note'
+              onPress={() => this.navigate('NoteEditView')}
+              data={getLabel('note', cycleDay.note)}
             />
             <SymptomBox
               title='Pain'
@@ -208,26 +215,26 @@ function getLabel(symptomName, symptom) {
   return label.slice(0, 42) + '...'
 }
 
+
 class SymptomBox extends Component {
   render() {
     const d = this.props.data
     const boxActive = d ? styles.symptomBoxActive : {}
     const iconActive = d ? iconStyles.symptomBoxActive : {}
-    const textStyle = d ? styles.symptomTextActive : {}
-
-    const symptomBoxStyle = Object.assign({}, styles.symptomBox, boxActive)
-    const iconStyle = Object.assign({}, iconStyles.symptomBox, iconActive)
+    const iconStyle = Object.assign({}, iconStyles.symptomBox, iconActive, disabledStyle)
+    const textActive = d ? styles.symptomTextActive : {}
+    const disabledStyle = this.props.disabled ? styles.symptomInFuture : {}
 
     return (
-      <TouchableOpacity onPress={this.props.onPress}>
-        <View style={symptomBoxStyle}>
+      <TouchableOpacity onPress={this.props.onPress} disabled={this.props.disabled}>
+        <View style={[styles.symptomBox, boxActive, disabledStyle]}>
           <Icon
             name='thermometer'
             {...iconStyle}
           />
-          <Text style={textStyle}>{this.props.title}</Text>
+          <Text style={[textActive, disabledStyle]}>{this.props.title}</Text>
         </View>
-        <View style={styles.symptomDataBox}>
+        <View style={[styles.symptomDataBox, disabledStyle]}>
           <Text style={styles.symptomDataText}>{this.props.data}</Text>
         </View>
       </TouchableOpacity>