diff --git a/components/cycle-day/cycle-day-overview.js b/components/cycle-day/cycle-day-overview.js index 85e8d48..baccc50 100644 --- a/components/cycle-day/cycle-day-overview.js +++ b/components/cycle-day/cycle-day-overview.js @@ -49,6 +49,7 @@ export default class CycleDayOverView extends Component { const cycleDay = this.state.cycleDay const getCycleDayNumber = cycleModule().getCycleDayNumber const cycleDayNumber = getCycleDayNumber(cycleDay.date) + const dateInFuture = LocalDate.now().isBefore(LocalDate.parse(this.state.cycleDay.date)) return (
this.navigate('BleedingEditView')} data={getLabel('bleeding', cycleDay.bleeding)} + disabled={dateInFuture} /> this.navigate('TemperatureEditView')} data={getLabel('temperature', cycleDay.temperature)} + disabled={dateInFuture} /> this.navigate('MucusEditView')} data={getLabel('mucus', cycleDay.mucus)} + disabled={dateInFuture} /> this.navigate('CervixEditView')} data={getLabel('cervix', cycleDay.cervix)} - /> - this.navigate('NoteEditView')} - data={getLabel('note', cycleDay.note)} + disabled={dateInFuture} /> this.navigate('DesireEditView')} data={getLabel('desire', cycleDay.desire)} + disabled={dateInFuture} /> this.navigate('SexEditView')} data={getLabel('sex', cycleDay.sex)} + disabled={dateInFuture} + /> + this.navigate('NoteEditView')} + data={getLabel('note', cycleDay.note)} /> {/* this is just to make the last row adhere to the grid (and) because there are no pseudo properties in RN */} @@ -174,26 +181,26 @@ function getLabel(symptomName, symptom) { return label.slice(0, 42) + '...' } + class SymptomBox extends Component { render() { const d = this.props.data const boxActive = d ? styles.symptomBoxActive : {} const iconActive = d ? iconStyles.symptomBoxActive : {} - const textStyle = d ? styles.symptomTextActive : {} - - const symptomBoxStyle = Object.assign({}, styles.symptomBox, boxActive) - const iconStyle = Object.assign({}, iconStyles.symptomBox, iconActive) + const iconStyle = Object.assign({}, iconStyles.symptomBox, iconActive, disabledStyle) + const textActive = d ? styles.symptomTextActive : {} + const disabledStyle = this.props.disabled ? styles.symptomInFuture : {} return ( - - + + - {this.props.title} + {this.props.title} - + {this.props.data} diff --git a/styles/index.js b/styles/index.js index 406de7a..2546606 100644 --- a/styles/index.js +++ b/styles/index.js @@ -61,6 +61,10 @@ export default StyleSheet.create({ symptomTextActive: { color: fontOnPrimaryColor }, + symptomInFuture: { + borderColor: 'lightgrey', + color: 'lightgrey' + }, symptomDataBox: { borderColor: secondaryColor, borderStyle: 'solid',