toki/mattermost-mobile
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

PLT-5545 Fix Unread above/below indicator size to fit on screen (#256)

Browse source 
* Fix Unread above/below indicator size to fit on screen size

* removing unnecessary flex
This commit is contained in:
enahum 2017-02-16 11:29:57 -03:00 committed by Harrison Healey
parent 1319f1fcf8
commit 5a5772bcd0
2 changed files with 14 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

17
app/components/channel_list/channel_list.js
View file

@ -115,7 +115,7 @@ class ChannelList extends Component {
this.setState({
dataSource: this.state.dataSource.cloneWithRows(this.buildData(nextProps))
});
const container = this.refs.scrollContainer;
const container = this.scrollContainer;
if (container && container._visibleRows && container._visibleRows.s1) { //eslint-disable-line no-underscore-dangle
this.updateUnreadIndicators(container._visibleRows); //eslint-disable-line no-underscore-dangle
}
@ -167,6 +167,11 @@ class ChannelList extends Component {
this.props.actions.markChannelAsRead(channel.id, currentChannel.id);
};
onLayout = (event) => {
const {width} = event.nativeEvent.layout;
this.width = width;
};
handleClose = (channel) => {
this.setState({showOptions: false});
this.props.actions.closeDMChannel(channel);
@ -303,6 +308,7 @@ class ChannelList extends Component {
unreadCount = 0;
}
}
return {
mentions,
unreadCount
@ -469,7 +475,7 @@ class ChannelList extends Component {
if (this.state.showAbove) {
above = (
<UnreadIndicator
style={{top: 55, backgroundColor: theme.mentionBj}}
style={{top: 55, backgroundColor: theme.mentionBj, width: (this.width - 40)}}
text={(
<FormattedText
style={[Styles.indicatorText, {color: theme.mentionColor}]}
@ -484,7 +490,7 @@ class ChannelList extends Component {
if (this.state.showBelow) {
below = (
<UnreadIndicator
style={{bottom: 15, backgroundColor: theme.mentionBj}}
style={{bottom: 15, backgroundColor: theme.mentionBj, width: (this.width - 40)}}
text={(
<FormattedText
style={[Styles.indicatorText, {color: theme.mentionColor}]}
@ -497,7 +503,10 @@ class ChannelList extends Component {
}
return (
<View style={[Styles.container, {backgroundColor: theme.sidebarBg}]}>
<View
style={[Styles.container, {backgroundColor: theme.sidebarBg}]}
onLayout={this.onLayout}
>
<View style={[Styles.headerContainer, {backgroundColor: theme.sidebarHeaderBg}]}>
<Text
ellipsizeMode='tail'

3
app/components/channel_list/unread_indicator.js
View file

@ -12,8 +12,7 @@ const Styles = StyleSheet.create({
flexDirection: 'row',
position: 'absolute',
borderRadius: 15,
marginLeft: 25,
width: 250,
marginHorizontal: 15,
height: 25
}
});