Add mood component, add mood as tracking category to db schemas, add mood category description, add mood to the cycle-day-overview

2019-01-09 08:53:30 +01:00
parent 71d0c61596
commit 56f5c92f87
6 changed files with 318 additions and 5 deletions
@@ -0,0 +1,78 @@
+import React, { Component } from 'react'
+import {
+  ScrollView,
+  TextInput,
+  View
+} from 'react-native'
+import { saveSymptom } from '../../../db'
+import { mood as labels } from '../../../i18n/en/cycle-day'
+import ActionButtonFooter from './action-button-footer'
+import SelectBoxGroup from '../select-box-group'
+import SymptomSection from './symptom-section'
+import styles from '../../../styles'
+
+export default class Mood extends Component {
+  constructor(props) {
+    super(props)
+    const cycleDay = props.cycleDay
+    if (cycleDay && cycleDay.pain) {
+      this.state = Object.assign({}, cycleDay.pain)
+    } else {
+      this.state = {}
+    }
+    if (this.state.note) {
+      this.state.other = true
+    }
+  }
+
+  toggleState = (key) => {
+    const curr = this.state[key]
+    this.setState({[key]: !curr})
+    if (key === 'other' && !curr) {
+      this.setState({focusTextArea: true})
+    }
+  }
+
+  render() {
+    return (
+      <View style={{ flex: 1 }}>
+        <ScrollView style={styles.page}>
+          <SymptomSection
+            explainer={labels.explainer}
+          >
+            <SelectBoxGroup
+              labels={labels.categories}
+              onSelect={this.toggleState}
+              optionsState={this.state}
+            />
+            { this.state.other &&
+              <TextInput
+                autoFocus={this.state.focusTextArea}
+                multiline={true}
+                placeholder="Enter"
+                value={this.state.note}
+                onChangeText={(val) => {
+                  this.setState({note: val})
+                }}
+              />
+            }
+          </SymptomSection>
+        </ScrollView>
+        <ActionButtonFooter
+          symptom='mood'
+          date={this.props.date}
+          currentSymptomValue={this.state}
+          saveAction={() => {
+            const copyOfState = Object.assign({}, this.state)
+            if (!copyOfState.other) {
+              copyOfState.note = null
+            }
+            saveSymptom('mood', this.props.date, copyOfState)
+          }}
+          saveDisabled={Object.values(this.state).every(value => !value)}
+          navigate={this.props.navigate}
+        />
+      </View>
+    )
+  }
+}