diff --git a/components/cycle-day/labels/labels.js b/components/cycle-day/labels/labels.js index d8ebd2c845326c4b86481e960470c0e9416b3e74..05473c12849eb8b06cebc7af633bbd859eb55668 100644 --- a/components/cycle-day/labels/labels.js +++ b/components/cycle-day/labels/labels.js @@ -43,7 +43,9 @@ export const sex = { patch: 'Patch', ring: 'Ring', implant: 'Implant', - other: 'Other' + other: 'Other', + activityExplainer: 'Were you sexually active today?', + contraceptiveExplainer: 'Did you use contraceptives?' } export const pain = { diff --git a/components/cycle-day/symptoms/sex.js b/components/cycle-day/symptoms/sex.js index adcfcef2e6c3da267105df5a86e8e8f19008228b..a51b5c02336ce67a683be36bd33234539e3af663 100644 --- a/components/cycle-day/symptoms/sex.js +++ b/components/cycle-day/symptoms/sex.js @@ -6,39 +6,39 @@ import { } from 'react-native' import styles from '../../../styles' import { saveSymptom } from '../../../db' -import { sex as sexLabels } from '../labels/labels' +import { sex as labels } from '../labels/labels' import ActionButtonFooter from './action-button-footer' import SelectBoxGroup from '../select-box-group' -import { SymptomSectionHeader } from '../../app-text' +import SymptomSection from './symptom-section' const sexBoxes = [{ - label: sexLabels.solo, + label: labels.solo, stateKey: 'solo' }, { - label: sexLabels.partner, + label: labels.partner, stateKey: 'partner' }] const contraceptiveBoxes = [{ - label: sexLabels.condom, + label: labels.condom, stateKey: 'condom' }, { - label: sexLabels.pill, + label: labels.pill, stateKey: 'pill' }, { - label: sexLabels.iud, + label: labels.iud, stateKey: 'iud' }, { - label: sexLabels.patch, + label: labels.patch, stateKey: 'patch' }, { - label: sexLabels.ring, + label: labels.ring, stateKey: 'ring' }, { - label: sexLabels.implant, + label: labels.implant, stateKey: 'implant' }, { - label: sexLabels.other, + label: labels.other, stateKey: 'other' }] @@ -69,18 +69,26 @@ export default class Sex extends Component { return ( <View style={{ flex: 1 }}> <ScrollView style={styles.page}> - <SymptomSectionHeader>Activity</SymptomSectionHeader> - <SelectBoxGroup - data={sexBoxes} - onSelect={this.toggleState} - optionsState={this.state} - /> - <SymptomSectionHeader>Contraceptives</SymptomSectionHeader> - <SelectBoxGroup - data={contraceptiveBoxes} - onSelect={this.toggleState} - optionsState={this.state} - /> + <SymptomSection + header="Activity" + explainer={labels.activityExplainer} + > + <SelectBoxGroup + data={sexBoxes} + onSelect={this.toggleState} + optionsState={this.state} + /> + </SymptomSection> + <SymptomSection + header="Contraceptives" + explainer={labels.contraceptiveExplainer} + > + <SelectBoxGroup + data={contraceptiveBoxes} + onSelect={this.toggleState} + optionsState={this.state} + /> + </SymptomSection> {this.state.other && <TextInput