Implement typesafe-i18n

front/src/Components/Chat/Chat.svelte

@@ -5,7 +5,7 @@
     import ChatElement from "./ChatElement.svelte";
     import { afterUpdate, beforeUpdate, onMount } from "svelte";
     import { HtmlUtils } from "../../WebRtc/HtmlUtils";
-    import { _ } from "../../Translator/Translator";
+    import LL from "../../i18n/i18n-svelte";
 
     let listDom: HTMLElement;
     let chatWindowElement: HTMLElement;
@@ -46,7 +46,7 @@
     <p class="close-icon" on:click={closeChat}>&times</p>
     <section class="messagesList" bind:this={listDom}>
         <ul>
-            <li><p class="system-text">{_("chat.intro")}</p></li>
+            <li><p class="system-text">{$LL.chat.intro()}</p></li>
             {#each $chatMessagesStore as message, i}
                 <li><ChatElement {message} line={i} /></li>
             {/each}

front/src/Components/Chat/ChatMessageForm.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
+    import LL from "../../i18n/i18n-svelte";
     import { chatMessagesStore, chatInputFocusStore } from "../../Stores/ChatStore";
-    import { _ } from "../../Translator/Translator";
 
     export const handleForm = {
         blur() {
@@ -28,7 +28,7 @@
     <input
         type="text"
         bind:value={newMessageText}
-        placeholder={_("chat.enter")}
+        placeholder={$LL.chat.enter()}
         on:focus={onFocus}
         on:blur={onBlur}
         bind:this={inputElement}

front/src/Components/Chat/ChatSubMenu.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
+    import LL from "../../i18n/i18n-svelte";
     import type { PlayerInterface } from "../../Phaser/Game/PlayerInterface";
     import { requestVisitCardsStore } from "../../Stores/GameStore";
-    import { _ } from "../../Translator/Translator";
 
     export let player: PlayerInterface;
 
@@ -15,10 +15,10 @@
 <ul class="selectMenu" style="border-top: {player.color || 'whitesmoke'} 5px solid">
     <li>
         <button class="text-btn" disabled={!player.visitCardUrl} on:click={openVisitCard}
-            >{_("chat.menu.visit-card")}</button
+            >{$LL.chat.menu.visitCard()}</button
         >
     </li>
-    <li><button class="text-btn" disabled>{_("chat.menu.add-friend")}</button></li>
+    <li><button class="text-btn" disabled>{$LL.chat.menu.addFriend}</button></li>
 </ul>
 
 <style lang="scss">