diff --git a/components/calendar.js b/components/calendar.js index 80ac49f..dcff78d 100644 --- a/components/calendar.js +++ b/components/calendar.js @@ -75,7 +75,7 @@ class CalendarView extends Component { firstDay={1} onDayPress={this.passDateToDayView.bind(this)} markedDates={markedDates} - markingType='custom' + markingType="custom" theme={calendarTheme} // Max amount of months allowed to scroll to the past. pastScrollRange={120} diff --git a/components/chart/chart.js b/components/chart/chart.js index 4b9573d..14e1afd 100644 --- a/components/chart/chart.js +++ b/components/chart/chart.js @@ -6,7 +6,7 @@ import { FlatList, PixelRatio, StyleSheet, - View + View, } from 'react-native' import AppLoadingView from '../common/app-loading' @@ -24,7 +24,11 @@ import { navigate } from '../../slices/navigation' import { getCycleDaysSortedByDate } from '../../db' import nothingChanged from '../../db/db-unchanged' -import { getChartFlag, scaleObservable, setChartFlag } from '../../local-storage' +import { + getChartFlag, + scaleObservable, + setChartFlag, +} from '../../local-storage' import { makeColumnInfo, nfpLines } from '../helpers/chart' import { @@ -32,7 +36,7 @@ import { CHART_GRID_LINE_HORIZONTAL_WIDTH, CHART_SYMPTOM_HEIGHT_RATIO, CHART_XAXIS_HEIGHT_RATIO, - SYMPTOMS + SYMPTOMS, } from '../../config' import { shared } from '../../i18n/en/labels' import { Colors, Spacing } from '../../styles' @@ -40,7 +44,7 @@ import { Colors, Spacing } from '../../styles' class CycleChart extends Component { static propTypes = { navigate: PropTypes.func, - end: PropTypes.bool + end: PropTypes.bool, } constructor(props) { @@ -80,12 +84,12 @@ class CycleChart extends Component { prepareSymptomData = () => { this.symptomRowSymptoms = SYMPTOMS.filter((symptomName) => { - return this.cycleDaysSortedByDate.some(cycleDay => { - return (symptomName !== 'temperature') && cycleDay[symptomName] + return this.cycleDaysSortedByDate.some((cycleDay) => { + return symptomName !== 'temperature' && cycleDay[symptomName] }) }) this.chartSymptoms = [...this.symptomRowSymptoms] - if (this.cycleDaysSortedByDate.some(day => day.temperature)) { + if (this.cycleDaysSortedByDate.some((day) => day.temperature)) { this.chartSymptoms.push('temperature') this.shouldShowTemperatureColumn = true } @@ -114,15 +118,16 @@ class CycleChart extends Component { this.xAxisHeight = height * 0.7 * CHART_XAXIS_HEIGHT_RATIO const remainingHeight = height * 0.7 - this.xAxisHeight this.symptomHeight = PixelRatio.roundToNearestPixel( - remainingHeight - * CHART_SYMPTOM_HEIGHT_RATIO + remainingHeight * CHART_SYMPTOM_HEIGHT_RATIO ) - this.symptomRowHeight = PixelRatio.roundToNearestPixel( - this.symptomRowSymptoms.length * this.symptomHeight - ) + CHART_GRID_LINE_HORIZONTAL_WIDTH + this.symptomRowHeight = + PixelRatio.roundToNearestPixel( + this.symptomRowSymptoms.length * this.symptomHeight + ) + CHART_GRID_LINE_HORIZONTAL_WIDTH this.columnHeight = remainingHeight - this.symptomRowHeight - const chartHeight = this.shouldShowTemperatureColumn ? - height * 0.7 : (this.symptomRowHeight + this.xAxisHeight) + const chartHeight = this.shouldShowTemperatureColumn + ? height * 0.7 + : this.symptomRowHeight + this.xAxisHeight const numberOfColumnsToRender = Math.round(width / CHART_COLUMN_WIDTH) const columns = makeColumnInfo() @@ -131,7 +136,7 @@ class CycleChart extends Component { updateListeners(dataUpdateHandler) { // remove existing listeners - if(this.handleDbChange) { + if (this.handleDbChange) { this.cycleDaysSortedByDate.removeListener(this.handleDbChange) } if (this.removeObvListener) this.removeObvListener() @@ -150,7 +155,7 @@ class CycleChart extends Component { chartHeight, chartLoaded, shouldShowHint, - numberOfColumnsToRender + numberOfColumnsToRender, } = this.state const hasDataToDisplay = this.chartSymptoms.length > 0 @@ -163,53 +168,52 @@ class CycleChart extends Component { {!hasDataToDisplay && } {hasDataToDisplay && !chartHeight && !chartLoaded && } - {shouldShowHint && chartLoaded && + {shouldShowHint && chartLoaded && ( - } - {hasDataToDisplay && chartLoaded && - !this.shouldShowTemperatureColumn && - - - {shared.noTemperatureWarning} - - - } + )} + {hasDataToDisplay && + chartLoaded && + !this.shouldShowTemperatureColumn && ( + + + {shared.noTemperatureWarning} + + + )} {hasDataToDisplay && ( - {chartHeight && chartLoaded && ( )} - {chartHeight && - item} - initialNumToRender={numberOfColumnsToRender} - windowSize={30} - onLayout={() => this.setState({chartLoaded: true})} - onEndReached={() => this.setState({end: true})} - ListFooterComponent={} - updateCellsBatchingPeriod={800} - contentContainerStyle={{ height: chartHeight }} - /> - } + {chartHeight && ( + item} + initialNumToRender={numberOfColumnsToRender} + windowSize={30} + onLayout={() => this.setState({ chartLoaded: true })} + onEndReached={() => this.setState({ end: true })} + ListFooterComponent={} + updateCellsBatchingPeriod={800} + contentContainerStyle={{ height: chartHeight }} + /> + )} {chartHeight && chartLoaded && ( - {this.shouldShowTemperatureColumn && + {this.shouldShowTemperatureColumn && ( - } + )} )} @@ -223,45 +227,42 @@ class CycleChart extends Component { function LoadingMoreView({ end }) { return ( - {!end && } + {!end && } ) } LoadingMoreView.propTypes = { - end: PropTypes.bool + end: PropTypes.bool, } const styles = StyleSheet.create({ chartArea: { - flexDirection: 'row' + flexDirection: 'row', }, chartContainer: { - flexDirection: 'column' + flexDirection: 'column', }, loadingContainer: { height: '100%', backgroundColor: Colors.turquoiseLight, - justifyContent: 'center' + justifyContent: 'center', }, page: { - marginVertical: Spacing.small + marginVertical: Spacing.small, }, pageContainer: { - paddingHorizontal: Spacing.base + paddingHorizontal: Spacing.base, }, warning: { - padding: Spacing.large - } + padding: Spacing.large, + }, }) const mapDispatchToProps = (dispatch) => { - return({ + return { navigate: (page) => dispatch(navigate(page)), - }) + } } -export default connect( - null, - mapDispatchToProps, -)(CycleChart) +export default connect(null, mapDispatchToProps)(CycleChart) diff --git a/components/chart/day-column.js b/components/chart/day-column.js index 7404e53..577b54a 100644 --- a/components/chart/day-column.js +++ b/components/chart/day-column.js @@ -15,7 +15,7 @@ import CycleDayLabel from './cycle-day-label' import { symptomColorMethods, getTemperatureProps, - isSymptomDataComplete + isSymptomDataComplete, } from '../helpers/chart' class DayColumn extends Component { @@ -40,14 +40,17 @@ class DayColumn extends Component { this.data = {} if (cycleDayData) { - this.data = chartSymptoms.reduce((symptomDataToDisplay, symptom, ) => { + this.data = chartSymptoms.reduce((symptomDataToDisplay, symptom) => { const symptomData = cycleDayData[symptom] if (symptomData && symptom === 'temperature') { - symptomDataToDisplay[symptom] = - getTemperatureProps(symptomData, columnHeight, dateString) + symptomDataToDisplay[symptom] = getTemperatureProps( + symptomData, + columnHeight, + dateString + ) } else { - if (symptomData && ! symptomData.exclude) { + if (symptomData && !symptomData.exclude) { // if symptomColorMethods entry doesn't exist for given symptom, // use 'default' const getSymptomColorIndex = @@ -78,12 +81,13 @@ class DayColumn extends Component { } render() { - const { columnHeight, + const { + columnHeight, dateString, shouldShowTemperatureColumn, symptomHeight, symptomRowSymptoms, - xAxisHeight + xAxisHeight, } = this.props return ( @@ -91,22 +95,22 @@ class DayColumn extends Component { onPress={() => this.onDaySelect(dateString)} activeOpacity={1} > + {shouldShowTemperatureColumn && ( + + )} - {shouldShowTemperatureColumn && } + - - - { symptomRowSymptoms.map((symptom, i) => { - const hasSymptomData = - Object.prototype.hasOwnProperty.call(this.data, symptom) + {symptomRowSymptoms.map((symptom, i) => { + const hasSymptomData = Object.prototype.hasOwnProperty.call( + this.data, + symptom + ) return ( ) - } - )} - + /> + ) + })} ) } } const mapDispatchToProps = (dispatch) => { - return({ + return { setDate: (date) => dispatch(setDate(date)), navigate: (page) => dispatch(navigate(page)), - }) + } } -export default connect( - null, - mapDispatchToProps, -)(DayColumn) +export default connect(null, mapDispatchToProps)(DayColumn) diff --git a/components/chart/no-data.js b/components/chart/no-data.js index 154ca51..79abed5 100644 --- a/components/chart/no-data.js +++ b/components/chart/no-data.js @@ -15,7 +15,12 @@ const NoData = ({ navigate }) => { return ( {shared.noDataWarning} - @@ -28,17 +33,14 @@ NoData.propTypes = { const styles = StyleSheet.create({ container: { - ...Containers.centerItems - } + ...Containers.centerItems, + }, }) const mapDispatchToProps = (dispatch) => { - return({ + return { navigate: (page) => dispatch(navigate(page)), - }) + } } -export default connect( - null, - mapDispatchToProps, -)(NoData) \ No newline at end of file +export default connect(null, mapDispatchToProps)(NoData) diff --git a/components/header/logo.js b/components/header/logo.js index da2759b..9748b68 100644 --- a/components/header/logo.js +++ b/components/header/logo.js @@ -10,7 +10,7 @@ import { navigate } from '../../slices/navigation' import { Colors, Fonts, Sizes } from '../../styles' const Logo = ({ navigate }) => { - return( + return ( navigate('Home')}> drip. @@ -18,24 +18,21 @@ const Logo = ({ navigate }) => { } Logo.propTypes = { - navigate: PropTypes.func.isRequired + navigate: PropTypes.func.isRequired, } const styles = StyleSheet.create({ logo: { color: Colors.turquoiseDark, fontFamily: Fonts.bold, - fontSize: Sizes.title - } + fontSize: Sizes.title, + }, }) const mapDispatchToProps = (dispatch) => { - return({ + return { navigate: (page) => dispatch(navigate(page)), - }) + } } -export default connect( - null, - mapDispatchToProps, -)(Logo) \ No newline at end of file +export default connect(null, mapDispatchToProps)(Logo) diff --git a/components/header/menu-item.js b/components/header/menu-item.js index d7b1a46..eaadea9 100644 --- a/components/header/menu-item.js +++ b/components/header/menu-item.js @@ -16,7 +16,7 @@ const MenuItem = ({ item, navigate, closeMenu }) => { navigate(component) } - return( + return ( {name} @@ -26,22 +26,19 @@ const MenuItem = ({ item, navigate, closeMenu }) => { MenuItem.propTypes = { item: PropTypes.object.isRequired, navigate: PropTypes.func.isRequired, - closeMenu: PropTypes.func.isRequired + closeMenu: PropTypes.func.isRequired, } const styles = StyleSheet.create({ text: { - ...Typography.subtitle - } + ...Typography.subtitle, + }, }) const mapDispatchToProps = (dispatch) => { - return({ + return { navigate: (page) => dispatch(navigate(page)), - }) + } } -export default connect( - null, - mapDispatchToProps, -)(MenuItem) +export default connect(null, mapDispatchToProps)(MenuItem) diff --git a/components/menu/menu-item.js b/components/menu/menu-item.js index fc1c1f8..a2f99dc 100644 --- a/components/menu/menu-item.js +++ b/components/menu/menu-item.js @@ -10,17 +10,16 @@ import { getNavigation, navigate } from '../../slices/navigation' import { Colors, Containers, Fonts, Sizes, Spacing } from '../../styles' const MenuItem = ({ component, icon, label, navigate, navigation }) => { - const isActive = (component === navigation.currentPage) + const isActive = component === navigation.currentPage const textStyle = isActive ? styles.menuTextActive : styles.menuText const testID = isActive ? 'activeMenuItem' : `menuItem${label}` return ( - navigate(component)} - > - - {label} + navigate(component)}> + + + {label} + ) } @@ -36,37 +35,34 @@ MenuItem.propTypes = { const text = { fontFamily: Fonts.bold, fontSize: Sizes.small, - textTransform: 'uppercase' + textTransform: 'uppercase', } const styles = StyleSheet.create({ button: { padding: Spacing.base, - ...Containers.centerItems + ...Containers.centerItems, }, menuText: { color: Colors.grey, - ...text + ...text, }, menuTextActive: { color: Colors.orange, - ...text - } + ...text, + }, }) const mapStateToProps = (state) => { - return({ + return { navigation: getNavigation(state), - }) + } } const mapDispatchToProps = (dispatch) => { - return({ + return { navigate: (page) => dispatch(navigate(page)), - }) + } } -export default connect( - mapStateToProps, - mapDispatchToProps, -)(MenuItem) +export default connect(mapStateToProps, mapDispatchToProps)(MenuItem) diff --git a/components/password-prompt.js b/components/password-prompt.js index 4f2544c..d7cb092 100644 --- a/components/password-prompt.js +++ b/components/password-prompt.js @@ -17,7 +17,7 @@ const cancelButton = { text: shared.cancel, style: 'cancel' } export default class PasswordPrompt extends Component { static propTypes = { - enableShowApp: PropTypes.func.isRequired + enableShowApp: PropTypes.func.isRequired, } constructor(props) { @@ -32,22 +32,20 @@ export default class PasswordPrompt extends Component { } onConfirmDeletion = async () => { - Alert.alert( - labels.deleteDatabaseTitle, - labels.deleteDatabaseExplainer, - [cancelButton, { text: labels.deleteData, onPress: this.onDeleteData}] - ) + Alert.alert(labels.deleteDatabaseTitle, labels.deleteDatabaseExplainer, [ + cancelButton, + { text: labels.deleteData, onPress: this.onDeleteData }, + ]) } onDeleteData = () => { - Alert.alert( - labels.areYouSureTitle, - labels.areYouSure, - [cancelButton, { + Alert.alert(labels.areYouSureTitle, labels.areYouSure, [ + cancelButton, + { text: labels.reallyDeleteData, - onPress: this.onDeleteDataConfirmation - }] - ) + onPress: this.onDeleteDataConfirmation, + }, + ]) } onDeleteDataConfirmation = async () => { @@ -56,17 +54,15 @@ export default class PasswordPrompt extends Component { this.props.enableShowApp() } - passHashToDb = async hash => { + passHashToDb = async (hash) => { const connected = await openDb(hash) if (!connected) { - Alert.alert( - shared.incorrectPassword, - shared.incorrectPasswordMessage, - [{ + Alert.alert(shared.incorrectPassword, shared.incorrectPasswordMessage, [ + { text: shared.tryAgain, - onPress: () => this.setState({ password: null }) - }] - ) + onPress: () => this.setState({ password: null }), + }, + ]) return } this.props.enableShowApp() @@ -116,10 +112,10 @@ const styles = StyleSheet.create({ contentContainer: { flex: 1, justifyContent: 'center', - marginHorizontal: Spacing.base + marginHorizontal: Spacing.base, }, containerButtons: { ...Containers.rowContainer, - justifyContent: 'space-around' - } + justifyContent: 'space-around', + }, }) diff --git a/components/settings/common/confirm-with-password.js b/components/settings/common/confirm-with-password.js index 2b0b970..6f518b2 100644 --- a/components/settings/common/confirm-with-password.js +++ b/components/settings/common/confirm-with-password.js @@ -27,22 +27,20 @@ export default class ConfirmWithPassword extends Component { this.setState({ password: null }) } - onIncorrectPassword = () => { - Alert.alert( - shared.incorrectPassword, - shared.incorrectPasswordMessage, - [{ + Alert.alert(shared.incorrectPassword, shared.incorrectPasswordMessage, [ + { text: shared.cancel, - onPress: this.props.onCancel - }, { + onPress: this.props.onCancel, + }, + { text: shared.tryAgain, - onPress: this.resetPasswordInput - }] - ) + onPress: this.resetPasswordInput, + }, + ]) } - checkPassword = async hash => { + checkPassword = async (hash) => { try { await openDb(hash) this.props.onSuccess() @@ -73,9 +71,7 @@ export default class ConfirmWithPassword extends Component { secureTextEntry={true} /> - +