Implement Sex \o/:

* Offers tracking sex activities and contraceptives as much as you want
* "Other" contraceptive allows to specify with text input

components/cycle-day/symptoms/index.js

@@ -4,6 +4,7 @@ import MucusEditView from './mucus'
 import CervixEditView from './cervix'
 import NoteEditView from './note'
 import DesireEditView from './desire'
+import SexEditView from './sex'
 
 export default {
   BleedingEditView,
@@ -11,5 +12,6 @@ export default {
   MucusEditView,
   CervixEditView,
   NoteEditView,
-  DesireEditView
-}
+  DesireEditView,
+  SexEditView
+}

components/cycle-day/symptoms/sex.js

@@ -0,0 +1,153 @@
+import React, { Component } from 'react'
+import {
+  CheckBox,
+  Text,
+  TextInput,
+  View
+} from 'react-native'
+import styles from '../../../styles'
+import { saveSymptom } from '../../../db'
+import {
+  sexActivity as activityLabels,
+  contraceptives as contraceptiveLabels
+} from '../labels/labels'
+
+export default class Sex extends Component {
+  constructor(props) {
+    super(props)
+    this.cycleDay = props.cycleDay
+    this.state = {}
+    if (this.cycleDay.sex !== null ) {
+      Object.assign(this.state, this.cycleDay.sex)
+      // We make sure other is always true when there is a note,
+      // e.g. when import is messed up.
+      if (this.cycleDay.sex && this.cycleDay.sex.note) {
+        this.state.other = true
+      }
+    }
+  }
+
+  render() {
+
+    return (
+      <View style={styles.symptomEditView}>
+        <Text style={styles.symptomDayView}>SEX</Text>
+        <View style={styles.symptomViewRowInline}>
+          <Text style={styles.symptomDayView}>{activityLabels.solo}</Text>
+          <CheckBox
+            value={this.state.solo}
+            onValueChange={(val) => {
+              this.setState({solo: val})
+            }}
+          />
+          <Text style={styles.symptomDayView}>{activityLabels.partner}</Text>
+          <CheckBox
+            value={this.state.partner}
+            onValueChange={(val) => {
+              this.setState({partner: val})
+            }}
+          />
+        </View>
+        <Text style={styles.symptomDayView}>CONTRACEPTIVES</Text>
+        <View style={styles.symptomViewRowInline}>
+          <Text style={styles.symptomDayView}>
+            {contraceptiveLabels.condom}
+          </Text>
+          <CheckBox
+            value={this.state.condom}
+            onValueChange={(val) => {
+              this.setState({condom: val})
+            }}
+          />
+          <Text style={styles.symptomDayView}>
+            {contraceptiveLabels.pill}
+          </Text>
+          <CheckBox
+            value={this.state.pill}
+            onValueChange={(val) => {
+              this.setState({pill: val})
+            }}
+          />
+        </View>
+        <View style={styles.symptomViewRowInline}>
+          <Text style={styles.symptomDayView}>
+            {contraceptiveLabels.iud}
+          </Text>
+          <CheckBox
+            value={this.state.iud}
+            onValueChange={(val) => {
+              this.setState({iud: val})
+            }}
+          />
+          <Text style={styles.symptomDayView}>
+            {contraceptiveLabels.patch}
+          </Text>
+          <CheckBox
+            value={this.state.patch}
+            onValueChange={(val) => {
+              this.setState({patch: val})
+            }}
+          />
+        </View>
+        <View style={styles.symptomViewRowInline}>
+          <Text style={styles.symptomDayView}>
+            {contraceptiveLabels.ring}
+          </Text>
+          <CheckBox
+            value={this.state.ring}
+            onValueChange={(val) => {
+              this.setState({ring: val})
+            }}
+          />
+          <Text style={styles.symptomDayView}>
+            {contraceptiveLabels.implant}
+          </Text>
+          <CheckBox
+            value={this.state.implant}
+            onValueChange={(val) => {
+              this.setState({implant: val})
+            }}
+          />
+        </View>
+        <View style={styles.symptomViewRowInline}>
+          <Text style={styles.symptomDayView}>
+            {contraceptiveLabels.other}
+          </Text>
+          <CheckBox
+            value={this.state.other}
+            onValueChange={(val) => {
+              this.setState({other: val})
+            }}
+          />
+        </View>
+        { this.state.other &&
+          <TextInput
+            autoFocus={true}
+            multiline={true}
+            placeholder="Enter"
+            value={this.state.note}
+            onChangeText={(val) => {
+              this.setState({note: val})
+            }}
+          />
+        }
+        <View style={styles.actionButtonRow}>
+          {this.props.makeActionButtons(
+            {
+              symptom: 'sex',
+              cycleDay: this.cycleDay,
+              saveAction: () => {
+                const copyOfState = Object.assign({}, this.state)
+                if (!copyOfState.other) {
+                  copyOfState.note = null
+                }
+                saveSymptom('sex', this.cycleDay, copyOfState)
+              },
+              saveDisabled: Object.values(this.state).every(value => !value)
+            }
+          )}
+        </View>
+      </View>
+    )
+  }
+}