From a30a27a4ecffee99ab8bad499fdbd5f2c27036be Mon Sep 17 00:00:00 2001
From: wukko <me@wukko.me>
Date: Fri, 20 Jun 2025 15:56:11 +0600
Subject: [PATCH] web/settings/metadata: add subtitles language dropdown

---
 web/i18n/en/settings.json                     |  5 +++++
 web/src/routes/settings/metadata/+page.svelte | 20 +++++++++++++++++++
 2 files changed, 25 insertions(+)

diff --git a/web/i18n/en/settings.json b/web/i18n/en/settings.json
index ad852176..974563d4 100644
--- a/web/i18n/en/settings.json
+++ b/web/i18n/en/settings.json
@@ -63,6 +63,11 @@
     "audio.youtube.dub.description": "cobalt will use a dubbed audio track for selected language if it's available. if not, original will be used instead.",
     "youtube.dub.original": "original",
 
+    "subtitles": "subtitles",
+    "subtitles.title": "preferred subtitle language",
+    "subtitles.description": "cobalt will add subtitles to the downloaded file in the preferred language if they're available. if not, nothing will be added.",
+    "subtitles.none": "none",
+
     "audio.youtube.better_audio": "youtube audio quality",
     "audio.youtube.better_audio.title": "prefer better quality",
     "audio.youtube.better_audio.description": "cobalt will try to pick highest quality audio in audio mode. it may not be available depending on youtube's response, current traffic, and server status. custom instances may not support this option.",
diff --git a/web/src/routes/settings/metadata/+page.svelte b/web/src/routes/settings/metadata/+page.svelte
index 48a2b433..944ec61c 100644
--- a/web/src/routes/settings/metadata/+page.svelte
+++ b/web/src/routes/settings/metadata/+page.svelte
@@ -1,6 +1,8 @@
 <script lang="ts">
+    import settings from "$lib/state/settings";
     import { t } from "$lib/i18n/translations";
 
+    import { namedSubtitleLanguages } from "$lib/settings/audio-sub-language";
     import { filenameStyleOptions, savingMethodOptions } from "$lib/types/settings";
 
     import SettingsCategory from "$components/settings/SettingsCategory.svelte";
@@ -8,6 +10,9 @@
     import SettingsButton from "$components/buttons/SettingsButton.svelte";
     import SettingsToggle from "$components/buttons/SettingsToggle.svelte";
     import FilenamePreview from "$components/settings/FilenamePreview.svelte";
+    import SettingsDropdown from "$components/settings/SettingsDropdown.svelte";
+
+    const displayLangs = namedSubtitleLanguages();
 </script>
 
 <SettingsCategory sectionId="filename" title={$t("settings.metadata.filename")}>
@@ -44,6 +49,21 @@
     </Switcher>
 </SettingsCategory>
 
+<SettingsCategory
+    sectionId="subtitles"
+    title={$t("settings.subtitles")}
+>
+    <SettingsDropdown
+        title={$t("settings.subtitles.title")}
+        description={$t("settings.subtitles.description")}
+        items={displayLangs}
+        settingContext="save"
+        settingId="subtitleLang"
+        selectedOption={$settings.save.subtitleLang}
+        selectedTitle={displayLangs[$settings.save.subtitleLang]}
+    />
+</SettingsCategory>
+
 <SettingsCategory
     sectionId="metadata"
     title={$t("settings.metadata.file")}