From 44f10b6c3533c9f08a41a4d29fb24f0c2e150cf8 Mon Sep 17 00:00:00 2001
From: Valentin Kaelin <kalanehd@gmail.com>
Date: Sat, 14 Nov 2020 18:28:39 +0100
Subject: [PATCH] fix(front): display old items icons

---
 client/src/components/Match/MatchItems.vue | 36 ++++++++++++++++++----
 1 file changed, 30 insertions(+), 6 deletions(-)

diff --git a/client/src/components/Match/MatchItems.vue b/client/src/components/Match/MatchItems.vue
index 89c1e3d..7919b46 100644
--- a/client/src/components/Match/MatchItems.vue
+++ b/client/src/components/Match/MatchItems.vue
@@ -1,26 +1,37 @@
 <template>
-  <div :class="oneRow ? 'ml-2 items-center' : 'items-2-rows flex-wrap'" class="flex">
+  <div
+    :class="oneRow ? 'ml-2 items-center' : 'items-2-rows flex-wrap'"
+    class="flex"
+  >
     <Tooltip v-for="(item, index) in items" :key="index">
       <template v-slot:trigger>
         <div
-          :style="{backgroundImage: item ? `url('${item.image}')` : null}"
-          :class="[oneRow ? 'ml-2px w-6 h-6' : 'ml-1 w-8 h-8', {'cursor-pointer': item !== null}]"
+          :style="{ backgroundImage: itemLink(item) }"
+          :class="[
+            oneRow ? 'ml-2px w-6 h-6' : 'ml-1 w-8 h-8',
+            { 'cursor-pointer': item !== null },
+          ]"
           class="bg-center bg-cover rounded-md bg-blue-1000"
         ></div>
       </template>
       <template v-if="item !== null" v-slot:default>
         <div class="flex max-w-md p-2 text-xs text-left text-white select-none">
           <div
-            :style="{backgroundImage: item ? `url('${item.image}')` : null}"
+            :style="{ backgroundImage: itemLink(item) }"
             class="flex-shrink-0 w-12 h-12 ml-1 bg-center bg-cover rounded-md bg-blue-1000"
           ></div>
           <div class="ml-2 leading-none">
             <div class="text-base">{{ item.name }}</div>
             <div class="mt-1">
               <span class="text-blue-200">Price:</span>
-              <span class="ml-1 text-sm font-semibold text-yellow-500">{{ item.price }}</span>
+              <span class="ml-1 text-sm font-semibold text-yellow-500">{{
+                item.price
+              }}</span>
             </div>
-            <div v-html="item.description" class="mt-1 font-light text-blue-200 item-description"></div>
+            <div
+              v-html="item.description"
+              class="mt-1 font-light text-blue-200 item-description"
+            ></div>
           </div>
         </div>
       </template>
@@ -45,6 +56,19 @@ export default {
       type: Array,
       required: true
     }
+  },
+
+  methods: {
+    itemLink(item) {
+      if (!item) {
+        return null
+      }
+
+      // Fix to still make work the old items links (before season 11)
+      const originalUrl = item.image
+      const newUrl = originalUrl.includes('/global/default/assets/items/') ? originalUrl : originalUrl.replace('latest', '10.22')
+      return `url('${newUrl}')`
+    }
   }
 }
 </script>