feat: overview-stats now work in the frontend

client/src/components/Match/Match.vue

@@ -156,7 +156,7 @@
             <svg class="w-5 h-5 text-blue-200">
               <use xlink:href="#stopwatch" />
             </svg>
-            <div class="text-lg font-medium text-teal-400">{{ (data.time/1000)|secToTime }}</div>
+            <div class="text-lg font-medium text-teal-400">{{ (data.time)|secToTime }}</div>
             <Tooltip>
               <template #trigger>
                 <div class="text-xs font-medium text-white">{{ data.date }}</div>

client/src/components/Summoner/Overview/SummonerStats.vue

@@ -185,12 +185,12 @@
       </div>
       <ul class="mt-1 text-gray-100">
         <li
-          v-for="(championClass, index) in championClasses"
+          v-for="(championClass, index) in stats.class"
           :key="index"
           :class="{'bg-blue-760': index % 2 !== 0}"
           class="flex items-center justify-between px-4 py-1 leading-tight"
         >
-          <div class="w-2/4 text-left capitalize">{{ championClass._id }}</div>
+          <div class="w-2/4 text-left capitalize">{{ championClass.id }}</div>
           <div
             :class="calculateWinrate(championClass.wins, championClass.count).color"
             class="w-1/4"
@@ -241,16 +241,12 @@ export default {
   },
 
   computed: {
-    championClasses() {
-      const classes = [...this.stats.class]
-      return classes.sort((a, b) => b.count - a.count)
-    },
     mostPlayedRole() {
       return Math.max(...this.stats.role.map(r => r.count), 0)
     },
     globalStatsKeys() {
       // eslint-disable-next-line no-unused-vars
-      const { _id, wins, losses, count, time, kp, ...rest } = this.stats.global
+      const { id, wins, losses, count, time, kp, ...rest } = this.stats.global
       return rest
     },
     ...mapState({
@@ -270,10 +266,9 @@ export default {
     leagueStatsByType(typeName) {
       return this.stats.league
         .map(l => {
-          return { ...l, ...gameModes[l._id] }
+          return { ...l, ...gameModes[l.id] }
         })
         .filter(l => l.type === typeName)
-        .sort((a, b) => b.count - a.count)
     },
     roundedRoleLosses(win, count) {
       return win === count ? 'rounded-full' : 'rounded-b-full'

client/src/views/Summoner.vue

@@ -10,10 +10,10 @@
       class="z-40 sidebar"
       container-selector=".vue-sticky-container"
     >
-      <!-- TODO: add it back when implemented -->
-      <!-- <SummonerChampions />
+      <SummonerChampions />
       <SummonerStats />
-      <SummonerMates /> -->
+      <!-- TODO: add it back when implemented -->
+      <!-- <SummonerMates /> -->
     </VueStickySidebar>
     <div class="w-9/12">
       <div v-if="current && current.participants" class="mb-4">
@@ -57,9 +57,9 @@ import LiveMatch from '@/components/Match/LiveMatch.vue'
 import LoadingButton from '@/components/Form/LoadingButton.vue'
 import Match from '@/components/Match/Match.vue'
 import OverviewLoader from '@/components/Summoner/Overview/OverviewLoader.vue'
-// import SummonerChampions from '@/components/Summoner/Overview/SummonerChampions.vue'
+import SummonerChampions from '@/components/Summoner/Overview/SummonerChampions.vue'
 // import SummonerMates from '@/components/Summoner/Overview/SummonerMates.vue'
-// import SummonerStats from '@/components/Summoner/Overview/SummonerStats.vue'
+import SummonerStats from '@/components/Summoner/Overview/SummonerStats.vue'
 import VueStickySidebar from 'vue-sticky-sidebar'
 
 export default {
@@ -68,9 +68,9 @@ export default {
     LoadingButton,
     Match,
     OverviewLoader,
-    // SummonerChampions,
+    SummonerChampions,
     // SummonerMates,
-    // SummonerStats,
+    SummonerStats,
     VueStickySidebar
   },
 

server-v2/app/Controllers/Http/MatchesController.ts

@@ -1,5 +1,6 @@
 import { HttpContextContract } from '@ioc:Adonis/Core/HttpContext'
 import MatchService from 'App/Services/MatchService'
+import StatsService from 'App/Services/StatsService'
 import MatchesIndexValidator from 'App/Validators/MatchesIndexValidator'
 
 export default class MatchesController {
@@ -12,11 +13,10 @@ export default class MatchesController {
     const { puuid, region, matchIds, season } = await request.validate(MatchesIndexValidator)
     const matches = await MatchService.getMatches(region, matchIds, puuid)
 
-    // TODO: add Stats here
-    // const stats = await StatsService.getSummonerStats(puuid, season)
+    const stats = await StatsService.getSummonerStats(puuid, season)
     return response.json({
       matches,
-      stats: 'TODO',
+      stats,
     })
   }
 }

server-v2/app/Parsers/MatchParser.ts

@@ -17,7 +17,7 @@ class MatchParser {
       region: match.info.platformId.toLowerCase(),
       result: match.info.teams[0].win ? match.info.teams[0].teamId : match.info.teams[1].teamId,
       season: getSeasonNumber(match.info.gameCreation),
-      gameDuration: match.info.gameDuration,
+      gameDuration: Math.round(match.info.gameDuration / 1000),
     })
 
     // - 2x MatchTeam : Red and Blue

server-v2/app/Repositories/MatchRepository.ts

@@ -1,6 +1,17 @@
 import Database from '@ioc:Adonis/Lucid/Database'
 
 class MatchRepository {
+  private readonly JOIN_MATCHES = 'INNER JOIN matches ON matches.id = match_players.match_id'
+  private readonly JOIN_TEAMS =
+    'INNER JOIN match_teams ON match_players.match_id = match_teams.match_id AND match_players.team = match_teams.color'
+  private readonly JOIN_ALL = `${this.JOIN_MATCHES} ${this.JOIN_TEAMS}`
+
+  private readonly GLOBAL_FILTERS = `
+    summoner_puuid = :puuid
+    AND match_teams.result != 'Remake'
+    AND matches.gamemode NOT IN (800, 810, 820, 830, 840, 850, 2000, 2010, 2020)
+  `
+
   public async globalStats(puuid: string) {
     const query = `
     SELECT
@@ -16,10 +27,9 @@ class MatchRepository {
         COUNT(case when match_teams.result = 'Fail' then 1 else null end) as losses
     FROM
         match_players
-        INNER JOIN matches ON matches.id = match_players.match_id
-        INNER JOIN match_teams ON match_players.match_id = match_teams.match_id AND match_players.team = match_teams.color
+        ${this.JOIN_ALL}
     WHERE
-        summoner_puuid = :puuid
+        ${this.GLOBAL_FILTERS}
     LIMIT
         1
     `
@@ -58,12 +68,13 @@ class MatchRepository {
         COUNT(case when match_teams.result = 'Fail' then 1 else null end) as losses
     FROM
         match_players
-        INNER JOIN matches ON matches.id = match_players.match_id
-        INNER JOIN match_teams ON match_players.match_id = match_teams.match_id AND match_players.team = match_teams.color
+        ${this.JOIN_ALL}
     WHERE
-        summoner_puuid = :puuid
+        ${this.GLOBAL_FILTERS}
     GROUP BY
         matches.gamemode
+    ORDER BY
+        count DESC
     `
     const { rows } = await Database.rawQuery(query, { puuid })
     return rows
@@ -78,9 +89,10 @@ class MatchRepository {
         COUNT(case when match_teams.result = 'Fail' then 1 else null end) as losses
     FROM
         match_players
-        INNER JOIN match_teams ON match_players.match_id = match_teams.match_id AND match_players.team = match_teams.color
+        ${this.JOIN_ALL}
     WHERE
-        summoner_puuid = :puuid
+        ${this.GLOBAL_FILTERS}
+        AND match_players.team_position != 0
     GROUP BY
         role
     `
@@ -100,13 +112,13 @@ class MatchRepository {
         COUNT(case when match_teams.result = 'Fail' then 1 else null end) as losses
     FROM
         match_players
-        INNER JOIN match_teams ON match_players.match_id = match_teams.match_id AND match_players.team = match_teams.color
+        ${this.JOIN_ALL}
     WHERE
-        summoner_puuid = :puuid
+        ${this.GLOBAL_FILTERS}
     GROUP BY
         match_players.champion_id
     ORDER BY
-        count DESC
+        count DESC, match_players.champion_id
     LIMIT
       :limit
     `
@@ -123,9 +135,9 @@ class MatchRepository {
         COUNT(case when match_teams.result = 'Fail' then 1 else null end) as losses
     FROM
         match_players
-        INNER JOIN match_teams ON match_players.match_id = match_teams.match_id AND match_players.team = match_teams.color
+        ${this.JOIN_ALL}
     WHERE
-        summoner_puuid = :puuid
+        ${this.GLOBAL_FILTERS}
     GROUP BY
         match_players.champion_role
     ORDER BY