From 335fe5c4a605fc157e9c57611165c8cf733e7321 Mon Sep 17 00:00:00 2001
From: Valentin Kaelin <kalanehd@gmail.com>
Date: Sat, 20 Jun 2020 19:46:25 +0200
Subject: [PATCH] feat: display old summoner names on actual summoner name
 hover

---
 client/src/layouts/Default.vue                | 29 ++++++++++++++++---
 .../Controllers/Http/SummonerController.js    |  6 ++--
 server/app/Repositories/MatchRepository.js    |  1 +
 server/app/Services/SummonerService.js        | 19 ++++++++++++
 4 files changed, 49 insertions(+), 6 deletions(-)

diff --git a/client/src/layouts/Default.vue b/client/src/layouts/Default.vue
index 9825975..9a58d00 100644
--- a/client/src/layouts/Default.vue
+++ b/client/src/layouts/Default.vue
@@ -53,10 +53,29 @@
           <div class="flex items-center justify-between">
             <div>
               <div class="flex items-center">
-                <h1 class="text-4xl font-extrabold uppercase">
-                  <span class="text-5xl">{{ basic.account.name[0] }}</span>
-                  <span>{{ basic.account.name.substring(1) }}</span>
-                </h1>
+                <Tooltip>
+                  <template v-slot:trigger>
+                    <h1 class="text-4xl font-extrabold uppercase">
+                      <span class="text-5xl">{{ basic.account.name[0] }}</span>
+                      <span>{{ basic.account.name.substring(1) }}</span>
+                    </h1>
+                  </template>
+                  <template v-slot:default>
+                    <div
+                      v-if="basic.account.names.length > 1"
+                      class="px-2 text-sm text-center text-white select-none"
+                    >
+                      <div>Old summoner names</div>
+                      <ul class="pl-2 text-left">
+                        <li
+                          v-for="name in basic.account.names"
+                          :key="name.date"
+                          class="text-teal-400"
+                        >{{ name.name }}</li>
+                      </ul>
+                    </div>
+                  </template>
+                </Tooltip>
                 <div
                   v-if="playing"
                   class="flex items-center px-3 py-1 mt-2 ml-4 bg-teal-800 border border-teal-400 rounded-full"
@@ -164,6 +183,7 @@ import RecentActivity from '@/components/Summoner/RecentActivity.vue'
 import SearchForm from '@/components/Form/SearchForm.vue'
 import HeaderLoader from '@/components/Summoner/HeaderLoader.vue'
 import SummonerRanked from '@/components/Summoner/SummonerRanked.vue'
+import Tooltip from '@/components/Common/Tooltip.vue'
 
 export default {
   components: {
@@ -174,6 +194,7 @@ export default {
     SearchForm,
     HeaderLoader,
     SummonerRanked,
+    Tooltip
   },
 
   data() {
diff --git a/server/app/Controllers/Http/SummonerController.js b/server/app/Controllers/Http/SummonerController.js
index 0c189d5..09e0fa3 100644
--- a/server/app/Controllers/Http/SummonerController.js
+++ b/server/app/Controllers/Http/SummonerController.js
@@ -43,10 +43,12 @@ class SummonerController {
         { puuid: account.puuid }
       )
 
+      // Summoner names
+      finalJSON.account.names = SummonerService.getAllSummonerNames(account, summonerDB)
+
       // MATCH LIST
       await MatchService.updateMatchList(account, summonerDB)
-      const matchList = summonerDB.matchList
-      finalJSON.matchList = matchList
+      finalJSON.matchList = summonerDB.matchList
 
       // All seasons the summoner has played
       finalJSON.seasons = await this._getSeasons(account.puuid)
diff --git a/server/app/Repositories/MatchRepository.js b/server/app/Repositories/MatchRepository.js
index 5a590de..5524c05 100644
--- a/server/app/Repositories/MatchRepository.js
+++ b/server/app/Repositories/MatchRepository.js
@@ -238,6 +238,7 @@ class MatchRepository {
     ]
     return this._aggregate(puuid, matchParams, [], '$role', {}, finalSteps)
   }
+  
   /**
    * Get Summoner's played seasons
    * @param puuid of the summoner
diff --git a/server/app/Services/SummonerService.js b/server/app/Services/SummonerService.js
index 9f33d32..533d963 100644
--- a/server/app/Services/SummonerService.js
+++ b/server/app/Services/SummonerService.js
@@ -31,6 +31,25 @@ class SummonerService {
     return account
   }
 
+  /**
+   * Return the full list of old and actual summoner names
+   * @param account of the summoner
+   * @param summonerDB summoner in the database
+   */
+  getAllSummonerNames(account, summonerDB) {
+    const names = summonerDB.names ? summonerDB.names : []
+
+    if (!names.find(n => n.name === account.name)) {
+      names.push({
+        name: account.name,
+        date: new Date()
+      })
+      summonerDB.names = names
+    }
+
+    return names
+  }
+
   /**
    * Get ranked data for a specific Summoner
    * @param account