vn-verdnaturachat/app/views/RoomsListView/Header/Header.ios.js

90 lines
2.1 KiB
JavaScript
Raw Normal View History

import React from 'react';
import {
Text, View, TouchableOpacity, Image, StyleSheet
} from 'react-native';
import PropTypes from 'prop-types';
import I18n from '../../../i18n';
2019-03-29 19:36:07 +00:00
import sharedStyles from '../../Styles';
2019-12-04 16:39:53 +00:00
import { themes } from '../../../constants/colors';
const styles = StyleSheet.create({
container: {
flex: 1,
alignItems: 'center',
justifyContent: 'center'
},
button: {
flexDirection: 'row'
},
title: {
fontSize: 14,
2019-03-29 19:36:07 +00:00
...sharedStyles.textRegular
},
server: {
fontSize: 12,
2019-03-29 19:36:07 +00:00
...sharedStyles.textRegular
},
disclosure: {
marginLeft: 3,
marginTop: 1,
width: 12,
height: 9
},
upsideDown: {
transform: [{ scaleY: -1 }],
marginTop: 4
}
});
2019-12-04 16:39:53 +00:00
const HeaderTitle = React.memo(({ connecting, isFetching, theme }) => {
let title = I18n.t('Messages');
if (connecting) {
title = I18n.t('Connecting');
}
if (isFetching) {
title = I18n.t('Updating');
}
2019-12-04 16:39:53 +00:00
return <Text style={[styles.title, { color: themes[theme].headerTitleColor }]}>{title}</Text>;
});
const Header = React.memo(({
2019-12-04 16:39:53 +00:00
connecting, isFetching, serverName, showServerDropdown, onPress, theme
}) => (
<View style={styles.container}>
<TouchableOpacity
onPress={onPress}
testID='rooms-list-header-server-dropdown-button'
style={styles.container}
// disabled={connecting || isFetching}
>
2019-12-04 16:39:53 +00:00
<HeaderTitle connecting={connecting} isFetching={isFetching} theme={theme} />
<View style={styles.button}>
<Text style={[styles.server, { color: themes[theme].headerTintColor }]} numberOfLines={1}>{serverName}</Text>
<Image style={[styles.disclosure, showServerDropdown && styles.upsideDown]} source={{ uri: 'disclosure_indicator_server' }} />
</View>
</TouchableOpacity>
</View>
));
Header.propTypes = {
connecting: PropTypes.bool,
isFetching: PropTypes.bool,
serverName: PropTypes.string,
2019-12-04 16:39:53 +00:00
theme: PropTypes.string,
showServerDropdown: PropTypes.bool.isRequired,
onPress: PropTypes.func.isRequired
};
Header.defaultProps = {
serverName: 'Rocket.Chat'
};
HeaderTitle.propTypes = {
connecting: PropTypes.bool,
2019-12-04 16:39:53 +00:00
isFetching: PropTypes.bool,
theme: PropTypes.string
};
export default Header;