From f2533bd650a6b0d45f5c357828519340d1f4d645 Mon Sep 17 00:00:00 2001 From: Harrison Healey Date: Wed, 27 Sep 2017 14:34:09 -0400 Subject: [PATCH] RN-349 Mark channel as read when switching teams and opening the app (#953) * RN-349 Mark current channel as read when opening the app * RN-349 Mark channels as read when switching teams * Moved markChannelAsRead into handleTeamChange action --- app/actions/views/select_team.js | 10 ++++++++-- app/components/channel_drawer/teams_list/index.js | 6 +----- .../channel_drawer/teams_list/teams_list.js | 11 ++--------- app/screens/channel/channel.js | 10 +++++++++- app/screens/channel/index.js | 5 ++++- 5 files changed, 24 insertions(+), 18 deletions(-) diff --git a/app/actions/views/select_team.js b/app/actions/views/select_team.js index 6b5089deb..00a71786b 100644 --- a/app/actions/views/select_team.js +++ b/app/actions/views/select_team.js @@ -3,8 +3,10 @@ import {batchActions} from 'redux-batched-actions'; +import {markChannelAsRead, viewChannel} from 'mattermost-redux/actions/channels'; import {ChannelTypes, TeamTypes} from 'mattermost-redux/action_types'; import EventEmitter from 'mattermost-redux/utils/event_emitter'; +import {getCurrentChannelId} from 'mattermost-redux/selectors/entities/channels'; import {NavigationTypes} from 'app/constants'; @@ -12,12 +14,12 @@ import {setChannelDisplayName} from './channel'; export function handleTeamChange(team, selectChannel = true) { return async (dispatch, getState) => { - const {currentTeamId} = getState().entities.teams; + const state = getState(); + const {currentTeamId} = state.entities.teams; if (currentTeamId === team.id) { return; } - const state = getState(); const actions = [ setChannelDisplayName(''), {type: TeamTypes.SELECT_TEAM, data: team.id} @@ -26,6 +28,10 @@ export function handleTeamChange(team, selectChannel = true) { if (selectChannel) { const lastChannelId = state.views.team.lastChannelForTeam[team.id] || ''; actions.push({type: ChannelTypes.SELECT_CHANNEL, data: lastChannelId}); + + const currentChannelId = getCurrentChannelId(state); + viewChannel(lastChannelId, currentChannelId)(dispatch, getState); + markChannelAsRead(lastChannelId, currentChannelId)(dispatch, getState); } dispatch(batchActions(actions), getState); diff --git a/app/components/channel_drawer/teams_list/index.js b/app/components/channel_drawer/teams_list/index.js index 890cff28d..018f55f16 100644 --- a/app/components/channel_drawer/teams_list/index.js +++ b/app/components/channel_drawer/teams_list/index.js @@ -4,8 +4,6 @@ import {bindActionCreators} from 'redux'; import {connect} from 'react-redux'; -import {markChannelAsRead} from 'mattermost-redux/actions/channels'; -import {getCurrentChannelId} from 'mattermost-redux/selectors/entities/channels'; import {getCurrentUrl} from 'mattermost-redux/selectors/entities/general'; import {getCurrentTeamId, getJoinableTeams, getMyTeams, getTeamMemberships} from 'mattermost-redux/selectors/entities/teams'; import {getCurrentUser} from 'mattermost-redux/selectors/entities/users'; @@ -30,7 +28,6 @@ function mapStateToProps(state, ownProps) { return { canCreateTeams: false, joinableTeams: getJoinableTeams(state), - currentChannelId: getCurrentChannelId(state), currentTeamId: getCurrentTeamId(state), currentUrl: removeProtocol(getCurrentUrl(state)), teams: getMyTeams(state).sort(sortTeams.bind(null, (user.locale))), @@ -43,8 +40,7 @@ function mapStateToProps(state, ownProps) { function mapDispatchToProps(dispatch) { return { actions: bindActionCreators({ - handleTeamChange, - markChannelAsRead + handleTeamChange }, dispatch) }; } diff --git a/app/components/channel_drawer/teams_list/teams_list.js b/app/components/channel_drawer/teams_list/teams_list.js index 8a8ab233d..ad4b80e61 100644 --- a/app/components/channel_drawer/teams_list/teams_list.js +++ b/app/components/channel_drawer/teams_list/teams_list.js @@ -4,7 +4,6 @@ import React, {PureComponent} from 'react'; import PropTypes from 'prop-types'; import { - InteractionManager, FlatList, Platform, Text, @@ -23,12 +22,10 @@ import {changeOpacity, makeStyleSheetFromTheme} from 'app/utils/theme'; class TeamsList extends PureComponent { static propTypes = { actions: PropTypes.shape({ - handleTeamChange: PropTypes.func.isRequired, - markChannelAsRead: PropTypes.func.isRequired + handleTeamChange: PropTypes.func.isRequired }).isRequired, canCreateTeams: PropTypes.bool.isRequired, closeChannelDrawer: PropTypes.func.isRequired, - currentChannelId: PropTypes.string, currentTeamId: PropTypes.string.isRequired, currentUrl: PropTypes.string.isRequired, intl: intlShape.isRequired, @@ -48,17 +45,13 @@ class TeamsList extends PureComponent { } selectTeam = (team) => { - const {actions, closeChannelDrawer, currentChannelId, currentTeamId} = this.props; + const {actions, closeChannelDrawer, currentTeamId} = this.props; if (team.id === currentTeamId) { closeChannelDrawer(); } else { actions.handleTeamChange(team); closeChannelDrawer(); - - InteractionManager.runAfterInteractions(() => { - actions.markChannelAsRead(currentChannelId); - }); } }; diff --git a/app/screens/channel/channel.js b/app/screens/channel/channel.js index f21850477..b67dbd5f6 100644 --- a/app/screens/channel/channel.js +++ b/app/screens/channel/channel.js @@ -34,12 +34,14 @@ class Channel extends PureComponent { connection: PropTypes.func.isRequired, loadChannelsIfNecessary: PropTypes.func.isRequired, loadProfilesAndTeamMembersForDMSidebar: PropTypes.func.isRequired, + markChannelAsRead: PropTypes.func.isRequired, selectFirstAvailableTeam: PropTypes.func.isRequired, selectInitialChannel: PropTypes.func.isRequired, initWebSocket: PropTypes.func.isRequired, closeWebSocket: PropTypes.func.isRequired, startPeriodicStatusUpdates: PropTypes.func.isRequired, - stopPeriodicStatusUpdates: PropTypes.func.isRequired + stopPeriodicStatusUpdates: PropTypes.func.isRequired, + viewChannel: PropTypes.func.isRequired }).isRequired, intl: intlShape.isRequired, navigator: PropTypes.object, @@ -69,6 +71,12 @@ class Channel extends PureComponent { } catch (error) { // We don't care about the error } + + // Mark current channel as read when opening app while logged in + if (this.props.currentChannelId) { + this.props.actions.markChannelAsRead(this.props.currentChannelId); + this.props.actions.viewChannel(this.props.currentChannelId); + } } componentWillReceiveProps(nextProps) { diff --git a/app/screens/channel/index.js b/app/screens/channel/index.js index 2b013ac24..c1489560b 100644 --- a/app/screens/channel/index.js +++ b/app/screens/channel/index.js @@ -14,6 +14,7 @@ import {selectFirstAvailableTeam} from 'app/actions/views/select_team'; import {getStatusBarHeight} from 'app/selectors/device'; import {getTheme} from 'app/selectors/preferences'; +import {viewChannel, markChannelAsRead} from 'mattermost-redux/actions/channels'; import {startPeriodicStatusUpdates, stopPeriodicStatusUpdates} from 'mattermost-redux/actions/users'; import {getCurrentChannelId} from 'mattermost-redux/selectors/entities/channels'; import {getCurrentTeamId} from 'mattermost-redux/selectors/entities/teams'; @@ -46,12 +47,14 @@ function mapDispatchToProps(dispatch) { connection, loadChannelsIfNecessary, loadProfilesAndTeamMembersForDMSidebar, + markChannelAsRead, selectFirstAvailableTeam, selectInitialChannel, initWebSocket, closeWebSocket, startPeriodicStatusUpdates, - stopPeriodicStatusUpdates + stopPeriodicStatusUpdates, + viewChannel }, dispatch) }; }