fix: load more matches when season is selected now works again

client/src/store/modules/summoner.js

@@ -15,11 +15,13 @@ export const state = {
     status: '',
   },
   overview: {
-    matchIndex: 0,
+    NB_LOAD_GAMES: 10,
     matches: [],
+    lastMatchId: null,
     stats: {},
     loaded: false,
     matchesLoading: false,
+    moreMatchesToFetch: true
   },
   champions: {
     list: [],
@@ -43,6 +45,7 @@ export const mutations = {
     state.champions.championsLoaded = false
     state.records.recordsLoaded = false
     state.overview.loaded = false
+    state.overview.moreMatchesToFetch = true
     state.live.liveLoaded = false
   },
   CHAMPIONS_NOT_FOUND(state) {
@@ -53,8 +56,8 @@ export const mutations = {
     state.champions.championsLoaded = true
   },
   KEEP_LAST_X_MATCHES(state, number) {
-    state.overview.matchIndex = number
     state.overview.matches = state.overview.matches.slice(0, number)
+    state.overview.lastMatchId = state.overview.matches[state.overview.matches.length - 1].matchId
   },
   LIVE_FOUND(state, { live }) {
     state.live.match = live
@@ -68,21 +71,27 @@ export const mutations = {
     state.overview.matchesLoading = true
   },
   MATCHES_FOUND(state, { newMatches, stats }) {
-    state.basic.recentActivity = stats.recentActivity
     state.overview.matchesLoading = false
+
+    if (newMatches.length > 0) {
+      state.basic.recentActivity = stats.recentActivity
       state.overview.matches = [...state.overview.matches, ...newMatches]
-    state.overview.matchIndex += 10
+      state.overview.lastMatchId = newMatches[newMatches.length - 1].matchId
       state.overview.stats = stats
       state.champions.championsLoaded = false
       state.records.recordsLoaded = false
+    }
+
+    state.overview.moreMatchesToFetch = newMatches.length >= state.overview.NB_LOAD_GAMES - 1
   },
   OVERVIEW_FOUND(state, infos) {
     state.basic.recentActivity = infos.stats.recentActivity
     state.overview.matches = infos.matches
-    state.overview.matchIndex = infos.matches.length
+    state.overview.lastMatchId = infos.matches[infos.matches.length - 1].matchId
     state.overview.stats = infos.stats
     state.overview.loaded = true
     state.records.recordsLoaded = false
+    state.overview.moreMatchesToFetch = infos.matches.length >= state.overview.NB_LOAD_GAMES - 1
   },
   RECORDS_FOUND(state, { records }) {
     state.records.list = records
@@ -182,18 +191,14 @@ export const actions = {
       commit('SUMMONER_NOT_PLAYING')
     }
   },
-  async moreMatches({ commit, getters, rootState }) {
+  async moreMatches({ commit, rootState }) {
     commit('MATCHES_LOADING')
-
-    const matchIds = getters.filteredMatchList
-      .slice(state.overview.matchIndex, state.overview.matchIndex + 10)
-
     const resp = await axios(({
       url: 'match',
       data: {
         puuid: state.basic.account.puuid,
         region: rootState.regionsList[rootState.settings.region],
-        matchIds
+        lastMatchId: state.overview.lastMatchId
       },
       method: 'POST'
     })).catch(() => { })
@@ -234,14 +239,7 @@ export const actions = {
 }
 
 export const getters = {
-  filteredMatchList: (state, getters) => {
-    return state.basic.matchList
-      .filter(match => !getters.regionFilterApplied || match.seasonMatch === state.basic.currentSeason)
-  },
   matchesLoading: state => state.overview.matchesLoading,
-  moreMatchesToFetch: (state, getters) => {
-    return state.overview.matchIndex < getters.filteredMatchList.length
-  },
   overviewLoaded: state => state.overview.loaded,
   playing: state => state.live.playing,
   regionFilterApplied: state => !!state.basic.currentSeason,

client/src/views/Summoner.vue

@@ -28,7 +28,7 @@
           />
         </ul>
         <LoadingButton
-          v-if="moreMatchesToFetch"
+          v-if="overview.moreMatchesToFetch"
           @clicked="moreMatches"
           :loading="matchesLoading"
           btn-class="block px-4 py-2 mx-auto mt-4 font-semibold bg-blue-800 rounded-md shadow-lg hover:bg-blue-1000"
@@ -78,7 +78,7 @@ export default {
       current: state => state.summoner.live.match,
       overview: state => state.summoner.overview,
     }),
-    ...mapGetters('summoner', ['matchesLoading', 'moreMatchesToFetch', 'overviewLoaded', 'summonerFound'])
+    ...mapGetters('summoner', ['matchesLoading', 'overviewLoaded', 'summonerFound'])
   },
 
   watch: {

server/app/Controllers/Http/MatchesController.ts

@@ -3,6 +3,7 @@ import Match from 'App/Models/Match'
 import MatchPlayerRankParser from 'App/Parsers/MatchPlayerRankParser'
 import DetailedMatchSerializer from 'App/Serializers/DetailedMatchSerializer'
 import MatchPlayerRankSerializer from 'App/Serializers/MatchPlayerRankSerializer'
+import { SerializedMatch } from 'App/Serializers/SerializedTypes'
 import MatchService from 'App/Services/MatchService'
 import StatsService from 'App/Services/StatsService'
 import DetailedMatchValidator from 'App/Validators/DetailedMatchValidator'
@@ -14,8 +15,13 @@ export default class MatchesController {
    * @param ctx
    */
   public async index({ request, response }: HttpContextContract) {
-    const { puuid, region, matchIds, season } = await request.validate(MatchesIndexValidator)
-    const matches = await MatchService.getMatches(region, matchIds, puuid)
+    const { puuid, region, lastMatchId, season } = await request.validate(MatchesIndexValidator)
+    const matchIds = await MatchService.getMatchIdsToFetch(lastMatchId, puuid, season)
+    let matches: SerializedMatch[] = []
+
+    if (matchIds.length > 0) {
+      matches = await MatchService.getMatches(region, matchIds, puuid)
+    }
 
     const stats = await StatsService.getSummonerStats(puuid, season)
     return response.json({

server/app/Services/MatchService.ts

@@ -8,6 +8,7 @@ import BasicMatchSerializer from 'App/Serializers/BasicMatchSerializer'
 import { SerializedMatch } from 'App/Serializers/SerializedTypes'
 import Match from 'App/Models/Match'
 import { notEmpty, tutorialQueues } from 'App/helpers'
+import SummonerMatchlist from 'App/Models/SummonerMatchlist'
 
 class MatchService {
   /**
@@ -82,6 +83,25 @@ class MatchService {
     return currentMatchListIds.reverse()
   }
 
+  /**
+   * Get the list of matchIds from the next matches to fetch for a specific Summoner
+   */
+  public async getMatchIdsToFetch(lastMatchId: string, puuid: string, season?: number) {
+    const matchListQuery = SummonerMatchlist.query()
+      .select('matchId')
+      .where('summoner_puuid', puuid)
+      .andWhere('match_id', '<', lastMatchId)
+
+    if (season) {
+      matchListQuery
+        .join('matches', 'summoner_matchlist.match_id', 'matches.id')
+        .where('matches.season', season)
+    }
+
+    const matchlist = await matchListQuery.orderBy('matchId', 'desc').limit(10)
+    return matchlist.map((m) => m.matchId)
+  }
+
   /**
    * Fetch list of matches for a specific Summoner
    */

server/app/Validators/MatchesIndexValidator.ts

@@ -26,7 +26,7 @@ export default class MatchesIndexValidator {
   public schema = schema.create({
     puuid: schema.string(),
     region: schema.string(),
-    matchIds: schema.array().members(schema.string()),
+    lastMatchId: schema.string(),
     season: schema.number.optional(),
   })