-
Notifications
You must be signed in to change notification settings - Fork 2.9k
/
TimezoneInitialPage.js
77 lines (70 loc) · 3.4 KB
/
TimezoneInitialPage.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
import lodashGet from 'lodash/get';
import React from 'react';
import {View} from 'react-native';
import withCurrentUserPersonalDetails, {withCurrentUserPersonalDetailsPropTypes, withCurrentUserPersonalDetailsDefaultProps} from '../../../components/withCurrentUserPersonalDetails';
import ScreenWrapper from '../../../components/ScreenWrapper';
import HeaderWithBackButton from '../../../components/HeaderWithBackButton';
import withLocalize, {withLocalizePropTypes} from '../../../components/withLocalize';
import ROUTES from '../../../ROUTES';
import CONST from '../../../CONST';
import Text from '../../../components/Text';
import styles from '../../../styles/styles';
import Navigation from '../../../libs/Navigation/Navigation';
import * as PersonalDetails from '../../../libs/actions/PersonalDetails';
import compose from '../../../libs/compose';
import Switch from '../../../components/Switch';
import MenuItemWithTopDescription from '../../../components/MenuItemWithTopDescription';
const propTypes = {
...withLocalizePropTypes,
...withCurrentUserPersonalDetailsPropTypes,
};
const defaultProps = {
...withCurrentUserPersonalDetailsDefaultProps,
};
function TimezoneInitialPage(props) {
const timezone = lodashGet(props.currentUserPersonalDetails, 'timezone', CONST.DEFAULT_TIME_ZONE);
/**
* Updates setting for automatic timezone selection.
* Note: If we are updating automatically, we'll immediately calculate the user's timezone.
*
* @param {Boolean} isAutomatic
*/
const updateAutomaticTimezone = (isAutomatic) => {
PersonalDetails.updateAutomaticTimezone({
automatic: isAutomatic,
selected: isAutomatic ? Intl.DateTimeFormat().resolvedOptions().timeZone : timezone.selected,
});
};
return (
<ScreenWrapper testID={TimezoneInitialPage.displayName}>
<HeaderWithBackButton
title={props.translate('timezonePage.timezone')}
onBackButtonPress={() => Navigation.goBack(ROUTES.SETTINGS_PROFILE)}
/>
<View style={styles.flex1}>
<View style={[styles.ph5]}>
<Text style={[styles.mb5]}>{props.translate('timezonePage.isShownOnProfile')}</Text>
<View style={[styles.flexRow, styles.mb5, styles.mr2, styles.alignItemsCenter, styles.justifyContentBetween]}>
<Text>{props.translate('timezonePage.getLocationAutomatically')}</Text>
<Switch
accessibilityLabel={props.translate('timezonePage.getLocationAutomatically')}
isOn={timezone.automatic}
onToggle={updateAutomaticTimezone}
/>
</View>
</View>
<MenuItemWithTopDescription
title={timezone.selected}
description={props.translate('timezonePage.timezone')}
shouldShowRightIcon
disabled={timezone.automatic}
onPress={() => Navigation.navigate(ROUTES.SETTINGS_TIMEZONE_SELECT)}
/>
</View>
</ScreenWrapper>
);
}
TimezoneInitialPage.propTypes = propTypes;
TimezoneInitialPage.defaultProps = defaultProps;
TimezoneInitialPage.displayName = 'TimezoneInitialPage';
export default compose(withLocalize, withCurrentUserPersonalDetails)(TimezoneInitialPage);