fix: live tab game now works for custom tournament games

client/src/components/Summoner/Live/LiveTeam.vue

@@ -126,8 +126,8 @@
                   class="absolute ban-order w-4 h-4 flex items-center justify-center text-xs font-bold rounded-full"
                 >{{ banChamp(index, player.teamId).pickTurn }}</div>
               </div>
-              <div v-else class="w-5 h-5">
-                <div class="-mt-1 text-blue-300 text-2xl">-</div>
+              <div v-else class="w-5 h-5 text-left">
+                <div class="text-blue-300 text-2xl">-</div>
               </div>
             </div>
           </td>
@@ -185,10 +185,26 @@ export default {
     ally: {
       type: Boolean,
       default: true,
+    },
+    gamemode: {
+      type: String,
+      default: '',
+    }
+  },
+
+  data() {
+    return {
+      customGameBanOrder: {
+        100: [1, 3, 5, 2, 4],
+        200: [2, 4, 6, 1, 3]
+      }
     }
   },
 
   computed: {
+    isCustom() {
+      return this.gamemode === 'Custom Game'
+    },
     ...mapState({
       account: state => state.summoner.basic.account,
       live: state => state.summoner.live.match,
@@ -198,12 +214,12 @@ export default {
 
   methods: {
     banChamp(index, teamId) {
-      index++
-
-      if (teamId === 200) {
+      if (teamId === 200 && !this.isCustom) {
         index += 5
       }
-      return this.live.bannedChampions.find(b => b.pickTurn === index)
+
+      const toFind = this.isCustom ? this.customGameBanOrder[teamId][index] : index + 1
+      return this.live.bannedChampions.find(b => b.pickTurn === toFind && b.teamId === teamId)
     },
     borderChampion(id) {
       if (id === this.account.id) {

client/src/mixins/liveGame.js

@@ -22,7 +22,11 @@ export const liveGame = {
       return this.current && this.current.participants ? this.current.participants.filter(p => p.teamId !== this.teamColor) : []
     },
     gamemode() {
-      return gameModes[this.current.gameQueueConfigId]
+      if (this.current.participants) {
+        return this.current.gameType === 'CUSTOM_GAME' ? { type: '', name: 'Custom Game' } : gameModes[this.current.gameQueueConfigId]
+      } else {
+        return { type: '', name: '' }
+      }
     },
     gameStartTime() {
       return this.current ? this.current.gameStartTime : 0

client/src/views/SummonerLive.vue

@@ -12,8 +12,8 @@
       </div>
       <div v-else class="h-4"></div>
 
-      <LiveTeam :team="allyTeam" :ally="true" />
-      <LiveTeam :team="enemyTeam" :ally="false" class="mt-4" />
+      <LiveTeam :team="allyTeam" :ally="true" :gamemode="gamemode.name" />
+      <LiveTeam :team="enemyTeam" :ally="false" :gamemode="gamemode.name" class="mt-4" />
     </div>
     <div v-else>
       <div class="mt-16 flex justify-center">