diff options
| -rw-r--r-- | webapp/components/channel_view.jsx | 4 | ||||
| -rw-r--r-- | webapp/components/post_view/post_view_cache.jsx | 37 |
2 files changed, 32 insertions, 9 deletions
diff --git a/webapp/components/channel_view.jsx b/webapp/components/channel_view.jsx index ff101bca7..dfeeeca28 100644 --- a/webapp/components/channel_view.jsx +++ b/webapp/components/channel_view.jsx @@ -70,7 +70,9 @@ export default class ChannelView extends React.Component { <ChannelHeader channelId={this.state.channelId} /> - <PostViewCache/> + <PostViewCache + channelId={this.state.channelId} + /> <div className='post-create__container' id='post-create' diff --git a/webapp/components/post_view/post_view_cache.jsx b/webapp/components/post_view/post_view_cache.jsx index 7de11d667..9c3f1db1b 100644 --- a/webapp/components/post_view/post_view_cache.jsx +++ b/webapp/components/post_view/post_view_cache.jsx @@ -2,6 +2,7 @@ // See License.txt for license information import PostViewController from './post_view_controller.jsx'; +import LoadingScreen from 'components/loading_screen.jsx'; import ChannelStore from 'stores/channel_store.jsx'; import UserStore from 'stores/user_store.jsx'; @@ -67,25 +68,45 @@ export default class PostViewCache extends React.Component { }); } + shouldComponentUpdate(nextProps) { + return Boolean(nextProps.channelId); + } + render() { const channels = this.state.channels; const currentChannelId = this.state.currentChannelId; - + const valid = this.props.channelId === this.state.currentChannelId; const postViews = []; - for (let i = 0; i < channels.length; i++) { - postViews.push( - <PostViewController - key={'postviewcontroller_' + channels[i].id} - channel={channels[i]} - active={channels[i].id === currentChannelId} + let content; + + if (valid) { + for (let i = 0; i < channels.length; i++) { + postViews.push( + <PostViewController + key={'postviewcontroller_' + channels[i].id} + channel={channels[i]} + active={channels[i].id === currentChannelId} + /> + ); + } + content = postViews; + } else { + content = ( + <LoadingScreen + position='absolute' + key='loading' /> ); } return ( <div id='post-list'> - {postViews} + {content} </div> ); } } + +PostViewCache.propTypes = { + channelId: React.PropTypes.string.isRequired +}; |