From 59bf0e1b4eb007ad8c9b3105c9e162392c2dd635 Mon Sep 17 00:00:00 2001
From: Made Baruna <made.setia@gmail.com>
Date: Sat, 17 Dec 2022 14:18:30 +0800
Subject: [PATCH] Card tag translation

---
 src/locales/en.json           | 4 +++-
 src/routes/tcg/_card.svelte   | 5 +++--
 src/routes/tcg/_deck.svelte   | 4 ++--
 src/routes/tcg/_detail.svelte | 7 +------
 src/routes/tcg/_tcg.svelte    | 7 +++++--
 5 files changed, 14 insertions(+), 13 deletions(-)

diff --git a/src/locales/en.json b/src/locales/en.json
index bc99c11d..72896e98 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -1046,6 +1046,8 @@
     "loadingLinkError": "Error generating link 😥",
     "shareDeck": "Share Deck \"{name}\"",
     "removeCompare": "Remove Compare",
-    "shareNotComplete": "Please complete the deck with 3 characters and 30 action cards to share!"
+    "shareNotComplete": "Please complete the deck with 3 characters and 30 action cards to share!",
+    "characterCard": "Character Card",
+    "actionCard": "Action Card"
   }
 }
\ No newline at end of file
diff --git a/src/routes/tcg/_card.svelte b/src/routes/tcg/_card.svelte
index 75e6e75c..14126789 100644
--- a/src/routes/tcg/_card.svelte
+++ b/src/routes/tcg/_card.svelte
@@ -6,6 +6,7 @@
   import DetailModal from './_detailModal.svelte';
   import { t } from 'svelte-i18n';
 
+  export let tags;
   export let card;
   export let compare;
   export let count = 0;
@@ -266,10 +267,10 @@
         style="top: {y}px; left: {x}px;"
         bind:this={detailContainer}
       >
-        <Detail {card} {smallScreen} />
+        <Detail {tags} {card} {smallScreen} />
         {#if showCompare}
           <div class="w-2" />
-          <Detail card={compare} {smallScreen} />
+          <Detail {tags} card={compare} {smallScreen} />
         {/if}
       </div>
     {/if}
diff --git a/src/routes/tcg/_deck.svelte b/src/routes/tcg/_deck.svelte
index 17364e7e..b47a0989 100644
--- a/src/routes/tcg/_deck.svelte
+++ b/src/routes/tcg/_deck.svelte
@@ -1,6 +1,6 @@
 <script>
-  import { mdiContentSave, mdiDownload, mdiPencil, mdiShareVariant } from '@mdi/js';
-  import { createEventDispatcher, getContext, onMount } from 'svelte';
+  import { mdiContentSave, mdiPencil, mdiShareVariant } from '@mdi/js';
+  import { createEventDispatcher, getContext } from 'svelte';
   import { t } from 'svelte-i18n';
   import { slide } from 'svelte/transition';
   import Button from '../../components/Button.svelte';
diff --git a/src/routes/tcg/_detail.svelte b/src/routes/tcg/_detail.svelte
index ad4fd6b2..a7d56f9f 100644
--- a/src/routes/tcg/_detail.svelte
+++ b/src/routes/tcg/_detail.svelte
@@ -1,8 +1,5 @@
-<script context="module">
-  import tagsJson from '../../data/tcg/tags/en.json';
-</script>
-
 <script>
+  export let tags;
   export let card;
   export let smallScreen = false;
   export let withBackground = true;
@@ -28,8 +25,6 @@
     },
   };
 
-  let tags = tagsJson;
-
   $: size = sizes[smallScreen ? 'small' : 'base'];
 </script>
 
diff --git a/src/routes/tcg/_tcg.svelte b/src/routes/tcg/_tcg.svelte
index 379f5f48..eb25690a 100644
--- a/src/routes/tcg/_tcg.svelte
+++ b/src/routes/tcg/_tcg.svelte
@@ -341,6 +341,7 @@
       {sharedDeck}
       {sharedId}
       {swapCharacterCardPos}
+      {tags}
       on:toggleDeck={toggleShowDeck}
       on:save={() => saveData()}
       on:saveShared={saveSharedDeck}
@@ -349,10 +350,10 @@
   <div class="flex gap-2 justify-center md:justify-start">
     <div class="flex">
       <button on:click={() => changeDisplay('character')} class="pill {display === 'character' ? 'active' : ''}">
-        Character Card
+        {$t('tcg.characterCard')}
       </button>
       <button on:click={() => changeDisplay('action')} class="pill {display === 'action' ? 'active' : ''}">
-        Action Card
+        {$t('tcg.actionCard')}
       </button>
     </div>
     <div class="flex">
@@ -385,6 +386,7 @@
           {size}
           {showDetail}
           {smallScreen}
+          {tags}
           count={deck.characters[card.id]}
           on:compare={() => setCompare(card)}
           on:addToDeck={() => addToDeck('characters', card)}
@@ -401,6 +403,7 @@
           {size}
           {showDetail}
           {smallScreen}
+          {tags}
           count={deck.actions[card.id]}
           on:compare={() => setCompare(card)}
           on:addToDeck={() => addToDeck('actions', card)}