[MM-16138] Update settings related screens (#2918)
* Update screens * Update login tests * Remove done * Fix failing tests * Update screens and components * Check styles fix * Update tests * Prevent setState call after component unmounts * Add empty setButtons func to dummy navigator * Remove platform check * Remove Platform import * Update react-native-navigation version * Add separate showModalOverCurrentContext function * check-style fixes * Remove overriding of AppDelegate's window * Fix modal over current context animation * Add showSearchModal navigation action * Check-style fix * Address review comments * Update SettingsSidebar and children * Update EditProfile screen * Update SettingsSidebar * Keep track of latest componentId to appear * Track componentId in state to use in navigation actions * Update FlaggedPosts and children * Update RecentMentions * Update Settings * Store componentIds in ephemeral store * Update AttachmentButton * Remove unnecessary dismissModal * Fix typo * Upate NotificationSettings * Update NotificationSettingsAutoResponder * Update NotificationSettingsMentions * Update NotificationSettingsMobile * Update CreateChannel and children * Update MoreChannels * Update ChannelPeek and children * Update ChannelNavBar and children * Update ChannelPostList and children * Update ChannelInfo and children * Update ChannelAddMembers * Update ChannelMembers * Update EditChannel * Fix setting of top bar buttons * Update Channel screen and children * Update PinnedPosts * Update LongPost * Update PostOptions * Update PostTextboxBase * Update EditPost * Check-styles fix * Update DisplaySettings * Update Timezone * Update SelectTimezone * Remove navigationComponentId
This commit is contained in:
parent
c278614ca1
commit
30375aa4a2
7 changed files with 57 additions and 67 deletions
|
|
@ -18,8 +18,10 @@ import ClockDisplay from 'app/screens/clock_display';
|
|||
|
||||
export default class DisplaySettings extends PureComponent {
|
||||
static propTypes = {
|
||||
actions: PropTypes.shape({
|
||||
goToScreen: PropTypes.func.isRequired,
|
||||
}).isRequired,
|
||||
componentId: PropTypes.string,
|
||||
navigator: PropTypes.object.isRequired,
|
||||
theme: PropTypes.object.isRequired,
|
||||
enableTheme: PropTypes.bool.isRequired,
|
||||
enableTimezone: PropTypes.bool.isRequired,
|
||||
|
|
@ -38,22 +40,13 @@ export default class DisplaySettings extends PureComponent {
|
|||
};
|
||||
|
||||
goToClockDisplaySettings = preventDoubleTap(() => {
|
||||
const {navigator, theme} = this.props;
|
||||
const {actions} = this.props;
|
||||
const {intl} = this.context;
|
||||
|
||||
if (Platform.OS === 'ios') {
|
||||
navigator.push({
|
||||
screen: 'ClockDisplay',
|
||||
title: intl.formatMessage({id: 'user.settings.display.clockDisplay', defaultMessage: 'Clock Display'}),
|
||||
animated: true,
|
||||
backButtonTitle: '',
|
||||
navigatorStyle: {
|
||||
navBarTextColor: theme.sidebarHeaderTextColor,
|
||||
navBarBackgroundColor: theme.sidebarHeaderBg,
|
||||
navBarButtonColor: theme.sidebarHeaderTextColor,
|
||||
screenBackgroundColor: theme.centerChannelBg,
|
||||
},
|
||||
});
|
||||
const screen = 'ClockDisplay';
|
||||
const title = intl.formatMessage({id: 'user.settings.display.clockDisplay', defaultMessage: 'Clock Display'});
|
||||
actions.goToScreen(screen, title);
|
||||
return;
|
||||
}
|
||||
|
||||
|
|
@ -61,39 +54,21 @@ export default class DisplaySettings extends PureComponent {
|
|||
});
|
||||
|
||||
goToTimezoneSettings = preventDoubleTap(() => {
|
||||
const {navigator, theme} = this.props;
|
||||
const {actions} = this.props;
|
||||
const {intl} = this.context;
|
||||
const screen = 'TimezoneSettings';
|
||||
const title = intl.formatMessage({id: 'mobile.advanced_settings.timezone', defaultMessage: 'Timezone'});
|
||||
|
||||
navigator.push({
|
||||
screen: 'TimezoneSettings',
|
||||
title: intl.formatMessage({id: 'mobile.advanced_settings.timezone', defaultMessage: 'Timezone'}),
|
||||
animated: true,
|
||||
backButtonTitle: '',
|
||||
navigatorStyle: {
|
||||
navBarTextColor: theme.sidebarHeaderTextColor,
|
||||
navBarBackgroundColor: theme.sidebarHeaderBg,
|
||||
navBarButtonColor: theme.sidebarHeaderTextColor,
|
||||
screenBackgroundColor: theme.centerChannelBg,
|
||||
},
|
||||
});
|
||||
actions.goToScreen(screen, title);
|
||||
});
|
||||
|
||||
goToThemeSettings = preventDoubleTap(() => {
|
||||
const {navigator, theme} = this.props;
|
||||
const {actions} = this.props;
|
||||
const {intl} = this.context;
|
||||
const screen = 'ThemeSettings';
|
||||
const title = intl.formatMessage({id: 'mobile.display_settings.theme', defaultMessage: 'Theme'});
|
||||
|
||||
navigator.push({
|
||||
screen: 'ThemeSettings',
|
||||
title: intl.formatMessage({id: 'mobile.display_settings.theme', defaultMessage: 'Theme'}),
|
||||
animated: true,
|
||||
backButtonTitle: '',
|
||||
navigatorStyle: {
|
||||
navBarTextColor: theme.sidebarHeaderTextColor,
|
||||
navBarBackgroundColor: theme.sidebarHeaderBg,
|
||||
navBarButtonColor: theme.sidebarHeaderTextColor,
|
||||
screenBackgroundColor: theme.centerChannelBg,
|
||||
},
|
||||
});
|
||||
actions.goToScreen(screen, title);
|
||||
});
|
||||
|
||||
render() {
|
||||
|
|
|
|||
|
|
@ -12,12 +12,12 @@ jest.mock('react-intl');
|
|||
|
||||
describe('DisplaySettings', () => {
|
||||
const baseProps = {
|
||||
actions: {
|
||||
goToScreen: jest.fn(),
|
||||
},
|
||||
theme: Preferences.THEMES.default,
|
||||
enableTheme: false,
|
||||
enableTimezone: false,
|
||||
navigator: {
|
||||
push: jest.fn(),
|
||||
},
|
||||
componentId: 'component-id',
|
||||
};
|
||||
|
||||
|
|
|
|||
|
|
@ -1,15 +1,17 @@
|
|||
// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
|
||||
// See LICENSE.txt for license information.
|
||||
|
||||
import {bindActionCreators} from 'redux';
|
||||
import {connect} from 'react-redux';
|
||||
|
||||
import {getTheme} from 'mattermost-redux/selectors/entities/preferences';
|
||||
import {isTimezoneEnabled} from 'mattermost-redux/selectors/entities/timezone';
|
||||
|
||||
import {goToScreen} from 'app/actions/navigation';
|
||||
import {getAllowedThemes} from 'app/selectors/theme';
|
||||
import {isThemeSwitchingEnabled} from 'app/utils/theme';
|
||||
|
||||
import DisplaySettings from './display_settings';
|
||||
import {getAllowedThemes} from 'app/selectors/theme';
|
||||
|
||||
function mapStateToProps(state) {
|
||||
const enableTimezone = isTimezoneEnabled(state);
|
||||
|
|
@ -22,4 +24,12 @@ function mapStateToProps(state) {
|
|||
};
|
||||
}
|
||||
|
||||
export default connect(mapStateToProps)(DisplaySettings);
|
||||
function mapDispatchToProps(dispatch) {
|
||||
return {
|
||||
actions: bindActionCreators({
|
||||
goToScreen,
|
||||
}, dispatch),
|
||||
};
|
||||
}
|
||||
|
||||
export default connect(mapStateToProps, mapDispatchToProps)(DisplaySettings);
|
||||
|
|
|
|||
|
|
@ -10,6 +10,7 @@ import {getTheme} from 'mattermost-redux/selectors/entities/preferences';
|
|||
import {getUserTimezone} from 'mattermost-redux/selectors/entities/timezone';
|
||||
import {getCurrentUser} from 'mattermost-redux/selectors/entities/users';
|
||||
|
||||
import {goToScreen} from 'app/actions/navigation';
|
||||
import {updateUser} from 'app/actions/views/edit_profile';
|
||||
|
||||
import Timezone from './timezone';
|
||||
|
|
@ -32,6 +33,7 @@ function mapDispatchToProps(dispatch) {
|
|||
actions: bindActionCreators({
|
||||
getSupportedTimezones,
|
||||
updateUser,
|
||||
goToScreen,
|
||||
}, dispatch),
|
||||
};
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,11 +1,14 @@
|
|||
// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
|
||||
// See LICENSE.txt for license information.
|
||||
|
||||
import {bindActionCreators} from 'redux';
|
||||
import {connect} from 'react-redux';
|
||||
|
||||
import {getTheme} from 'mattermost-redux/selectors/entities/preferences';
|
||||
import {getSupportedTimezones} from 'mattermost-redux/selectors/entities/general';
|
||||
|
||||
import {popTopScreen} from 'app/actions/navigation';
|
||||
|
||||
import SelectTimezone from './select_timezone';
|
||||
|
||||
function mapStateToProps(state, props) {
|
||||
|
|
@ -26,4 +29,12 @@ function mapStateToProps(state, props) {
|
|||
};
|
||||
}
|
||||
|
||||
export default connect(mapStateToProps)(SelectTimezone);
|
||||
function mapDispatchToProps(dispatch) {
|
||||
return {
|
||||
actions: bindActionCreators({
|
||||
popTopScreen,
|
||||
}, dispatch),
|
||||
};
|
||||
}
|
||||
|
||||
export default connect(mapStateToProps, mapDispatchToProps)(SelectTimezone);
|
||||
|
|
|
|||
|
|
@ -23,10 +23,12 @@ const VIEWABILITY_CONFIG = ListTypes.VISIBILITY_CONFIG_DEFAULTS;
|
|||
|
||||
export default class Timezone extends PureComponent {
|
||||
static propTypes = {
|
||||
actions: PropTypes.shape({
|
||||
popTopScreen: PropTypes.func.isRequired,
|
||||
}).isRequired,
|
||||
selectedTimezone: PropTypes.string.isRequired,
|
||||
initialScrollIndex: PropTypes.number.isRequired,
|
||||
timezones: PropTypes.array.isRequired,
|
||||
navigator: PropTypes.object,
|
||||
onBack: PropTypes.func.isRequired,
|
||||
theme: PropTypes.object.isRequired,
|
||||
};
|
||||
|
|
@ -59,7 +61,7 @@ export default class Timezone extends PureComponent {
|
|||
|
||||
timezoneSelected = (timezone) => {
|
||||
this.props.onBack(timezone);
|
||||
this.props.navigator.pop();
|
||||
this.props.actions.popTopScreen();
|
||||
};
|
||||
|
||||
handleTextChanged = (value) => {
|
||||
|
|
|
|||
|
|
@ -21,7 +21,6 @@ import {getDeviceTimezone} from 'app/utils/timezone';
|
|||
|
||||
export default class Timezone extends PureComponent {
|
||||
static propTypes = {
|
||||
navigator: PropTypes.object.isRequired,
|
||||
theme: PropTypes.object.isRequired,
|
||||
timezones: PropTypes.array.isRequired,
|
||||
user: PropTypes.object.isRequired,
|
||||
|
|
@ -116,29 +115,20 @@ export default class Timezone extends PureComponent {
|
|||
|
||||
goToSelectTimezone = () => {
|
||||
const {
|
||||
actions,
|
||||
userTimezone: {manualTimezone},
|
||||
navigator,
|
||||
theme,
|
||||
} = this.props;
|
||||
const {intl} = this.context;
|
||||
const screen = 'SelectTimezone';
|
||||
const title = intl.formatMessage({id: 'mobile.timezone_settings.select', defaultMessage: 'Select Timezone'});
|
||||
const passProps = {
|
||||
selectedTimezone: manualTimezone,
|
||||
onBack: this.updateManualTimezone,
|
||||
};
|
||||
|
||||
this.goingBack = false;
|
||||
|
||||
navigator.push({
|
||||
backButtonTitle: '',
|
||||
screen: 'SelectTimezone',
|
||||
title: intl.formatMessage({id: 'mobile.timezone_settings.select', defaultMessage: 'Select Timezone'}),
|
||||
animated: true,
|
||||
navigatorStyle: {
|
||||
navBarTextColor: theme.sidebarHeaderTextColor,
|
||||
navBarBackgroundColor: theme.sidebarHeaderBg,
|
||||
navBarButtonColor: theme.sidebarHeaderTextColor,
|
||||
screenBackgroundColor: theme.centerChannelBg,
|
||||
},
|
||||
passProps: {
|
||||
selectedTimezone: manualTimezone,
|
||||
onBack: this.updateManualTimezone,
|
||||
},
|
||||
});
|
||||
actions.goToScreen(screen, title, passProps);
|
||||
};
|
||||
|
||||
render() {
|
||||
|
|
|
|||
Loading…
Reference in a new issue