diff --git a/components/common/app-switch.js b/components/common/app-switch.js index 2333c0c..ce835a6 100644 --- a/components/common/app-switch.js +++ b/components/common/app-switch.js @@ -6,13 +6,18 @@ import AppText from './app-text' import { Containers } from '../../styles' -const AppSwitch = ({ onToggle, text, value }) => { +const AppSwitch = ({ onToggle, text, value, trackColor }) => { return ( {text} - + ) } @@ -21,6 +26,7 @@ AppSwitch.propTypes = { onToggle: PropTypes.func.isRequired, text: PropTypes.string, value: PropTypes.bool, + trackColor: PropTypes.string, } const styles = StyleSheet.create({ diff --git a/components/settings/customization/index.js b/components/settings/customization/index.js index bf83580..e700518 100644 --- a/components/settings/customization/index.js +++ b/components/settings/customization/index.js @@ -1,7 +1,5 @@ import React, { useState } from 'react' -import { Platform, StyleSheet, View } from 'react-native' -import AppIcon from '../../common/app-icon' import AppPage from '../../common/app-page' import AppSwitch from '../../common/app-switch' import AppText from '../../common/app-text' @@ -9,7 +7,7 @@ import TemperatureSlider from './temperature-slider' import Segment from '../../common/segment' import { useCervixObservable, saveUseCervix } from '../../../local-storage' -import { Colors, Spacing, Typography } from '../../../styles' +import { Colors } from '../../../styles' import labels from '../../../i18n/en/settings' const Settings = () => { @@ -17,6 +15,9 @@ const Settings = () => { useCervixObservable.value ) + const [isEnabled, setIsEnabled] = useState(false) + const toggleSwitch = () => setIsEnabled((previousState) => !previousState) + const onCervixToggle = (value) => { setShouldUseCervix(value) saveUseCervix(value) @@ -27,47 +28,93 @@ const Settings = () => { : labels.useCervix.cervixModeOff return ( - + + + + + + + + + + + + + + + + + + {labels.tempScale.segmentExplainer} + + + - {/* for iOS disabled temporarily, TODO https://gitlab.com/bloodyhealth/drip/-/issues/545 */} - {Platform.OS !== 'ios' && ( - - {labels.tempScale.segmentExplainer} - - - )} - - - - {labels.preOvu.title} - - {labels.preOvu.note} + + + ) } export default Settings - -const styles = StyleSheet.create({ - icon: { - marginRight: Spacing.base, - }, - line: { - flexDirection: 'row', - alignItems: 'center', - }, - title: { - ...Typography.subtitle, - }, -})