diff --git a/components/header/cycle-day.js b/components/header/cycle-day.js index a78cf1b11939bba1f8616e3b0bae46597b565ac9..332b3005ca5764b7dd506541d7b2c7d34a1f11e9 100644 --- a/components/header/cycle-day.js +++ b/components/header/cycle-day.js @@ -2,11 +2,18 @@ import React from 'react' import { View, Text} from 'react-native' +import { LocalDate } from 'js-joda' import moment from 'moment' import styles from '../../styles' import NavigationArrow from './navigation-arrow' -export default function CycleDayHeader(props) { +const FormattedDate = ({ date }) => { + const today = LocalDate.now() + const dateToDisplay = LocalDate.parse(date) + return today.equals(dateToDisplay) ? 'today' : moment(date).format('MMMM Do YYYY') +} + +export default function CycleDayHeader({ date, ...props }) { return (<View style={[styles.header, styles.headerCycleDay]}> <View style={styles.accentCircle} @@ -15,7 +22,7 @@ export default function CycleDayHeader(props) { <NavigationArrow direction='left' {...props}/> <View> <Text style={styles.dateHeader}> - {moment(props.date).format('MMMM Do YYYY')} + <FormattedDate date={date} /> </Text> {props.cycleDayNumber && <Text style={styles.cycleDayNumber}>