diff --git a/components/cycle-day/select-tab-group.js b/components/cycle-day/select-tab-group.js index b960d95..ef3dec8 100644 --- a/components/cycle-day/select-tab-group.js +++ b/components/cycle-day/select-tab-group.js @@ -23,7 +23,13 @@ export default class SelectTabGroup extends Component { if (isActive) activeStyle = styles.selectTabActive return ( isActive ? this.props.onSelect(null) : this.props.onSelect(value)} + onPress={() => { + if (this.props.isRadioButton) { + this.props.onSelect(value) + } else { + isActive ? this.props.onSelect(null) : this.props.onSelect(value) + } + }} key={i} activeOpacity={1} > diff --git a/components/cycle-day/symptoms/action-button-footer.js b/components/cycle-day/symptoms/action-button-footer.js index ea96f94..c209941 100644 --- a/components/cycle-day/symptoms/action-button-footer.js +++ b/components/cycle-day/symptoms/action-button-footer.js @@ -3,11 +3,13 @@ import { View, TouchableOpacity, Text } from 'react-native' import Icon from 'react-native-vector-icons/MaterialCommunityIcons' +import { saveSymptom } from '../../../db' import styles, {iconStyles} from '../../../styles' export default class ActionButtonFooter extends Component { render() { const { + symptom, cycleDay, saveAction, saveDisabled, @@ -15,33 +17,65 @@ export default class ActionButtonFooter extends Component { autoShowDayView = true} = this.props const navigateToOverView = () => navigate('CycleDay', {cycleDay}) - const saveButton = { - title: 'Save', - action: () => { - saveAction() - if (autoShowDayView) navigateToOverView() + const buttonsNewEntry = [ + { + title: 'Cancel', + action: () => navigateToOverView(), + icon: 'cancel' }, - disabledCondition: saveDisabled, - icon: 'content-save-outline' - } - const textStyle = saveButton.disabledCondition ? styles.menuTextInActive : styles.menuText - const iconStyle = saveButton.disabledCondition ? - Object.assign({}, iconStyles.menuIcon, iconStyles.menuIconInactive) : - iconStyles.menuIcon + { + title: 'Add', + action: () => { + saveAction() + if (autoShowDayView) navigateToOverView() + }, + disabledCondition: saveDisabled, + icon: 'content-save-outline' + } + ] + const buttonsEdit = [ + { + title: 'Delete', + action: () => { + saveSymptom(symptom, cycleDay) + navigateToOverView() + }, + disabledCondition: !cycleDay[symptom], + icon: 'delete-outline' + }, { + title: 'Save', + action: () => { + saveAction() + if (autoShowDayView) navigateToOverView() + }, + disabledCondition: saveDisabled, + icon: 'content-save-outline' + } + ] + const buttons = !cycleDay[symptom] ? buttonsNewEntry : buttonsEdit return ( - - - - {saveButton.title} - - + {buttons.map(({ title, action, disabledCondition, icon }, i) => { + const textStyle = disabledCondition ? styles.menuTextInActive : styles.menuText + const iconStyle = disabledCondition ? + Object.assign({}, iconStyles.menuIcon, iconStyles.menuIconInactive) : + iconStyles.menuIcon + + return ( + + + + {title} + + + ) + })} ) } diff --git a/components/cycle-day/symptoms/bleeding.js b/components/cycle-day/symptoms/bleeding.js index 6357c26..2f6f1ae 100644 --- a/components/cycle-day/symptoms/bleeding.js +++ b/components/cycle-day/symptoms/bleeding.js @@ -40,6 +40,7 @@ export default class Bleeding extends Component { buttons={bleedingRadioProps} active={this.state.currentValue} onSelect={val => this.setState({ currentValue: val })} + isRadioButton={true} /> { saveSymptom('bleeding', this.props.cycleDay, { diff --git a/components/cycle-day/symptoms/cervix.js b/components/cycle-day/symptoms/cervix.js index ccb1cbd..e926573 100644 --- a/components/cycle-day/symptoms/cervix.js +++ b/components/cycle-day/symptoms/cervix.js @@ -50,6 +50,7 @@ export default class Cervix extends Component { buttons={cervixOpeningRadioProps} active={this.state.opening} onSelect={val => this.setState({ opening: val })} + isRadioButton={true} /> this.setState({ firmness: val })} + isRadioButton={true} /> this.setState({ position: val })} + isRadioButton={false} /> this.setState({ currentValue: val })} + isRadioButton={true} />