PLT-6015 RN grey vertical line on left of replies is sometimes too short (#427)

This commit is contained in:
Chris Duarte 2017-03-29 19:53:48 -07:00 committed by enahum
parent 606bd13435
commit fce5acea46
7 changed files with 51 additions and 32 deletions

View file

@ -21,16 +21,18 @@ export function goToChannelView() {
dispatch({
type: ViewTypes.APPLICATION_INITIALIZED
}, getState);
}, 800); // modal close takes 400ms
}, 400);
} else {
dispatch({
type: NavigationTypes.NAVIGATION_RESET,
routes: [Routes.ChannelView]
}, getState);
dispatch({
type: ViewTypes.APPLICATION_INITIALIZED
}, getState);
setTimeout(() => {
dispatch({
type: ViewTypes.APPLICATION_INITIALIZED
}, getState);
}, 400);
}
};
}

View file

@ -54,7 +54,7 @@ export default class FileAttachmentList extends Component {
));
return (
<View>
<View style={{flex: 1}}>
{fileAttachments}
</View>
);

View file

@ -155,6 +155,10 @@ class Post extends PureComponent {
replyBarStyle.push(style.replyBarFirst);
}
if (this.props.isLastReply) {
replyBarStyle.push(style.replyBarLast);
}
return <View style={replyBarStyle}/>;
};
@ -226,22 +230,24 @@ class Post extends PureComponent {
if (Platform.OS === 'ios') {
messageContainer = (
<View style={{flex: 1}}>
<View style={style.messageContainerWithReplyBar}>
{replyBar && this.renderReplyBar(style)}
<OptionsContext
actions={actions}
ref='tooltip'
onPress={this.handlePress}
toggleSelected={this.toggleSelected}
>
{message}
{this.renderFileAttachments()}
</OptionsContext>
<View style={{flex: 1}}>
<OptionsContext
actions={actions}
ref='tooltip'
onPress={this.handlePress}
toggleSelected={this.toggleSelected}
>
{message}
{this.renderFileAttachments()}
</OptionsContext>
</View>
</View>
);
} else {
messageContainer = (
<View style={{flex: 1}}>
<View style={style.messageContainerWithReplyBar}>
{replyBar && this.renderReplyBar(style)}
<TouchableHighlight
onHideUnderlay={() => this.toggleSelected(false)}
@ -249,8 +255,9 @@ class Post extends PureComponent {
onPress={this.handlePress}
onShowUnderlay={() => this.toggleSelected(true)}
underlayColor='transparent'
style={{flex: 1}}
>
<View>
<View style={{flex: 1}}>
{message}
<OptionsContext
ref='bottomSheet'
@ -409,7 +416,7 @@ class Post extends PureComponent {
</View>
<View style={style.messageContainerWithReplyBar}>
{this.renderReplyBar(style)}
<View style={style.rightColumn}>
<View style={[style.rightColumn, (this.props.isLastReply && style.rightColumnPadding)]}>
<View style={style.postInfoContainer}>
<View style={{flexDirection: 'row', flex: 1}}>
{displayName}
@ -454,6 +461,9 @@ const getStyleSheet = makeStyleSheetFromTheme((theme) => {
flexDirection: 'column',
marginRight: 12
},
rightColumnPadding: {
paddingBottom: 3
},
postInfoContainer: {
alignItems: 'center',
flexDirection: 'row',
@ -473,22 +483,14 @@ const getStyleSheet = makeStyleSheetFromTheme((theme) => {
backgroundColor: theme.centerChannelColor,
opacity: 0.1,
marginRight: 10,
...Platform.select({
ios: {
width: 3,
flexBasis: 3
},
android: {
width: 6,
flexBasis: 6
}
})
width: 3,
flexBasis: 3
},
replyBarFirst: {
marginTop: 10
paddingTop: 10
},
replyBarLast: {
marginBottom: 10
paddingBottom: 10
},
displayName: {
color: theme.centerChannelColor,

View file

@ -2,7 +2,7 @@
// See License.txt for license information.
import {combineReducers} from 'redux';
import {ChannelTypes, FilesTypes} from 'mattermost-redux/constants';
import {ChannelTypes, FilesTypes, UsersTypes} from 'mattermost-redux/constants';
import {ViewTypes} from 'app/constants';
@ -128,6 +128,8 @@ function appInitializing(state = true, action) {
switch (action.type) {
case ViewTypes.APPLICATION_INITIALIZED:
return false;
case UsersTypes.RESET_LOGOUT_STATE:
return true;
default:
return state;
}

View file

@ -20,6 +20,7 @@ import EventEmitter from 'mattermost-redux/utils/event_emitter';
class ChannelDrawerButton extends PureComponent {
static propTypes = {
applicationInitializing: PropTypes.bool.isRequired,
emitter: PropTypes.func.isRequired,
theme: PropTypes.object,
messageCount: PropTypes.number,
@ -68,6 +69,10 @@ class ChannelDrawerButton extends PureComponent {
};
render() {
if (this.props.applicationInitializing) {
return null;
}
let badge;
let badgeCount = this.props.mentionCount;
@ -146,6 +151,7 @@ const style = StyleSheet.create({
function mapStateToProps(state) {
return {
applicationInitializing: state.views.channel.appInitializing,
theme: getTheme(state),
...getUnreads(state)
};

View file

@ -14,6 +14,10 @@ import {getCurrentChannel} from 'mattermost-redux/selectors/entities/channels';
import {getTheme} from 'app/selectors/preferences';
function ChannelTitle(props) {
if (props.applicationInitializing) {
return null;
}
const channelName = props.currentChannel.display_name;
let icon;
if (channelName) {
@ -50,6 +54,7 @@ function ChannelTitle(props) {
}
ChannelTitle.propTypes = {
applicationInitializing: PropTypes.bool.isRequired,
currentChannel: PropTypes.object,
emitter: PropTypes.func.isRequired,
theme: PropTypes.object
@ -62,6 +67,7 @@ ChannelTitle.defaultProps = {
function mapStateToProps(state) {
return {
applicationInitializing: state.views.channel.appInitializing,
currentChannel: getCurrentChannel(state),
theme: getTheme(state)
};

View file

@ -25,7 +25,8 @@ export default class LoadTeam extends PureComponent {
};
static navigationProps = {
renderBackButton: () => null
renderBackButton: () => null,
renderTitleComponent: () => <View style={{flex: 1, backgroundColor: 'blue'}}/>
}
componentDidMount() {