From 46be4631ae046c45edc3cc8e01c8fc4144ff6444 Mon Sep 17 00:00:00 2001
From: Eugen Rochko <eugen@zeonfederated.com>
Date: Thu, 19 Jan 2017 10:54:18 +0100
Subject: [PATCH] Fix #222 - Update followers count when following/unfollowing
Also, since the root component connects to the stream that updates home/notification columns,
there is pretty much no case for refreshing those columns beyond initial load. So, move the
loading of those columns into the root component, to prevent unneccessary reloads when switching tabs
on mobile or resizing desktop window between mobile/desktop layouts
---
.../components/features/home_timeline/index.jsx | 9 +--------
.../components/features/notifications/index.jsx | 10 +---------
.../javascripts/components/features/ui/index.jsx | 9 +++++++--
.../javascripts/components/reducers/accounts.jsx | 8 +++++++-
4 files changed, 16 insertions(+), 20 deletions(-)
diff --git a/app/assets/javascripts/components/features/home_timeline/index.jsx b/app/assets/javascripts/components/features/home_timeline/index.jsx
index 8703d0b70e..5d2263f156 100644
--- a/app/assets/javascripts/components/features/home_timeline/index.jsx
+++ b/app/assets/javascripts/components/features/home_timeline/index.jsx
@@ -1,8 +1,6 @@
-import { connect } from 'react-redux';
import PureRenderMixin from 'react-addons-pure-render-mixin';
import StatusListContainer from '../ui/containers/status_list_container';
import Column from '../ui/components/column';
-import { refreshTimeline } from '../../actions/timelines';
import { defineMessages, injectIntl } from 'react-intl';
import ColumnSettingsContainer from './containers/column_settings_container';
@@ -13,16 +11,11 @@ const messages = defineMessages({
const HomeTimeline = React.createClass({
propTypes: {
- dispatch: React.PropTypes.func.isRequired,
intl: React.PropTypes.object.isRequired
},
mixins: [PureRenderMixin],
- componentWillMount () {
- this.props.dispatch(refreshTimeline('home'));
- },
-
render () {
const { intl } = this.props;
@@ -36,4 +29,4 @@ const HomeTimeline = React.createClass({
});
-export default connect()(injectIntl(HomeTimeline));
+export default injectIntl(HomeTimeline);
diff --git a/app/assets/javascripts/components/features/notifications/index.jsx b/app/assets/javascripts/components/features/notifications/index.jsx
index 29be491eb9..d243f178fa 100644
--- a/app/assets/javascripts/components/features/notifications/index.jsx
+++ b/app/assets/javascripts/components/features/notifications/index.jsx
@@ -2,10 +2,7 @@ import { connect } from 'react-redux';
import PureRenderMixin from 'react-addons-pure-render-mixin';
import ImmutablePropTypes from 'react-immutable-proptypes';
import Column from '../ui/components/column';
-import {
- refreshNotifications,
- expandNotifications
-} from '../../actions/notifications';
+import { expandNotifications } from '../../actions/notifications';
import NotificationContainer from './containers/notification_container';
import { ScrollContainer } from 'react-router-scroll';
import { defineMessages, injectIntl } from 'react-intl';
@@ -43,11 +40,6 @@ const Notifications = React.createClass({
mixins: [PureRenderMixin],
- componentWillMount () {
- const { dispatch } = this.props;
- dispatch(refreshNotifications());
- },
-
handleScroll (e) {
const { scrollTop, scrollHeight, clientHeight } = e.target;
diff --git a/app/assets/javascripts/components/features/ui/index.jsx b/app/assets/javascripts/components/features/ui/index.jsx
index ee2e29d6fe..003d061add 100644
--- a/app/assets/javascripts/components/features/ui/index.jsx
+++ b/app/assets/javascripts/components/features/ui/index.jsx
@@ -8,10 +8,12 @@ import Compose from '../compose';
import TabsBar from './components/tabs_bar';
import ModalContainer from './containers/modal_container';
import Notifications from '../notifications';
+import { connect } from 'react-redux';
+import { isMobile } from '../../is_mobile';
import { debounce } from 'react-decoration';
import { uploadCompose } from '../../actions/compose';
-import { connect } from 'react-redux';
-import { isMobile } from '../../is_mobile'
+import { refreshTimeline } from '../../actions/timelines';
+import { refreshNotifications } from '../../actions/notifications';
const UI = React.createClass({
@@ -56,6 +58,9 @@ const UI = React.createClass({
window.addEventListener('resize', this.handleResize, { passive: true });
window.addEventListener('dragover', this.handleDragOver);
window.addEventListener('drop', this.handleDrop);
+
+ this.props.dispatch(refreshTimeline('home'));
+ this.props.dispatch(refreshNotifications());
},
componentWillUnmount () {
diff --git a/app/assets/javascripts/components/reducers/accounts.jsx b/app/assets/javascripts/components/reducers/accounts.jsx
index 73dee90785..409dfd663d 100644
--- a/app/assets/javascripts/components/reducers/accounts.jsx
+++ b/app/assets/javascripts/components/reducers/accounts.jsx
@@ -6,7 +6,9 @@ import {
FOLLOWING_EXPAND_SUCCESS,
ACCOUNT_TIMELINE_FETCH_SUCCESS,
ACCOUNT_TIMELINE_EXPAND_SUCCESS,
- FOLLOW_REQUESTS_FETCH_SUCCESS
+ FOLLOW_REQUESTS_FETCH_SUCCESS,
+ ACCOUNT_FOLLOW_SUCCESS,
+ ACCOUNT_UNFOLLOW_SUCCESS
} from '../actions/accounts';
import { COMPOSE_SUGGESTIONS_READY } from '../actions/compose';
import {
@@ -105,6 +107,10 @@ export default function accounts(state = initialState, action) {
case TIMELINE_UPDATE:
case STATUS_FETCH_SUCCESS:
return normalizeAccountFromStatus(state, action.status);
+ case ACCOUNT_FOLLOW_SUCCESS:
+ return state.updateIn([action.relationship.id, 'followers_count'], num => num + 1);
+ case ACCOUNT_UNFOLLOW_SUCCESS:
+ return state.updateIn([action.relationship.id, 'followers_count'], num => Math.max(0, num - 1));
default:
return state;
}
--
GitLab