Merge branch '100-implement-desire' into 'master'

Resolve "Implement desire"

Closes #100

See merge request bloodyhealth/drip!44

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

@@ -12,7 +12,8 @@ import {
   mucusNFP as computeSensiplanMucusLabels,
   cervixOpening as openingLabels,
   cervixFirmness as firmnessLabels,
-  cervixPosition as positionLabels
+  cervixPosition as positionLabels,
+  intensity as intensityLabels
 } from './labels/labels'
 import cycleDayModule from '../../lib/cycle'
 import { bleedingDaysSortedByDate } from '../../db'
@@ -93,6 +94,15 @@ export default class DayView extends Component {
             </Button>
           </View>
         </View>
+        <View style={ styles.symptomViewRowInline }>
+          <Text style={styles.symptomDayView}>Desire</Text>
+          <View style={styles.symptomEditButton}>
+            <Button
+              onPress={() => this.showView('desireEditView')}
+              title={getLabel('desire', cycleDay.desire)}>
+            </Button>
+          </View>
+        </View>
       </View >
     )
   }
@@ -137,6 +147,12 @@ function getLabel(symptomName, symptom) {
     },
     note: note => {
       return note.value.slice(0, 12) + '...'
+    },
+    desire: desire => {
+      if (typeof desire.value === 'number') {
+        const desireLabel = `${intensityLabels[desire.value]}`
+        return desireLabel
+      }
     }
   }
 

components/cycle-day/index.js

@@ -12,6 +12,7 @@ import TemperatureEditView from './symptoms/temperature'
 import MucusEditView from './symptoms/mucus'
 import CervixEditView from './symptoms/cervix'
 import NoteEditView from './symptoms/note'
+import DesireEditView from './symptoms/desire'
 import { formatDateForViewHeader } from './labels/format'
 import styles from '../../styles'
 import actionButtonModule from './action-buttons'
@@ -61,7 +62,8 @@ export default class Day extends Component {
               temperatureEditView: <TemperatureEditView cycleDay={this.cycleDay} makeActionButtons={this.makeActionButtons}/>,
               mucusEditView: <MucusEditView cycleDay={this.cycleDay} makeActionButtons={this.makeActionButtons}/>,
               cervixEditView: <CervixEditView cycleDay={this.cycleDay} makeActionButtons={this.makeActionButtons} />,
-              noteEditView: <NoteEditView cycleDay={this.cycleDay} makeActionButtons={this.makeActionButtons} />
+              noteEditView: <NoteEditView cycleDay={this.cycleDay} makeActionButtons={this.makeActionButtons} />,
+              desireEditView: <DesireEditView cycleDay={this.cycleDay} makeActionButtons={this.makeActionButtons} />
             }[this.state.visibleComponent]
           }
         </View >

components/cycle-day/labels/labels.js

@@ -5,6 +5,7 @@ export const mucusNFP = ['t', 'Ø', 'f', 'S', '+S']
 export const cervixOpening = ['closed', 'medium', 'open']
 export const cervixFirmness = ['hard', 'soft']
 export const cervixPosition = ['low', 'medium', 'high']
+export const intensity = ['low', 'medium', 'high']
 
 export const fertilityStatus = {
   fertile: 'fertile',

components/cycle-day/symptoms/desire.js

@@ -0,0 +1,59 @@
+import React, { Component } from 'react'
+import {
+  View,
+  Text
+} from 'react-native'
+import RadioForm from 'react-native-simple-radio-button'
+import styles from '../../../styles'
+import { saveSymptom } from '../../../db'
+import { intensity as labels } from '../labels/labels'
+
+export default class Desire extends Component {
+  constructor(props) {
+    super(props)
+    this.cycleDay = props.cycleDay
+    this.makeActionButtons = props.makeActionButtons
+    let desireValue = this.cycleDay.desire && this.cycleDay.desire.value
+    if (!(typeof desireValue === 'number')) {
+      desireValue = -1
+    }
+    this.state = { currentValue: desireValue }
+  }
+
+  render() {
+    const desireRadioProps = [
+      { label: labels[0], value: 0 },
+      { label: labels[1], value: 1 },
+      { label: labels[2], value: 2 }
+    ]
+    return (
+      <View style={styles.symptomEditView}>
+        <Text style={styles.symptomDayView}>Desire</Text>
+        <View style={styles.radioButtonRow}>
+          <RadioForm
+            radio_props={desireRadioProps}
+            initial={this.state.currentValue}
+            formHorizontal={true}
+            labelHorizontal={false}
+            labelStyle={styles.radioButton}
+            onPress={(itemValue) => {
+              this.setState({ currentValue: itemValue })
+            }}
+          />
+        </View>
+        <View style={styles.actionButtonRow}>
+          {this.makeActionButtons(
+            {
+              symptom: 'desire',
+              cycleDay: this.cycleDay,
+              saveAction: () => {
+                saveSymptom('desire', this.cycleDay, { value: this.state.currentValue })
+              },
+              saveDisabled: this.state.currentValue === -1
+            }
+          )}
+        </View>
+      </View>
+    )
+  }
+}

components/cycle-day/symptoms/note.js

@@ -21,7 +21,6 @@ export default class Temp extends Component {
   }
 
   render() {
-    console.log(this.cycleDay.note)
     return (
       <View style={styles.symptomEditView}>
         <View style={styles.symptomViewRow}>

db/index.js

@@ -53,6 +53,13 @@ const NoteSchema = {
   }
 }
 
+const DesireSchema = {
+  name: 'Desire',
+  properties: {
+    value: 'int'
+  }
+}
+
 const CycleDaySchema = {
   name: 'CycleDay',
   primaryKey: 'date',
@@ -77,6 +84,10 @@ const CycleDaySchema = {
     note: {
       type: 'Note',
       optional: true
+    },
+    desire: {
+      type: 'Desire',
+      optional: true
     }
   }
 }
@@ -88,7 +99,8 @@ const realmConfig = {
     BleedingSchema,
     MucusSchema,
     CervixSchema,
-    NoteSchema
+    NoteSchema,
+    DesireSchema
   ],
   // we only want this in dev mode
   deleteRealmIfMigrationNeeded: true