mattermost-mobile/app/scenes/account_notifications/save_notifications_button.js
2017-04-10 11:33:35 -03:00

95 lines
2.4 KiB
JavaScript

// Copyright (c) 2017-present Mattermost, Inc. All Rights Reserved.
// See License.txt for license information.
import React, {PropTypes, PureComponent} from 'react';
import {connect} from 'react-redux';
import {
TouchableOpacity,
View
} from 'react-native';
import FormattedText from 'app/components/formatted_text';
import Loading from 'app/components/loading';
import {getTheme} from 'app/selectors/preferences';
import EventEmitter from 'mattermost-redux/utils/event_emitter';
class AccountNotifcationsButton extends PureComponent {
static propTypes = {
emitter: PropTypes.func.isRequired,
theme: PropTypes.object
};
static defaultProps = {
theme: {}
};
constructor(props) {
super(props);
this.state = {
loading: false
};
}
componentWillMount() {
EventEmitter.on('saving_notify_props', this.onLoading);
}
componentWillUnmount() {
EventEmitter.off('saving_notify_props', this.onLoading);
}
onLoading = (loading) => {
this.setState({loading});
};
onPress = () => {
this.props.emitter('save_notify_props');
};
render() {
const {theme} = this.props;
const {loading} = this.state;
const color = theme.sidebarHeaderTextColor;
if (loading) {
return (
<Loading
color={color}
size='small'
style={{
alignItems: 'center',
flex: 1,
flexDirection: 'column',
justifyContent: 'center',
paddingHorizontal: 20
}}
/>
);
}
return (
<View style={{flexDirection: 'column', justifyContent: 'center', alignItems: 'center', flex: 1}}>
<TouchableOpacity
onPress={this.onPress}
style={{paddingHorizontal: 15}}
>
<FormattedText
id='add_command.save'
defaultMessage='Save'
style={{color}}
/>
</TouchableOpacity>
</View>
);
}
}
function mapStateToProps(state) {
return {
theme: getTheme(state)
};
}
export default connect(mapStateToProps)(AccountNotifcationsButton);