🌍 translations

ref #11

src/components/AddTrackModal.svelte

@@ -12,7 +12,7 @@
     if (processed_last_submit === true) {
       processed_last_submit = false;
       const toast = Toastify({
-        text: "Track is being added...",
+        text: $_("track-is-being-added"),
         duration: -1,
       }).showToast();
       TrackService.trackControllerPost({
@@ -22,7 +22,7 @@
         .then((result) => {
           console.log(result);
           Toastify({
-            text: "Track added",
+            text: $_("track-added"),
             duration: 500,
             backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
           }).showToast();
@@ -44,34 +44,12 @@
   <div class="fixed z-10 inset-0 overflow-y-auto">
     <div
       class="flex items-end justify-center min-h-screen pt-4 px-4 pb-20 text-center sm:block sm:p-0">
-      <!--
-      Background overlay, show/hide based on modal state.
-
-      Entering: "ease-out duration-300"
-        From: "opacity-0"
-        To: "opacity-100"
-      Leaving: "ease-in duration-200"
-        From: "opacity-100"
-        To: "opacity-0"
-    -->
       <div class="fixed inset-0 transition-opacity" aria-hidden="true">
         <div class="absolute inset-0 bg-gray-500 opacity-75" />
       </div>
-
-      <!-- This element is to trick the browser into centering the modal contents. -->
       <span
         class="hidden sm:inline-block sm:align-middle sm:h-screen"
         aria-hidden="true">&#8203;</span>
-      <!--
-      Modal panel, show/hide based on modal state.
-
-      Entering: "ease-out duration-300"
-        From: "opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
-        To: "opacity-100 translate-y-0 sm:scale-100"
-      Leaving: "ease-in duration-200"
-        From: "opacity-100 translate-y-0 sm:scale-100"
-        To: "opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
-    -->
       <div
         class="inline-block align-bottom bg-white rounded-lg text-left overflow-hidden shadow-xl transform transition-all sm:my-8 sm:align-middle sm:max-w-lg sm:w-full"
         role="dialog"
@@ -81,7 +59,6 @@
           <div class="sm:flex sm:items-start">
             <div
               class="mx-auto flex-shrink-0 flex items-center justify-center h-12 w-12 rounded-full bg-blue-100 sm:mx-0 sm:h-10 sm:w-10">
-              <!-- Heroicon name: exclamation -->
               <svg
                 class="h-6 w-6 text-blue-600"
                 xmlns="http://www.w3.org/2000/svg"

src/locales/en.json

@@ -59,5 +59,7 @@
   "please-provide-the-required-information-to-add-a-new-track": "Please provide the required information to add a new track.",
   "create-a-new-track": "Create a new Track",
   "dashboard-greeting": "hello there",
-  "dashboard-title": "Dashboard"
+  "dashboard-title": "Dashboard",
+  "track-added": "Track added",
+  "track-is-being-added": "Track is being added..."
 }