Edit temperature, save value to db, show on dayview

app.js

@@ -1,6 +1,7 @@
 import { createStackNavigator } from 'react-navigation'
 import Home from './home'
-import TemperatureList from './list'
+
+import Temperature from './temperature'
 import Calendar from './calendar'
 import DayView from './day-view'
 import Bleeding from './bleeding'
@@ -11,7 +12,8 @@ YellowBox.ignoreWarnings(['Warning: isMounted(...) is deprecated'])
 
 export default createStackNavigator({
   home: { screen: Home },
-  temperatureList: { screen: TemperatureList },
+
+  temperature: { screen: Temperature },
   calendar: { screen: Calendar },
   dayView: { screen: DayView },
   bleeding: { screen: Bleeding }

day-view.js

@@ -19,24 +19,38 @@ export default class DayView extends Component {
 
   render() {
     const navigate = this.props.navigation.navigate
-    const day = this.state.cycleDay
+    const cycleDay = this.state.cycleDay
-    const bleedingValue = day.bleeding && day.bleeding.value
+    const bleedingValue = cycleDay.bleeding && cycleDay.bleeding.value
     let bleedingLabel
     if (typeof bleedingValue === 'number') {
       bleedingLabel = `Bleeding: ${labels[bleedingValue]}`
+      if (cycleDay.bleeding.exclude) bleedingLabel += " (Excluded)"
     } else {
       bleedingLabel = ''
     }
+    const temperatureValue = cycleDay.temperature && cycleDay.temperature.value
+    let temperatureLabel
+    if (typeof temperatureValue === 'number') {
+      temperatureLabel = `Temperature: ${temperatureValue}`
+      if (cycleDay.temperature.exclude) temperatureLabel += " (Excluded)"
+    } else {
+      temperatureLabel = ''
+    }
 
     return (
       <View style={styles.container}>
-        <Text style={styles.welcome}>{formatDateForViewHeader(day.date)}</Text>
+        <Text style={styles.welcome}>{formatDateForViewHeader(cycleDay.date)}</Text>
         <Text>Cycle day {getCycleDay()}</Text>
         <Text style={styles.welcome}>{bleedingLabel}</Text>
+        <Text style={styles.welcome}>{temperatureLabel}</Text>
         <Button
-          onPress={() => navigate('bleeding', { cycleDay: day })}
+          onPress={() => navigate('bleeding', { cycleDay })}
           title="Edit bleeding">
         </Button>
+        <Button
+          onPress={() => navigate('temperature', { cycleDay })}
+          title="Edit temperature">
+        </Button>
       </View >
     )
   }

db.js

@@ -1,8 +1,9 @@
 import realm from 'realm'
 
 let db
-let cycleDaysSortedbyTempValueView = []
+
 let bleedingDaysSortedByDate = []
+let cycleDaysSortedbyDate = []
 
 const TemperatureSchema = {
   name: 'Temperature',
@@ -46,19 +47,17 @@ async function openDatabase() {
     // we only want this in dev mode
     deleteRealmIfMigrationNeeded: true
   })
+
+  bleedingDaysSortedByDate = db.objects('CycleDay').fil<<<<<<< 933b64056a13d04c3bfdebf531962b84d9daa4ce
   // just for testing purposes, the highest temperature will be topmost
   // because I was too layz to make a scroll view
-  cycleDaysSortedbyTempValueView = db.objects('CycleDay').filtered('temperature != null').sorted('temperature.value', true)
+  cycleDaysSortedbyTempValueView = db.objects('CycleDay').filtered('temperature != null').sorted('temperature.value', true) tered('bleeding != null').sorted('date', true)
-  bleedingDaysSortedByDate = db.objects('CycleDay').filtered('bleeding != null').sorted('date', true)
+  cycleDaysSortedbyDate = db.objects('CycleDay').sorted('date', true)
 }
 
-function saveTemperature(date, temperature) {
+function saveTemperature(cycleDay, temperature) {
   db.write(() => {
-    const doc = {
+    cycleDay.temperature = temperature
-      date,
-      temperature
-    }
-    db.create('CycleDay', doc)
   })
 }
 
@@ -81,7 +80,6 @@ function getOrCreateCycleDay(localDate) {
 }
 
 export {
-  cycleDaysSortedbyTempValueView,
   openDatabase,
   saveTemperature,
   saveBleeding,

home.js

@@ -17,10 +17,6 @@ export default class Home extends Component {
     return (
       <View style={styles.container}>
         <Text style={styles.welcome}>Welcome! Today is day {getCycleDay()} of your current cycle</Text>
-        <Button
-          onPress={() => navigate('temperatureList')}
-          title="Edit symptoms for today">
-        </Button>
         <Button
           onPress={() => navigate('calendar')}
           title="Go to calendar">

list.js

@@ -1,60 +0,0 @@
-import React, { Component } from 'react'
-import {
-  View,
-  Text,
-  Button,
-  TextInput,
-  FlatList,
-  Keyboard
-} from 'react-native'
-
-import * as styles from './styles'
-import { cycleDaysSortedbyTempValueView, saveTemperature } from './db'
-
-export default class Temp extends Component {
-  constructor(props) {
-    super(props)
-    this.state = {
-      currentValue: '',
-      rerenderToggle: false
-    }
-  }
-
-  render() {
-    return (
-      <View style={styles.container}>
-        <TextInput
-          placeholder="Enter your temperature"
-          onChangeText={(val) => {
-            this.setState({currentValue: val})
-          }}
-          keyboardType='numeric'
-          value = {this.state.currentValue}
-        />
-        <Button
-          onPress={() => {
-            console.log(Number(this.state.currentValue))
-            saveTemperature(
-              new Date(),
-              {
-                value: Number(this.state.currentValue),
-                exclude: false
-              }
-            )
-            this.setState({currentValue: ''})
-            // FlatList only reacts to primitive value changes,
-            // this boolean toggle makes sure the list updates
-            this.setState({ reRender: !this.state.rerenderToggle})
-            Keyboard.dismiss()
-          }}
-          title="Save"
-        />
-        <FlatList
-          data = { cycleDaysSortedbyTempValueView }
-          renderItem={({item}) => <Text>{item.temperature.value}</Text>}
-          extraData = { this.state }
-        />
-      </View>
-    )
-  }
-}

temperature.js

@@ -0,0 +1,76 @@
+import React, { Component } from 'react'
+import {
+  View,
+  Text,
+  Button,
+  TextInput,
+  Switch
+} from 'react-native'
+
+import styles from './styles'
+import { saveTemperature } from './db'
+import { formatDateForViewHeader } from './format'
+import getCycleDay from './get-cycle-day'
+
+export default class Temp extends Component {
+  constructor(props) {
+    super(props)
+    const cycleDay = props.navigation.state.params.cycleDay
+    console.log(cycleDay.temperature ? cycleDay.temperature.value : '')
+    this.state = {
+      cycleDay,
+      currentValue: cycleDay.temperature ? cycleDay.temperature.value.toString() : '',
+      exclude: cycleDay.temperature ? cycleDay.temperature.exclude : false
+    }
+  }
+
+  render() {
+    const navigate = this.props.navigation.navigate
+    const cycleDay = this.state.cycleDay
+    return (
+      <View style={styles.container}>
+        <Text style={styles.welcome}>{formatDateForViewHeader(cycleDay.date)}</Text>
+        <Text>Cycle day {getCycleDay()}</Text>
+        <Text>Temperature</Text>
+        <TextInput
+          placeholder="Enter temperature"
+          onChangeText={(val) => {
+            this.setState({currentValue: val})
+          }}
+          keyboardType='numeric'
+          value = {this.state.currentValue}
+        />
+        <Text>Exclude</Text>
+        <Switch
+          onValueChange = {(val) => {
+            this.setState({ exclude: val })
+          }}
+          value = { this.state.exclude }
+        />
+        <Button
+          onPress={() => {
+            navigate('dayView', { cycleDay })
+          }}
+          title="Cancel">
+        </Button>
+        <Button
+          onPress={() => {
+            saveTemperature(cycleDay)
+            navigate('dayView', { cycleDay })
+          }}
+          title="Delete entry">
+        </Button>
+        <Button
+          onPress={() => {
+            saveTemperature(cycleDay, {
+              value: Number(this.state.currentValue),
+              exclude: this.state.exclude
+            })
+            navigate('dayView', { cycleDay })
+          }}
+          title="Save">
+        </Button>
+      </View>
+    )
+  }
+}