add russian translation

Author: stringhandler

docs/index.html

@@ -18,7 +18,8 @@
     "@tauri-apps/plugin-opener": "^2",
     "@tauri-apps/plugin-process": "^2",
     "@tauri-apps/plugin-updater": "^2",
-    "chart.js": "^4.5.1"
+    "chart.js": "^4.5.1",
+    "svelte-i18n": "^4.0.1"
   },
   "devDependencies": {
     "@sveltejs/adapter-static": "^3.0.6",

package-lock.json

@@ -1,6 +1,7 @@
 <script>
   import { invoke } from "@tauri-apps/api/core";
   import { updateAnalyticsConsent, identifyUser } from "$lib/analytics.js";
+  import { _ } from "svelte-i18n";
 
   let { onClose = () => {} } = $props();
   let isSaving = $state(false);
@@ -28,35 +29,35 @@
 <div class="modal-backdrop" onclick={()  => {}}>
   <div class="modal-card" onclick={(e) => e.stopPropagation()}>
     <div class="modal-header">
-      <h2>Help Improve Dota Keeper</h2>
+      <h2>{$_('analytics_consent.title')}</h2>
     </div>
 
     <div class="modal-body">
       <p class="intro">
-        Would you like to help improve Dota Keeper by sending anonymous usage data?
+        {$_('analytics_consent.intro')}
       </p>
 
       <div class="info-section">
-        <h3>✅ What we collect:</h3>
+        <h3>{$_('analytics_consent.collect_title')}</h3>
         <ul>
-          <li>App version and platform (Windows/macOS/Linux)</li>
-          <li>Page views (e.g. "opened Goals page")</li>
-          <li>Feature usage (e.g. "goal created", "challenge accepted")</li>
-          <li>Error events (type only, no personal details)</li>
+          <li>{$_('analytics_consent.collect_1')}</li>
+          <li>{$_('analytics_consent.collect_2')}</li>
+          <li>{$_('analytics_consent.collect_3')}</li>
+          <li>{$_('analytics_consent.collect_4')}</li>
         </ul>
       </div>
 
       <div class="info-section">
-        <h3>🚫 What we DON'T collect:</h3>
+        <h3>{$_('analytics_consent.not_collect_title')}</h3>
         <ul>
-          <li>Steam ID or any personally identifiable information</li>
-          <li>Match IDs, hero choices, or game data</li>
-          <li>Goal descriptions, targets, or any content you enter</li>
+          <li>{$_('analytics_consent.not_collect_1')}</li>
+          <li>{$_('analytics_consent.not_collect_2')}</li>
+          <li>{$_('analytics_consent.not_collect_3')}</li>
         </ul>
       </div>
 
       <p class="note">
-        You can change this preference anytime in Settings → Privacy.
+        {$_('analytics_consent.note')}
       </p>
     </div>
 
@@ -66,14 +67,14 @@
         onclick={() => handleConsent("Accepted")}
         disabled={isSaving}
       >
-        {isSaving ? 'Saving...' : 'Accept'}
+        {isSaving ? $_('analytics_consent.saving') : $_('analytics_consent.accept')}
       </button>
       <button
         class="btn btn-ghost"
         onclick={() => handleConsent("Declined")}
         disabled={isSaving}
       >
-        Decline
+        {$_('analytics_consent.decline')}
       </button>
     </div>
   </div>

package.json

@@ -1,40 +1,41 @@
 <script>
   import { page } from "$app/stores";
+  import { _ } from "svelte-i18n";
 
   const navItems = [
     {
       href: "/",
-      label: "Home",
+      labelKey: "home",
       exact: true,
       icon: `<path stroke-linecap="round" stroke-linejoin="round" d="M3 12l2-2m0 0l7-7 7 7M5 10v10a1 1 0 001 1h3m10-11l2 2m-2-2v10a1 1 0 01-1 1h-3m-6 0a1 1 0 001-1v-4a1 1 0 011-1h2a1 1 0 011 1v4a1 1 0 001 1m-6 0h6" />`
     },
     {
       href: "/matches",
-      label: "Matches",
+      labelKey: "matches",
       exact: false,
       icon: `<path stroke-linecap="round" stroke-linejoin="round" d="M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2" />`
     },
     {
       href: "/analysis",
-      label: "Analysis",
+      labelKey: "analysis",
       exact: false,
       icon: `<path stroke-linecap="round" stroke-linejoin="round" d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z" />`
     },
     {
       href: "/goals",
-      label: "Goals",
+      labelKey: "goals",
       exact: false,
       icon: `<path stroke-linecap="round" stroke-linejoin="round" d="M5 3v4M3 5h4M6 17v4m-2-2h4m5-16l2.286 6.857L21 12l-5.714 2.143L13 21l-2.286-6.857L5 12l5.714-2.143L13 3z" />`
     },
     {
       href: "/mental-health",
-      label: "Mind",
+      labelKey: "mind",
       exact: false,
       icon: `<path stroke-linecap="round" stroke-linejoin="round" d="M21 8.25c0-2.485-2.099-4.5-4.688-4.5-1.935 0-3.597 1.126-4.312 2.733-.715-1.607-2.377-2.733-4.313-2.733C5.1 3.75 3 5.765 3 8.25c0 7.22 9 12 9 12s9-4.78 9-12z" />`
     },
     {
       href: "/settings",
-      label: "Settings",
+      labelKey: "settings",
       exact: false,
       icon: `<path stroke-linecap="round" stroke-linejoin="round" d="M10.325 4.317c.426-1.756 2.924-1.756 3.35 0a1.724 1.724 0 002.573 1.066c1.543-.94 3.31.826 2.37 2.37a1.724 1.724 0 001.065 2.572c1.756.426 1.756 2.924 0 3.35a1.724 1.724 0 00-1.066 2.573c.94 1.543-.826 3.31-2.37 2.37a1.724 1.724 0 00-2.572 1.065c-.426 1.756-2.924 1.756-3.35 0a1.724 1.724 0 00-2.573-1.066c-1.543.94-3.31-.826-2.37-2.37a1.724 1.724 0 00-1.065-2.572c-1.756-.426-1.756-2.924 0-3.35a1.724 1.724 0 001.066-2.573c-.94-1.543.826-3.31 2.37-2.37.996.608 2.296.07 2.572-1.065z" /><path stroke-linecap="round" stroke-linejoin="round" d="M15 12a3 3 0 11-6 0 3 3 0 016 0z" />`
     }
@@ -52,7 +53,7 @@
       <svg class="tab-icon" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.5">
         {@html item.icon}
       </svg>
-      <span class="tab-label">{item.label}</span>
+      <span class="tab-label">{$_('nav.' + item.labelKey)}</span>
     </a>
   {/each}
 </nav>

src/lib/AnalyticsConsentModal.svelte

@@ -3,6 +3,7 @@
   import { getVersion } from "@tauri-apps/api/app";
   import { onMount } from "svelte";
   import { showToast } from "$lib/toast.js";
+  import { _ } from "svelte-i18n";
 
   import { PUBLIC_SUPABASE_URL as SUPABASE_URL, PUBLIC_SUPABASE_ANON_KEY as SUPABASE_ANON_KEY } from '$env/static/public';
 
@@ -22,10 +23,10 @@
     }
   });
 
