feat: Set File Date to First Aired Date

app/static/app.js

@@ -14,6 +14,9 @@
     modalFiles: [],
     modalSelectedFilePaths: new Set(),
     syncScrolling: false,
+    settings: {
+      set_file_date_to_first_aired_date: false,
+    },
   };
 
   const el = {
@@ -30,6 +33,11 @@
     seriesStatus: document.getElementById("seriesStatus"),
     seriesOverview: document.getElementById("seriesOverview"),
     seriesTvdbLink: document.getElementById("seriesTvdbLink"),
+    settingsBtn: document.getElementById("settingsBtn"),
+    settingsModal: document.getElementById("settingsModal"),
+    closeSettingsModalBtn: document.getElementById("closeSettingsModalBtn"),
+    saveSettingsBtn: document.getElementById("saveSettingsBtn"),
+    setFileDateToFirstAiredDateInput: document.getElementById("setFileDateToFirstAiredDateInput"),
     refreshEpisodesBtn: document.getElementById("refreshEpisodesBtn"),
     episodesList: document.getElementById("episodesList"),
     episodeMeta: document.getElementById("episodeMeta"),
@@ -199,6 +207,42 @@
     el.fileMeta.innerHTML = `Rows: <b>${fileCount}</b> <span class="${mismatch ? "mismatch" : ""}">${mismatchText}</span>`;
   }
 
+  function applySettingsToForm() {
+    el.setFileDateToFirstAiredDateInput.checked = !!state.settings.set_file_date_to_first_aired_date;
+  }
+
+  function openSettingsModal() {
+    applySettingsToForm();
+    el.settingsModal.classList.remove("hidden");
+    el.settingsModal.setAttribute("aria-hidden", "false");
+  }
+
+  function closeSettingsModal() {
+    el.settingsModal.classList.add("hidden");
+    el.settingsModal.setAttribute("aria-hidden", "true");
+  }
+
+  async function loadSettings() {
+    const data = await api("/api/session/settings");
+    state.settings = data.settings || { set_file_date_to_first_aired_date: false };
+    applySettingsToForm();
+  }
+
+  async function saveSettings() {
+    const payload = {
+      set_file_date_to_first_aired_date: !!el.setFileDateToFirstAiredDateInput.checked,
+    };
+    const data = await api("/api/session/settings", {
+      method: "PUT",
+      headers: { "Content-Type": "application/json" },
+      body: JSON.stringify(payload),
+    });
+    state.settings = data.settings || payload;
+    applySettingsToForm();
+    closeSettingsModal();
+    out("Settings saved", data);
+  }
+
   function selectPair(index) {
     state.selectedPairIndex = index;
     renderSelectedEpisodes();
@@ -557,6 +601,12 @@
 
   function bindEvents() {
     el.searchBtn.addEventListener("click", () => withHandler(doSearch, el.searchBtn));
+    el.settingsBtn.addEventListener("click", openSettingsModal);
+    el.closeSettingsModalBtn.addEventListener("click", closeSettingsModal);
+    el.saveSettingsBtn.addEventListener("click", () => withHandler(saveSettings, el.saveSettingsBtn));
+    el.settingsModal.addEventListener("click", (e) => {
+      if (e.target === el.settingsModal) closeSettingsModal();
+    });
     el.refreshEpisodesBtn.addEventListener("click", () => withHandler(loadEpisodes, el.refreshEpisodesBtn));
 
     el.refreshSelectedEpisodesBtn.addEventListener("click", () => withHandler(loadSelectedEpisodes, el.refreshSelectedEpisodesBtn));
@@ -611,6 +661,7 @@
     el.modalRecursiveInput.checked = true;
     renderSelectedSeriesDetails();
     bindEvents();
+    await loadSettings();
     await loadSelectedEpisodes();
     await loadSelectedFiles();
     await loadRoots();

app/static/styles.css

@@ -63,6 +63,11 @@ body {
   overflow: hidden;
 }
 
+#panelSearch .panel-body {
+  flex: 1;
+  min-height: 0;
+}
+
 .panel h2 {
   margin: 0 0 10px;
   font-size: 16px;
@@ -223,6 +228,10 @@ button.secondary {
   min-height: 40px;
 }
 
+.panel-search-footer {
+  justify-content: flex-end;
+}
+
 .mismatch {
   color: #b91c1c;
   font-weight: 700;
@@ -265,6 +274,29 @@ button.secondary {
   max-height: 280px;
 }
 
+.settings-card {
+  width: min(520px, 94vw);
+}
+
+.settings-section h4 {
+  margin: 0 0 8px;
+  font-size: 14px;
+  color: #1e293b;
+}
+
+.settings-check {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  font-size: 13px;
+  color: #334155;
+}
+
+.settings-actions {
+  justify-content: flex-end;
+  margin-top: 12px;
+}
+
 #panelSelectedEpisodes .panel-footer button:first-child,
 #panelSelectedEpisodes .panel-footer button:last-child,
 #panelSelectedFiles .panel-footer button:first-child,