Handle back button presses

app.js

@@ -1,5 +1,5 @@
 import React, { Component } from 'react'
-import { View } from 'react-native'
+import { View, BackHandler } from 'react-native'
 import Header from './components/header'
 import Menu from './components/menu'
 import Home from './components/home'
@@ -21,6 +21,20 @@ export default class App extends Component {
     this.state = {
       currentPage: 'Home'
     }
+
+    const handleBackButtonPress = function() {
+      if (this.state.currentPage === 'Home') return false
+      // this is handled in the SymptomView
+      if (this.state.currentPage === 'SymptomView') return true
+      this.navigate('Home')
+      return true
+    }.bind(this)
+
+    this.backHandler = BackHandler.addEventListener('hardwareBackPress', handleBackButtonPress)
+  }
+
+  componentWillUnmount() {
+    this.backHandler.remove()
   }
 
   navigate(pageName, props) {

components/calendar.js

@@ -10,7 +10,6 @@ export default class CalendarView extends Component {
     this.state = {
       bleedingDaysInCalFormat: toCalFormat(bleedingDaysSortedByDate)
     }
-    console.log(Object.keys(this.state.bleedingDaysInCalFormat))
 
     this.setStateWithCalFormattedDays = (function (CalendarComponent) {
       return function(_, changes) {
@@ -35,7 +34,6 @@ export default class CalendarView extends Component {
   }
 
   render() {
-    console.log('cal render')
     return (
       <View>
         <View style={styles.container}>

components/cycle-day/symptoms/index.js

@@ -1,5 +1,5 @@
 import React, { Component } from 'react'
-import { ScrollView } from 'react-native'
+import { ScrollView, BackHandler } from 'react-native'
 import Header from '../../header'
 import actionButtonModule from '../action-buttons'
 import BleedingEditView from './bleeding'
@@ -34,13 +34,24 @@ export default class SymptomView extends Component {
     super(props)
 
     this.state = {
-      visibleComponent: props.navigation.state.params.symptom,
-      cycleDay: props.navigation.state.params.cycleDay
+      visibleComponent: props.symptom,
+      cycleDay: props.cycleDay
     }
 
     this.makeActionButtons = actionButtonModule(() => {
-      this.props.navigation.navigate('CycleDay', {cycleDay: this.state.cycleDay})
+      this.props.navigate('CycleDay', {cycleDay: this.state.cycleDay})
     })
+
+    const handleBackButtonPress = function() {
+      this.props.navigate('CycleDay', {cycleDay: this.state.cycleDay})
+      return true
+    }.bind(this)
+
+    this.backHandler = BackHandler.addEventListener('hardwareBackPress', handleBackButtonPress)
+  }
+
+  componentWillUnmount() {
+    this.backHandler.remove()
   }
 
   render() {