@@ -6,6 +6,7 @@ import _isEqual from 'lodash/isEqual'
66import _clone from 'lodash/clone'
77import _get from 'lodash/get'
88import _merge from 'lodash/merge'
9+ import _uniqueId from 'lodash/uniqueId'
910import queryString from 'query-string'
1011import { fetchLeaderboard , fetchLeaderboardForUser ,
1112 DEFAULT_LEADERBOARD_COUNT } from '../../../services/Leaderboard/Leaderboard'
@@ -22,15 +23,17 @@ const WithLeaderboard = function(WrappedComponent, initialMonthsPast=1, initialO
2223 leaderboard : null ,
2324 leaderboardLoading : false ,
2425 showingCount : DEFAULT_LEADERBOARD_COUNT ,
25- leaderboardOptions : initialOptions ,
26+ fetchId : - 1 ,
2627 }
2728
2829 /** merge the given userLeaderboard in with the main leaderboard */
2930 mergeInUserLeaderboard = userLeaderboard => {
3031 if ( userLeaderboard && userLeaderboard . length > 0 ) {
3132 const merged = _clone ( this . state . leaderboard )
32- merged . splice ( userLeaderboard [ 0 ] . rank - 1 , userLeaderboard . length , ...userLeaderboard )
33- this . setState ( { leaderboard : merged } )
33+ if ( merged ) {
34+ merged . splice ( userLeaderboard [ 0 ] . rank - 1 , userLeaderboard . length , ...userLeaderboard )
35+ this . setState ( { leaderboard : merged } )
36+ }
3437 }
3538 }
3639
@@ -41,8 +44,7 @@ const WithLeaderboard = function(WrappedComponent, initialMonthsPast=1, initialO
4144 [ 'forChallenges' , null ] ,
4245 [ 'forUsers' , null ] ,
4346 [ 'forCountries' , null ] ] )
44-
45- const leaderboardOptions = _merge ( this . state . leaderboardOptions , this . props . leaderboardOptions )
47+ const leaderboardOptions = _merge ( { } , initialOptions , this . props . leaderboardOptions )
4648 if ( leaderboardOptions ) {
4749 if ( _isBoolean ( leaderboardOptions . onlyEnabled ) ) {
4850 params . set ( 'onlyEnabled' , leaderboardOptions . onlyEnabled )
@@ -75,23 +77,29 @@ const WithLeaderboard = function(WrappedComponent, initialMonthsPast=1, initialO
7577
7678 // If we are filtering by challenges and no challenges are provided then
7779 // we don't need to go to the server.
78- const options = _merge ( this . state . leaderboardOptions , this . props . leaderboardOptions )
80+ const options = _merge ( { } , initialOptions , this . props . leaderboardOptions )
7981 if ( options . filterChallenges && _isArray ( this . props . challenges ) &&
8082 this . props . challenges . length < 1 ) {
8183 return
8284 }
8385
84- this . setState ( { leaderboardLoading : true , showingCount} )
86+ const currentFetch = _uniqueId ( )
87+ this . setState ( { leaderboardLoading : true , showingCount, fetchId : currentFetch } )
8588
8689 fetchLeaderboard ( ...this . leaderboardParams ( numberMonths , countryCode ) , showingCount ) . then ( leaderboard => {
87- this . setState ( { leaderboard} )
88-
89- const userId = _get ( this . props , 'user.id' )
90- if ( userId && ! this . state . leaderboardOptions . ignoreUser ) {
91- fetchLeaderboardForUser ( userId , 1 , ...this . leaderboardParams ( numberMonths , countryCode ) ) . then ( userLeaderboard => {
92- this . mergeInUserLeaderboard ( userLeaderboard )
90+ if ( currentFetch >= this . state . fetchId ) {
91+ this . setState ( { leaderboard} )
92+
93+ const userId = _get ( this . props , 'user.id' )
94+ if ( userId && ! options . ignoreUser ) {
95+ fetchLeaderboardForUser ( userId , 1 , ...this . leaderboardParams ( numberMonths , countryCode ) ) . then ( userLeaderboard => {
96+ this . mergeInUserLeaderboard ( userLeaderboard )
97+ this . setState ( { leaderboardLoading : false } )
98+ } )
99+ }
100+ else {
93101 this . setState ( { leaderboardLoading : false } )
94- } )
102+ }
95103 }
96104 else {
97105 this . setState ( { leaderboardLoading : false } )
0 commit comments