diff --git a/src/components/voting/voting.js b/src/components/voting/voting.js
index 7ee49ac89..6c6c9ebe6 100644
--- a/src/components/voting/voting.js
+++ b/src/components/voting/voting.js
@@ -169,8 +169,8 @@ class Voting extends React.Component {
Uptime
Approval
- {this.state.delegates.map((item, idx) => (
-
+ {this.state.delegates.map(item => (
+
))}
diff --git a/src/components/voting/votingRow.js b/src/components/voting/votingRow.js
index e2939888d..5d504fe30 100644
--- a/src/components/voting/votingRow.js
+++ b/src/components/voting/votingRow.js
@@ -12,9 +12,16 @@ const setRowClass = ({ pending, selected, voted }) => {
return voted ? styles.downVoteRow : '';
};
-const VotingRow = (props) => {
- const { data } = props;
- return (
+class VotingRow extends React.Component {
+ // eslint-disable-next-line class-methods-use-this
+ shouldComponentUpdate(nextProps) {
+ return !!nextProps.data.dirty;
+ }
+
+ render() {
+ const props = this.props;
+ const { data } = props;
+ return (
{
{data.productivity} %
{data.approval} %
- );
-};
+ );
+ }
+}
export default VotingRow;
diff --git a/src/components/voting/votingRow.test.js b/src/components/voting/votingRow.test.js
index bef85ba6c..aaa4e0175 100644
--- a/src/components/voting/votingRow.test.js
+++ b/src/components/voting/votingRow.test.js
@@ -9,7 +9,7 @@ describe('VotinRow', () => {
let wrapper;
beforeEach(() => {
- wrapper = mount(,
+ wrapper = mount(,
{
context: { store },
childContextTypes: { store: PropTypes.object.isRequired },
@@ -19,40 +19,40 @@ describe('VotinRow', () => {
it('should TableRow has class name of "pendingRow" when props.data.pending is true', () => {
wrapper.setProps({
- data: { pending: true },
+ data: { pending: true, dirty: true },
});
- const expectedClass = /_pendingRow/g;
- const html = wrapper.find('tr').html();
- expect(html.match(expectedClass)).to.have.lengthOf(1);
+ const expectedClass = '_pendingRow';
+ const className = wrapper.find('tr').prop('className');
+ expect(className).to.contain(expectedClass);
});
it(`should TableRow has class name of "votedRow" when props.data.selected
and props.data.voted are true`, () => {
wrapper.setProps({
- data: { selected: true, voted: true },
+ data: { selected: true, voted: true, dirty: true },
});
- const expectedClass = /_votedRow/g;
- const html = wrapper.find('tr').html();
- expect(html.match(expectedClass)).to.have.lengthOf(1);
+ const expectedClass = '_votedRow';
+ const className = wrapper.find('tr').prop('className');
+ expect(className).to.contain(expectedClass);
});
it(`should TableRow has class name of "downVoteRow" when props.data.selected
is false and props.data.voted is true`, () => {
wrapper.setProps({
- data: { selected: false, voted: true },
+ data: { selected: false, voted: true, dirty: true },
});
- const expectedClass = /_downVoteRow/g;
- const html = wrapper.find('tr').html();
- expect(html.match(expectedClass)).to.have.lengthOf(1);
+ const expectedClass = '_downVoteRow';
+ const className = wrapper.find('tr').prop('className');
+ expect(className).to.contain(expectedClass);
});
it(`should TableRow has class name of "upVoteRow" when props.data.selected
is true and props.data.voted is false`, () => {
wrapper.setProps({
- data: { selected: true, voted: false },
+ data: { selected: true, voted: false, dirty: true },
});
- const expectedClass = /_upVoteRow/g;
- const html = wrapper.find('tr').html();
- expect(html.match(expectedClass)).to.have.lengthOf(1);
+ const expectedClass = '_upVoteRow';
+ const className = wrapper.find('tr').prop('className');
+ expect(className).to.contain(expectedClass);
});
});
diff --git a/src/store/reducers/voting.js b/src/store/reducers/voting.js
index 7469e1b75..4894e6e8f 100644
--- a/src/store/reducers/voting.js
+++ b/src/store/reducers/voting.js
@@ -47,7 +47,7 @@ const voting = (state = { votedList: [], unvotedList: [] }, action) => {
refresh: false,
votedList: [
...state.votedList,
- Object.assign(action.data, { selected: true }),
+ Object.assign(action.data, { selected: true, dirty: true }),
],
});
case actionTypes.removedFromVoteList:
@@ -64,11 +64,16 @@ const voting = (state = { votedList: [], unvotedList: [] }, action) => {
refresh: false,
unvotedList: [
...state.unvotedList,
- Object.assign(action.data, { selected: false }),
+ Object.assign(action.data, { selected: false, dirty: true }),
],
});
- case actionTypes.votesCleared:
case actionTypes.accountLoggedOut:
+ return Object.assign({}, state, {
+ votedList: [],
+ unvotedList: [],
+ refresh: true,
+ });
+ case actionTypes.votesCleared:
return Object.assign({}, state, {
votedList: state.votedList.filter(item => !item.pending),
unvotedList: state.unvotedList.filter(item => !item.pending),