-  const followUpPrompts = {
-    bug: "What happened? What did you expect?",
-    feature: "What were you trying to do that wasn't possible?",
-    positive: "What specifically do you like? Why is it useful?",
+  const followUpPromptKeys = {
+    bug: "feedback.prompt_bug",
+    feature: "feedback.prompt_feature",
+    positive: "feedback.prompt_positive",
   };
 
   function getPlatform() {
@@ -40,7 +41,7 @@
     if (!category || !feedbackText.trim()) return;
 
     if (!SUPABASE_URL || !SUPABASE_ANON_KEY) {
-      showToast("Feedback is not configured yet.", "error");
+      showToast($_('feedback.not_configured'), "error");
       return;
     }
 
@@ -68,13 +69,13 @@
 
       if (!res.ok) throw new Error(`HTTP ${res.status}`);
 
-      showToast("Feedback submitted — thank you!", "success");
+      showToast($_('feedback.toast_success'), "success");
       category = "";
       feedbackText = "";
       priority = "";
       onClose();
     } catch (e) {
-      showToast("Failed to submit feedback. Please try again.", "error");
+      showToast($_('feedback.toast_error'), "error");
     } finally {
       isSubmitting = false;
     }
@@ -85,14 +86,14 @@
   <div class="modal-card" onclick={(e) => e.stopPropagation()} role="dialog" aria-modal="true" aria-label="Send feedback">
 
     <div class="modal-header">
-      <h2>Send Feedback</h2>
+      <h2>{$_('feedback.title')}</h2>
       <button class="close-btn" onclick={onClose} aria-label="Close">✕</button>
     </div>
 
     <div class="modal-body">
       <!-- Step 1: Category -->
       <div class="field-group">
-        <label class="field-label">What kind of feedback is this?</label>
+        <label class="field-label">{$_('feedback.category_label')}</label>
         <div class="category-options">
           <button
             class="category-btn"
@@ -101,7 +102,7 @@
             type="button"
           >
             <span class="cat-icon">🐛</span>
-            <span>Bug / Something broken</span>
+            <span>{$_('feedback.bug')}</span>
           </button>
           <button
             class="category-btn"
@@ -110,7 +111,7 @@
             type="button"
           >
             <span class="cat-icon">💡</span>
-            <span>Missing feature or improvement</span>
+            <span>{$_('feedback.feature')}</span>
           </button>
           <button
             class="category-btn"
@@ -119,7 +120,7 @@
             type="button"
           >
             <span class="cat-icon">⭐</span>
-            <span>Works great — tell us what you like</span>
+            <span>{$_('feedback.positive')}</span>
           </button>
         </div>
       </div>
@@ -128,13 +129,13 @@
       {#if category}
         <div class="field-group">
           <label class="field-label" for="feedback-text">
-            {followUpPrompts[category]}
+            {$_(followUpPromptKeys[category])}
           </label>
           <textarea
             id="feedback-text"
             class="feedback-textarea"
             bind:value={feedbackText}
-            placeholder="Your answer..."
+            placeholder={$_('feedback.placeholder')}
             rows="3"
             maxlength="500"
           ></textarea>
@@ -143,12 +144,12 @@
         <!-- Step 3: Priority (only for bug / feature) -->
         {#if category !== "positive"}
           <div class="field-group">
-            <label class="field-label">How much is this affecting your use of the app? <span class="optional">(optional)</span></label>
+            <label class="field-label">{$_('feedback.priority_label')} <span class="optional">{$_('feedback.optional')}</span></label>
             <div class="priority-options">
               {#each [
-                { value: "blocking", label: "Blocking — I can't use the app properly" },
-                { value: "annoying", label: "Annoying — I work around it" },
-                { value: "minor",    label: "Minor — Nice to have" },
+                { value: "blocking", tkey: "feedback.priority_blocking" },
+                { value: "annoying", tkey: "feedback.priority_annoying" },
+                { value: "minor",    tkey: "feedback.priority_minor" },
               ] as opt}
                 <label class="priority-radio">
                   <input
@@ -157,7 +158,7 @@
                     value={opt.value}
                     bind:group={priority}
                   />
-                  <span>{opt.label}</span>
+                  <span>{$_(opt.tkey)}</span>
                 </label>
               {/each}
             </div>
@@ -167,14 +168,14 @@
     </div>
 
     <div class="modal-actions">
-      <button class="btn btn-ghost" onclick={onClose} type="button">Cancel</button>
+      <button class="btn btn-ghost" onclick={onClose} type="button">{$_('feedback.cancel')}</button>
       <button
         class="btn btn-primary"
         onclick={handleSubmit}
         disabled={!category || !feedbackText.trim() || isSubmitting}
         type="button"
       >
-        {isSubmitting ? "Sending..." : "Send Feedback"}
+        {isSubmitting ? $_('feedback.sending') : $_('feedback.send')}
       </button>
     </div>
   </div>

src/lib/BottomNav.svelte

@@ -1,5 +1,6 @@
 <script>
   import { invoke } from "@tauri-apps/api/core";
+  import { _ } from "svelte-i18n";
 
   let { matchId, onComplete } = $props();
 
@@ -13,12 +14,19 @@
 
   const energyEmojis = ["😴", "😐", "🙂", "😄", "⚡"];
   const calmEmojis = ["😤", "😠", "😐", "😊", "🧘"];
+  // English values stored in DB; tkeys used for display only
   const attributionOptions = [
     "Teammates",
     "The enemy",
     "My own mistakes",
     "Nothing — I was fine actually",
   ];
+  const attributionTKeys = [
+    "mood_checkin.attribution_teammates",
+    "mood_checkin.attribution_enemy",
+    "mood_checkin.attribution_own",
+    "mood_checkin.attribution_fine",
+  ];
 
   async function submit() {
     if (energy === null || calm === null) return;
@@ -51,11 +59,11 @@
 <div class="checkin-card">
   <div class="checkin-header">
     <span class="checkin-icon">🧠</span>
-    <h3 class="checkin-title">How was that session?</h3>
+    <h3 class="checkin-title">{$_('mood_checkin.title')}</h3>
   </div>
 
   <div class="question-block">
-    <p class="question-label">How energised did you feel?</p>
+    <p class="question-label">{$_('mood_checkin.energy_q')}</p>
     <div class="emoji-scale">
       {#each energyEmojis as emoji, i}
         <button
@@ -72,7 +80,7 @@
   </div>
 
   <div class="question-block">
-    <p class="question-label">How calm were you?</p>
+    <p class="question-label">{$_('mood_checkin.calm_q')}</p>
     <div class="emoji-scale">
       {#each calmEmojis as emoji, i}
         <button
@@ -90,15 +98,15 @@
 
   {#if showQ3}
     <div class="question-block">
-      <p class="question-label">What got under your skin?</p>
+      <p class="question-label">{$_('mood_checkin.skin_q')}</p>
       <div class="attribution-options">
-        {#each attributionOptions as option}
+        {#each attributionOptions as option, i}
           <button
             class="attribution-btn"
             class:selected={attribution === option}
             onclick={() => (attribution = attribution === option ? null : option)}
           >
-            {option}
+            {$_(attributionTKeys[i])}
           </button>
         {/each}
       </div>
@@ -107,14 +115,14 @@
 
   <div class="checkin-actions">
     <button class="skip-btn" onclick={skip} disabled={isSubmitting}>
-      Skip
+      {$_('mood_checkin.skip')}
     </button>
     <button
       class="submit-btn"
       onclick={submit}
       disabled={isSubmitting || energy === null || calm === null}
     >
-      {isSubmitting ? "Saving..." : "Submit"}
+      {isSubmitting ? $_('mood_checkin.saving') : $_('mood_checkin.submit')}
     </button>
   </div>
 </div>