plum-e2e 2.9.17 → 2.12.0

package/frontend/.svelte-kit/adapter-node/entries/pages/settings/_page.svelte.js

@@ -3,18 +3,38 @@
  * Licensed under the MIT License. See LICENSE file in the project root for details.
  */
 
-import { _ as store_get, a2 as copy_payload, a3 as assign_payload, $ as unsubscribe_stores, p as pop, a as push, Y as ensure_array_like, X as head, Z as stringify } from "../../../chunks/index.js";
+import { a0 as store_get, a2 as copy_payload, a3 as assign_payload, a1 as unsubscribe_stores, p as pop, a as push, Y as ensure_array_like, X as head, Z as stringify } from "../../../chunks/index.js";
 import "../../../chunks/client.js";
-import { A as API_BASE, M as MAX_TEST_RETRIES, B as BROWSERS } from "../../../chunks/constants.js";
+import { p as page } from "../../../chunks/stores.js";
+import { A as API_BASE, T as TOAST_TIMEOUT_MS, M as MAX_TEST_RETRIES, B as BROWSERS } from "../../../chunks/constants.js";
 import { a as auth } from "../../../chunks/auth.js";
-import { c as builtInEnabled } from "../../../chunks/runner.js";
+import { a as builtInEnabled } from "../../../chunks/runner.js";
 import { t as theme } from "../../../chunks/theme.js";
-import { T as Toast, B as Button } from "../../../chunks/Toast.js";
+import { B as Button } from "../../../chunks/Button.js";
+import { w as writable } from "../../../chunks/index2.js";
 import { C as ConfirmModal } from "../../../chunks/ConfirmModal.js";
 import { B as Badge } from "../../../chunks/Badge.js";
 import { a as SAVE_LABEL, b as CANCEL_LABEL, E as EDIT_LABEL, c as EMAIL_LABEL } from "../../../chunks/common.js";
 import { e as escape_html } from "../../../chunks/escaping.js";
 import { a as attr } from "../../../chunks/attributes.js";
+function authHeaders() {
+  return { Authorization: `Bearer ${auth.getToken()}` };
+}
+async function fetchS3Backups() {
+  const res = await fetch(`${API_BASE}/backup/s3-backups`, { headers: authHeaders() });
+  return res.json();
+}
+const notifications = writable([]);
+let seq = 0;
+function notify(type, message, { sticky = false, timeout = TOAST_TIMEOUT_MS } = {}) {
+  const id = ++seq;
+  notifications.update((list) => [...list, { id, type, message, sticky }]);
+  if (!sticky) setTimeout(() => dismissNotification(id), timeout);
+  return id;
+}
+function dismissNotification(id) {
+  notifications.update((list) => list.filter((n) => n.id !== id));
+}
 const PAGE_TITLE = "Settings — Plum";
 const HEADING = "Settings";
 const NAME_LABEL = "Name";
@@ -22,6 +42,13 @@ const PROJECT_LABEL = "Project";
 const RUNNERS_LABEL = "Runners";
 const REPOSITORY_NAV_LABEL = "Repository";
 const REPOSITORY_HEADING = "Test Repository";
+const TEST_CASES_NAV_LABEL = "Test Cases";
+const TEST_CASES_HEADING = "Test Cases";
+const TEST_CASES_DESC = "Bring test cases in from a Plum export file.";
+const TC_IMPORT_CARD_TITLE = "Import";
+const TC_IMPORT_DESC = "Upload a JSON file exported from Test Repository. Suites and cases are added as new records.";
+const TC_IMPORT_HINT = "A case is skipped when its ID already exists here. Cases with a different prefix or no ID are imported with a fresh ID.";
+const tcImportLabel = (importing) => "Import";
 const INTEGRATIONS_LABEL = "Integrations";
 const MCP_NAV_LABEL = "MCP";
 const MCP_HEADING = "MCP Integration";
@@ -90,7 +117,7 @@ const SLACK_WEBHOOK_LABEL = "Slack Webhook URL";
 const SLACK_WEBHOOK_HINT = "Leave blank to disable Slack notifications";
 const SLACK_WEBHOOK_PLACEHOLDER = "https://hooks.slack.com/services/…";
 const PUBLIC_URL_LABEL = "Public URL";
-const PUBLIC_URL_HINT = "Base URL of this Plum instance, used to link reports in notifications";
+const PUBLIC_URL_HINT = "Base URL of this Plum instance — used to link reports in notifications, and by remote runner nodes to stream live test output back here";
 const PUBLIC_URL_PLACEHOLDER = "https://plum.yourcompany.com";
 const CI_TRIGGERS_CARD_TITLE = "CI / External Triggers";
 const CI_DESC_PART1 = "Trigger a Plum run from GitHub Actions (e.g. on a pull request, against its preview deployment) or any other external script by calling";
@@ -132,8 +159,10 @@ const EXPORT_BLOCK_DESC_SUFFIX = "file with all cron jobs, test cases, test runs
 const IMPORT_BLOCK_TITLE = "Import";
 const IMPORT_BLOCK_DESC = "Restores all data from a previously exported backup. Existing records are overwritten. Cron jobs are re-scheduled after import.";
 const CHOOSE_FILE_LABEL = "Choose file…";
-const BACKUP_DISCLAIMER_PREFIX = "Reports are not included in backups. To back up report history, run";
-const BACKUP_DISCLAIMER_SUFFIX = "directly on the PostgreSQL volume.";
+const INCLUDE_REPORTS_LABEL = "Include reports & recordings";
+const INCLUDE_REPORTS_HINT = "Applies to both manual export and scheduled S3 backups. Can make backups significantly larger — recordings are session replays, not just screenshots.";
+const includeReportsDisclaimer = (included) => 'Reports are not included in backups — enable "Include reports & recordings" above, or run pg_dump directly on the PostgreSQL volume, to back up report history.';
+const saveIncludeReportsLabel = (saving) => SAVE_LABEL;
 const S3_STORAGE_CARD_TITLE = "S3 Storage";
 const S3_STORAGE_DESC_PREFIX = "Works with any S3-compatible provider — Cloudflare R2, Backblaze B2, AWS S3, or MinIO. Leave";
 const ENDPOINT_URL_LABEL = "Endpoint URL";
@@ -157,6 +186,13 @@ const SAVE_S3_CONFIG_LABEL = "Save S3 Config";
 const SECRET_KEY_REQUIRED_HINT = "Required";
 const SECRET_KEY_SET_PLACEHOLDER = "••••••••";
 const SECRET_KEY_UNSET_PLACEHOLDER = "Enter secret key";
+const RESTORE_FROM_S3_CARD_TITLE = "Restore from S3";
+const RESTORE_FROM_S3_DESC = "Restores directly from a backup already uploaded to S3 — no need to download it yourself first. Existing records are overwritten. Cron jobs are re-scheduled after restore.";
+const CONFIGURE_S3_FIRST_RESTORE_MESSAGE = "Configure S3 storage above to restore from it.";
+const NO_S3_BACKUPS_MESSAGE = "No backups found at this bucket/prefix.";
+const REFRESH_LABEL = "Refresh";
+const RESTORE_CONFIRM_TITLE = "Restore this backup?";
+const LIST_S3_BACKUPS_FAILED = "Failed to list S3 backups.";
 const SCHEDULED_BACKUP_CARD_TITLE = "Scheduled Backup";
 const CONFIGURE_S3_FIRST_MESSAGE = "Configure S3 storage above to enable scheduled backups.";
 const ENABLE_SCHEDULED_BACKUP_LABEL = "Enable scheduled backup";
@@ -175,18 +211,32 @@ const testConnectionLabel = (testing) => TEST_CONNECTION_LABEL;
 const saveS3ConfigLabel = (saving) => SAVE_S3_CONFIG_LABEL;
 const uploadS3NowLabel = (running) => UPLOAD_TO_S3_NOW_LABEL;
 const saveScheduleLabel = (saving) => SAVE_SCHEDULE_LABEL;
+const restoreLabel = (restoring) => restoring ? "Restoring…" : "Restore";
+const refreshingLabel = (loading) => loading ? "Loading…" : REFRESH_LABEL;
+const backupSizeLabel = (bytes) => `${(bytes / 1024).toFixed(1)} KB`;
 function _page($$payload, $$props) {
   push();
   var $$store_subs;
   let s3Configured, ciWorkflowSnippet, navItems;
-  let section = typeof sessionStorage !== "undefined" && sessionStorage.getItem("plum:settings:section") || "project";
+  const VALID_SECTIONS = /* @__PURE__ */ new Set([
+    "project",
+    "runners",
+    "repository",
+    "testcases",
+    "integrations",
+    "mcp",
+    "account",
+    "users",
+    "backup"
+  ]);
+  const querySection = store_get($$store_subs ??= {}, "$page", page).url.searchParams.get("section");
+  let section = VALID_SECTIONS.has(querySection) && querySection || typeof sessionStorage !== "undefined" && sessionStorage.getItem("plum:settings:section") || "project";
   let project = {
     name: "",
     logoUrl: "",
     maxRetries: 0
   };
   let projectSaving = false;
-  let toast = null;
   const TIMEZONES = (() => {
     try {
       return Intl.supportedValuesOf("timeZone");
@@ -229,12 +279,19 @@ function _page($$payload, $$props) {
     backupS3Bucket: "",
     backupS3AccessKey: "",
     backupS3SecretKey: "",
-    backupS3Prefix: ""
+    backupS3Prefix: "",
+    backupIncludeReports: false
   };
   let backupConfigSaving = false;
+  let includeReportsSaving = false;
   let backupS3SecretKeySet = false;
   let backupTestingS3 = false;
   let backupRunningNow = false;
+  let s3Backups = [];
+  let s3BackupsLoaded = false;
+  let loadingS3Backups = false;
+  let restoringKey = null;
+  let restoreConfirmOpen = false;
   let runners = [];
   let pingResults = {};
   let stoppingId = null;
@@ -246,10 +303,23 @@ function _page($$payload, $$props) {
     token: ""
   };
   let editFormSaving = false;
+  async function loadS3Backups() {
+    loadingS3Backups = true;
+    try {
+      const result = await fetchS3Backups();
+      if (result.error) throw new Error(result.error);
+      s3Backups = result.backups ?? [];
+    } catch (e) {
+      notify("error", e.message || LIST_S3_BACKUPS_FAILED);
+    } finally {
+      loadingS3Backups = false;
+    }
+  }
   const ADMIN_SECTIONS = /* @__PURE__ */ new Set([
     "project",
     "runners",
     "repository",
+    "testcases",
     "integrations",
     "mcp",
     "users",
@@ -259,6 +329,10 @@ function _page($$payload, $$props) {
     section = "account";
   }
   s3Configured = false;
+  if (s3Configured && !s3BackupsLoaded) {
+    s3BackupsLoaded = true;
+    loadS3Backups();
+  }
   JSON.stringify(
     {
       mcpServers: {
@@ -284,6 +358,7 @@ function _page($$payload, $$props) {
     { id: "project", label: PROJECT_LABEL },
     { id: "runners", label: RUNNERS_LABEL },
     { id: "repository", label: REPOSITORY_NAV_LABEL },
+    { id: "testcases", label: TEST_CASES_NAV_LABEL },
     { id: "integrations", label: INTEGRATIONS_LABEL },
     { id: "mcp", label: MCP_NAV_LABEL },
     { id: "account", label: ACCOUNT_LABEL },
@@ -297,28 +372,27 @@ function _page($$payload, $$props) {
     head($$payload2, ($$payload3) => {
       $$payload3.title = `<title>${escape_html(PAGE_TITLE)}</title>`;
     });
-    Toast($$payload2, { toast });
-    $$payload2.out += `<!----> <div class="page-header svelte-bpb2i4"><h1 class="svelte-bpb2i4">${escape_html(HEADING)}</h1></div> <div class="settings-layout svelte-bpb2i4"><aside class="settings-sidebar svelte-bpb2i4"><nav class="svelte-bpb2i4"><!--[-->`;
+    $$payload2.out += `<div class="page-header svelte-m3ck68"><h1 class="svelte-m3ck68">${escape_html(HEADING)}</h1></div> <div class="settings-layout svelte-m3ck68"><aside class="settings-sidebar svelte-m3ck68"><nav class="svelte-m3ck68"><!--[-->`;
     for (let $$index = 0, $$length = each_array.length; $$index < $$length; $$index++) {
       let item = each_array[$$index];
-      $$payload2.out += `<button${attr("class", `sidebar-item svelte-bpb2i4 ${stringify([section === item.id ? "active" : ""].filter(Boolean).join(" "))}`)}>${escape_html(item.label)}</button>`;
+      $$payload2.out += `<button${attr("class", `sidebar-item svelte-m3ck68 ${stringify([section === item.id ? "active" : ""].filter(Boolean).join(" "))}`)}>${escape_html(item.label)}</button>`;
     }
-    $$payload2.out += `<!--]--></nav></aside> <div class="settings-content svelte-bpb2i4">`;
+    $$payload2.out += `<!--]--></nav></aside> <div class="settings-content svelte-m3ck68">`;
     if (section === "project") {
       $$payload2.out += "<!--[-->";
       const each_array_1 = ensure_array_like(TIMEZONES);
-      $$payload2.out += `<div class="content-section svelte-bpb2i4"><div class="content-header svelte-bpb2i4"><h2 class="svelte-bpb2i4">${escape_html(PROJECT_LABEL)}</h2> <p class="content-desc svelte-bpb2i4">${escape_html(PROJECT_DESC)}</p></div> <div class="card settings-card svelte-bpb2i4"><div class="field"><label class="field-label svelte-bpb2i4" for="project-name">${escape_html(PROJECT_NAME_LABEL)}</label> <input id="project-name" type="text" class="field-input"${attr("value", project.name)}${attr("placeholder", PROJECT_NAME_PLACEHOLDER)}></div> <div class="field"><label class="field-label svelte-bpb2i4" for="project-logo"><span>${escape_html(LOGO_URL_LABEL)}</span> <span class="field-hint svelte-bpb2i4">${escape_html(LOGO_URL_HINT)}</span></label> <input id="project-logo" type="url" class="field-input"${attr("value", project.logoUrl)}${attr("placeholder", LOGO_URL_PLACEHOLDER)}></div> `;
+      $$payload2.out += `<div class="content-section svelte-m3ck68"><div class="content-header svelte-m3ck68"><h2 class="svelte-m3ck68">${escape_html(PROJECT_LABEL)}</h2> <p class="content-desc svelte-m3ck68">${escape_html(PROJECT_DESC)}</p></div> <div class="card settings-card svelte-m3ck68"><div class="field"><label class="field-label svelte-m3ck68" for="project-name">${escape_html(PROJECT_NAME_LABEL)}</label> <input id="project-name" type="text" class="field-input"${attr("value", project.name)}${attr("placeholder", PROJECT_NAME_PLACEHOLDER)}></div> <div class="field"><label class="field-label svelte-m3ck68" for="project-logo"><span>${escape_html(LOGO_URL_LABEL)}</span> <span class="field-hint svelte-m3ck68">${escape_html(LOGO_URL_HINT)}</span></label> <input id="project-logo" type="url" class="field-input"${attr("value", project.logoUrl)}${attr("placeholder", LOGO_URL_PLACEHOLDER)}></div> `;
       {
         $$payload2.out += "<!--[!-->";
       }
-      $$payload2.out += `<!--]--> <div class="field"><label class="field-label svelte-bpb2i4" for="project-timezone"><span>${escape_html(TIMEZONE_LABEL)}</span> <span class="field-hint svelte-bpb2i4">${escape_html(TIMEZONE_HINT)}</span></label> <select id="project-timezone" class="field-input"><!--[-->`;
+      $$payload2.out += `<!--]--> <div class="field"><label class="field-label svelte-m3ck68" for="project-timezone"><span>${escape_html(TIMEZONE_LABEL)}</span> <span class="field-hint svelte-m3ck68">${escape_html(TIMEZONE_HINT)}</span></label> <select id="project-timezone" class="field-input"><!--[-->`;
       for (let $$index_1 = 0, $$length = each_array_1.length; $$index_1 < $$length; $$index_1++) {
         let tz = each_array_1[$$index_1];
         $$payload2.out += `<option${attr("value", tz)}>${escape_html(tz)}</option>`;
       }
-      $$payload2.out += `<!--]--></select></div> <div class="field"><label class="field-label svelte-bpb2i4" for="project-max-retries"><span>${escape_html(RETRY_FAILED_TESTS_LABEL)}</span> <span class="field-hint svelte-bpb2i4">${escape_html(RETRY_FAILED_TESTS_HINT)}</span></label> <input id="project-max-retries" type="number" class="field-input" min="0"${attr("max", MAX_TEST_RETRIES)}${attr("value", project.maxRetries)}></div> <div class="toggle-row svelte-bpb2i4"><div class="toggle-info svelte-bpb2i4"><span class="toggle-label svelte-bpb2i4">${escape_html(DARK_MODE_LABEL)}</span> <span class="toggle-desc svelte-bpb2i4">${escape_html(DARK_MODE_DESC)}</span></div> <button${attr("class", `toggle-switch svelte-bpb2i4 ${stringify([
+      $$payload2.out += `<!--]--></select></div> <div class="field"><label class="field-label svelte-m3ck68" for="project-max-retries"><span>${escape_html(RETRY_FAILED_TESTS_LABEL)}</span> <span class="field-hint svelte-m3ck68">${escape_html(RETRY_FAILED_TESTS_HINT)}</span></label> <input id="project-max-retries" type="number" class="field-input" min="0"${attr("max", MAX_TEST_RETRIES)}${attr("value", project.maxRetries)}></div> <div class="toggle-row svelte-m3ck68"><div class="toggle-info svelte-m3ck68"><span class="toggle-label svelte-m3ck68">${escape_html(DARK_MODE_LABEL)}</span> <span class="toggle-desc svelte-m3ck68">${escape_html(DARK_MODE_DESC)}</span></div> <button${attr("class", `toggle-switch svelte-m3ck68 ${stringify([
         store_get($$store_subs ??= {}, "$theme", theme) === "dark" ? "on" : ""
-      ].filter(Boolean).join(" "))}`)} role="switch"${attr("aria-checked", store_get($$store_subs ??= {}, "$theme", theme) === "dark")}><span class="toggle-thumb svelte-bpb2i4"></span></button></div> <div class="card-footer svelte-bpb2i4">`;
+      ].filter(Boolean).join(" "))}`)} role="switch"${attr("aria-checked", store_get($$store_subs ??= {}, "$theme", theme) === "dark")}><span class="toggle-thumb svelte-m3ck68"></span></button></div> <div class="card-footer svelte-m3ck68">`;
       Button($$payload2, {
         disabled: projectSaving,
         children: ($$payload3) => {
@@ -331,20 +405,20 @@ function _page($$payload, $$props) {
       $$payload2.out += "<!--[!-->";
       if (section === "runners") {
         $$payload2.out += "<!--[-->";
-        $$payload2.out += `<div class="content-section svelte-bpb2i4"><div class="content-header svelte-bpb2i4"><h2 class="svelte-bpb2i4">${escape_html(RUNNERS_LABEL)}</h2> <p class="content-desc svelte-bpb2i4">${escape_html(RUNNERS_DESC)}</p></div> <div class="card settings-card svelte-bpb2i4"><div class="toggle-row svelte-bpb2i4"><div class="toggle-info svelte-bpb2i4"><span class="toggle-label svelte-bpb2i4">${escape_html(BUILTIN_RUNNER_TOGGLE_LABEL)}</span> <span class="toggle-desc svelte-bpb2i4">${escape_html(BUILTIN_RUNNER_TOGGLE_DESC)}</span></div> <button${attr("class", `toggle-switch svelte-bpb2i4 ${stringify([
+        $$payload2.out += `<div class="content-section svelte-m3ck68"><div class="content-header svelte-m3ck68"><h2 class="svelte-m3ck68">${escape_html(RUNNERS_LABEL)}</h2> <p class="content-desc svelte-m3ck68">${escape_html(RUNNERS_DESC)}</p></div> <div class="card settings-card svelte-m3ck68"><div class="toggle-row svelte-m3ck68"><div class="toggle-info svelte-m3ck68"><span class="toggle-label svelte-m3ck68">${escape_html(BUILTIN_RUNNER_TOGGLE_LABEL)}</span> <span class="toggle-desc svelte-m3ck68">${escape_html(BUILTIN_RUNNER_TOGGLE_DESC)}</span></div> <button${attr("class", `toggle-switch svelte-m3ck68 ${stringify([
           store_get($$store_subs ??= {}, "$builtInEnabled", builtInEnabled) ? "on" : ""
-        ].filter(Boolean).join(" "))}`)} role="switch"${attr("aria-checked", store_get($$store_subs ??= {}, "$builtInEnabled", builtInEnabled))}><span class="toggle-thumb svelte-bpb2i4"></span></button></div> `;
+        ].filter(Boolean).join(" "))}`)} role="switch"${attr("aria-checked", store_get($$store_subs ??= {}, "$builtInEnabled", builtInEnabled))}><span class="toggle-thumb svelte-m3ck68"></span></button></div> `;
         if (runners.length > 0) {
           $$payload2.out += "<!--[-->";
           const each_array_2 = ensure_array_like(runners);
-          $$payload2.out += `<div class="runner-cards svelte-bpb2i4"><!--[-->`;
+          $$payload2.out += `<div class="runner-cards svelte-m3ck68"><!--[-->`;
           for (let $$index_3 = 0, $$length = each_array_2.length; $$index_3 < $$length; $$index_3++) {
             let r = each_array_2[$$index_3];
             const ping = pingResults[r.id];
             if (editingId === r.id) {
               $$payload2.out += "<!--[-->";
               const each_array_3 = ensure_array_like(BROWSERS);
-              $$payload2.out += `<div class="runner-card editing svelte-bpb2i4"><div class="runner-form-fields svelte-bpb2i4"><div class="field"><label class="field-label svelte-bpb2i4"${attr("for", `edit-name-${stringify(r.id)}`)}>${escape_html(NAME_LABEL)}</label> <input${attr("id", `edit-name-${stringify(r.id)}`)} type="text" class="field-input"${attr("value", editForm.name)}${attr("placeholder", RUNNER_NAME_PLACEHOLDER)}></div> <div class="field"><label class="field-label svelte-bpb2i4"${attr("for", `edit-url-${stringify(r.id)}`)}>${escape_html(RUNNER_URL_LABEL)} <span class="field-hint svelte-bpb2i4">${escape_html(RUNNER_URL_HINT_PREFIX)} <code>host.docker.internal</code> ${escape_html(RUNNER_URL_HINT_SUFFIX)}</span></label> <input${attr("id", `edit-url-${stringify(r.id)}`)} type="url" class="field-input"${attr("value", editForm.url)}${attr("placeholder", RUNNER_URL_PLACEHOLDER)}></div> <div class="field"><label class="field-label svelte-bpb2i4"${attr("for", `edit-token-${stringify(r.id)}`)}>${escape_html(TOKEN_LABEL)}</label> <input${attr("id", `edit-token-${stringify(r.id)}`)} type="text" class="field-input"${attr("value", editForm.token)}${attr("placeholder", KEEP_TOKEN_PLACEHOLDER)} spellcheck="false" autocomplete="off"></div> <div class="field"><label class="field-label svelte-bpb2i4"${attr("for", `edit-browser-${stringify(r.id)}`)}>${escape_html(BROWSER_LABEL)}</label> <select${attr("id", `edit-browser-${stringify(r.id)}`)} class="field-input"><!--[-->`;
+              $$payload2.out += `<div class="runner-card editing svelte-m3ck68"><div class="runner-form-fields svelte-m3ck68"><div class="field"><label class="field-label svelte-m3ck68"${attr("for", `edit-name-${stringify(r.id)}`)}>${escape_html(NAME_LABEL)}</label> <input${attr("id", `edit-name-${stringify(r.id)}`)} type="text" class="field-input"${attr("value", editForm.name)}${attr("placeholder", RUNNER_NAME_PLACEHOLDER)}></div> <div class="field"><label class="field-label svelte-m3ck68"${attr("for", `edit-url-${stringify(r.id)}`)}>${escape_html(RUNNER_URL_LABEL)} <span class="field-hint svelte-m3ck68">${escape_html(RUNNER_URL_HINT_PREFIX)} <code>host.docker.internal</code> ${escape_html(RUNNER_URL_HINT_SUFFIX)}</span></label> <input${attr("id", `edit-url-${stringify(r.id)}`)} type="url" class="field-input"${attr("value", editForm.url)}${attr("placeholder", RUNNER_URL_PLACEHOLDER)}></div> <div class="field"><label class="field-label svelte-m3ck68"${attr("for", `edit-token-${stringify(r.id)}`)}>${escape_html(TOKEN_LABEL)}</label> <input${attr("id", `edit-token-${stringify(r.id)}`)} type="text" class="field-input"${attr("value", editForm.token)}${attr("placeholder", KEEP_TOKEN_PLACEHOLDER)} spellcheck="false" autocomplete="off"></div> <div class="field"><label class="field-label svelte-m3ck68"${attr("for", `edit-browser-${stringify(r.id)}`)}>${escape_html(BROWSER_LABEL)}</label> <select${attr("id", `edit-browser-${stringify(r.id)}`)} class="field-input"><!--[-->`;
               for (let $$index_2 = 0, $$length2 = each_array_3.length; $$index_2 < $$length2; $$index_2++) {
                 let b = each_array_3[$$index_2];
                 $$payload2.out += `<option${attr("value", b.id)}>${escape_html(b.label)}</option>`;
@@ -353,7 +427,7 @@ function _page($$payload, $$props) {
               {
                 $$payload2.out += "<!--[!-->";
               }
-              $$payload2.out += `<!--]--> <div class="runner-form-actions svelte-bpb2i4">`;
+              $$payload2.out += `<!--]--> <div class="runner-form-actions svelte-m3ck68">`;
               Button($$payload2, {
                 disabled: editFormSaving,
                 children: ($$payload3) => {
@@ -373,28 +447,28 @@ function _page($$payload, $$props) {
               $$payload2.out += `<!----></div></div>`;
             } else {
               $$payload2.out += "<!--[!-->";
-              $$payload2.out += `<div class="runner-card svelte-bpb2i4"><div class="runner-card-header svelte-bpb2i4"><svg class="runner-card-icon svelte-bpb2i4" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><rect x="2" y="3" width="20" height="14" rx="2"></rect><path d="M8 21h8M12 17v4"></path></svg> <span class="runner-card-name svelte-bpb2i4">${escape_html(r.name)}</span> <span class="runner-browser-pill svelte-bpb2i4">${escape_html(r.browser)}</span> `;
+              $$payload2.out += `<div class="runner-card svelte-m3ck68"><div class="runner-card-header svelte-m3ck68"><svg class="runner-card-icon svelte-m3ck68" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"><rect x="2" y="3" width="20" height="14" rx="2"></rect><path d="M8 21h8M12 17v4"></path></svg> <span class="runner-card-name svelte-m3ck68">${escape_html(r.name)}</span> <span class="runner-browser-pill svelte-m3ck68">${escape_html(r.browser)}</span> `;
               if (ping && !ping.loading) {
                 $$payload2.out += "<!--[-->";
                 if (ping.ok) {
                   $$payload2.out += "<!--[-->";
-                  $$payload2.out += `<span class="ping-badge ok svelte-bpb2i4">${escape_html(ping.latency)}ms</span>`;
+                  $$payload2.out += `<span class="ping-badge ok svelte-m3ck68">${escape_html(ping.latency)}ms</span>`;
                 } else {
                   $$payload2.out += "<!--[!-->";
-                  $$payload2.out += `<span class="ping-badge fail svelte-bpb2i4"${attr("title", ping.error)}>${escape_html(RUNNER_UNREACHABLE_LABEL)}</span>`;
+                  $$payload2.out += `<span class="ping-badge fail svelte-m3ck68"${attr("title", ping.error)}>${escape_html(RUNNER_UNREACHABLE_LABEL)}</span>`;
                 }
                 $$payload2.out += `<!--]-->`;
               } else {
                 $$payload2.out += "<!--[!-->";
                 if (ping?.loading) {
                   $$payload2.out += "<!--[-->";
-                  $$payload2.out += `<span class="ping-badge pinging svelte-bpb2i4">${escape_html(RUNNER_PINGING_LABEL)}</span>`;
+                  $$payload2.out += `<span class="ping-badge pinging svelte-m3ck68">${escape_html(RUNNER_PINGING_LABEL)}</span>`;
                 } else {
                   $$payload2.out += "<!--[!-->";
                 }
                 $$payload2.out += `<!--]-->`;
               }
-              $$payload2.out += `<!--]--></div> <p class="runner-card-url svelte-bpb2i4">${escape_html(r.url)}</p> <div class="runner-card-actions svelte-bpb2i4">`;
+              $$payload2.out += `<!--]--></div> <p class="runner-card-url svelte-m3ck68">${escape_html(r.url)}</p> <div class="runner-card-actions svelte-m3ck68">`;
               Button($$payload2, {
                 variant: "ghost",
                 size: "sm",
@@ -443,7 +517,7 @@ function _page($$payload, $$props) {
         $$payload2.out += `<!--]--> `;
         {
           $$payload2.out += "<!--[!-->";
-          $$payload2.out += `<div class="card-footer svelte-bpb2i4">`;
+          $$payload2.out += `<div class="card-footer svelte-m3ck68">`;
           Button($$payload2, {
             variant: "ghost",
             children: ($$payload3) => {
@@ -458,7 +532,7 @@ function _page($$payload, $$props) {
         $$payload2.out += "<!--[!-->";
         if (section === "repository") {
           $$payload2.out += "<!--[-->";
-          $$payload2.out += `<div class="content-section svelte-bpb2i4"><div class="content-header svelte-bpb2i4"><h2 class="svelte-bpb2i4">${escape_html(REPOSITORY_HEADING)}</h2> <p class="content-desc svelte-bpb2i4">${escape_html(REPOSITORY_DESC)}</p></div> <div class="card settings-card svelte-bpb2i4"><div class="field-row svelte-bpb2i4"><div class="field"><label class="field-label svelte-bpb2i4" for="tc-prefix">${escape_html(CASE_PREFIX_LABEL)}</label> <input id="tc-prefix" type="text" class="field-input mono svelte-bpb2i4"${attr("value", prefixes.testCasePrefix)}${attr("placeholder", CASE_PREFIX_PLACEHOLDER)} maxlength="10"></div> <div class="field"><label class="field-label svelte-bpb2i4" for="ts-prefix">${escape_html(SUITE_PREFIX_LABEL)}</label> <input id="ts-prefix" type="text" class="field-input mono svelte-bpb2i4"${attr("value", prefixes.testSuitePrefix)}${attr("placeholder", SUITE_PREFIX_PLACEHOLDER)} maxlength="10"></div></div> <p class="content-desc svelte-bpb2i4">${escape_html(EXAMPLES_LABEL)} <code class="code-sample svelte-bpb2i4">${escape_html(prefixes.testCasePrefix)}-001</code>, <code class="code-sample svelte-bpb2i4">${escape_html(prefixes.testSuitePrefix)}-001</code></p> <div class="card-footer svelte-bpb2i4">`;
+          $$payload2.out += `<div class="content-section svelte-m3ck68"><div class="content-header svelte-m3ck68"><h2 class="svelte-m3ck68">${escape_html(REPOSITORY_HEADING)}</h2> <p class="content-desc svelte-m3ck68">${escape_html(REPOSITORY_DESC)}</p></div> <div class="card settings-card svelte-m3ck68"><div class="field-row svelte-m3ck68"><div class="field"><label class="field-label svelte-m3ck68" for="tc-prefix">${escape_html(CASE_PREFIX_LABEL)}</label> <input id="tc-prefix" type="text" class="field-input mono svelte-m3ck68"${attr("value", prefixes.testCasePrefix)}${attr("placeholder", CASE_PREFIX_PLACEHOLDER)} maxlength="10"></div> <div class="field"><label class="field-label svelte-m3ck68" for="ts-prefix">${escape_html(SUITE_PREFIX_LABEL)}</label> <input id="ts-prefix" type="text" class="field-input mono svelte-m3ck68"${attr("value", prefixes.testSuitePrefix)}${attr("placeholder", SUITE_PREFIX_PLACEHOLDER)} maxlength="10"></div></div> <p class="content-desc svelte-m3ck68">${escape_html(EXAMPLES_LABEL)} <code class="code-sample svelte-m3ck68">${escape_html(prefixes.testCasePrefix)}-001</code>, <code class="code-sample svelte-m3ck68">${escape_html(prefixes.testSuitePrefix)}-001</code></p> <div class="card-footer svelte-m3ck68">`;
           Button($$payload2, {
             disabled: prefixesSaving,
             children: ($$payload3) => {
@@ -466,7 +540,7 @@ function _page($$payload, $$props) {
             },
             $$slots: { default: true }
           });
-          $$payload2.out += `<!----></div></div> <div class="content-header svelte-bpb2i4" style="margin-top: 1rem"><h2 class="svelte-bpb2i4">${escape_html(MIGRATE_IDS_HEADING)}</h2> <p class="content-desc svelte-bpb2i4">${escape_html(MIGRATE_DESC_PREFIX)} <strong>${escape_html(MIGRATE_DESC_STRONG)}</strong> ${escape_html(MIGRATE_DESC_SUFFIX)}</p></div> <div class="card settings-card svelte-bpb2i4"><div class="field-row svelte-bpb2i4"><div class="field"><label class="field-label svelte-bpb2i4" for="mig-tc">${escape_html(NEW_CASE_PREFIX_LABEL)}</label> <input id="mig-tc" type="text" class="field-input mono svelte-bpb2i4"${attr("value", migrateForm.testCasePrefix)}${attr("placeholder", prefixes.testCasePrefix)} maxlength="10"></div> <div class="field"><label class="field-label svelte-bpb2i4" for="mig-ts">${escape_html(NEW_SUITE_PREFIX_LABEL)}</label> <input id="mig-ts" type="text" class="field-input mono svelte-bpb2i4"${attr("value", migrateForm.testSuitePrefix)}${attr("placeholder", prefixes.testSuitePrefix)} maxlength="10"></div></div> <div class="card-footer svelte-bpb2i4">`;
+          $$payload2.out += `<!----></div></div> <div class="content-header svelte-m3ck68" style="margin-top: 1rem"><h2 class="svelte-m3ck68">${escape_html(MIGRATE_IDS_HEADING)}</h2> <p class="content-desc svelte-m3ck68">${escape_html(MIGRATE_DESC_PREFIX)} <strong>${escape_html(MIGRATE_DESC_STRONG)}</strong> ${escape_html(MIGRATE_DESC_SUFFIX)}</p></div> <div class="card settings-card svelte-m3ck68"><div class="field-row svelte-m3ck68"><div class="field"><label class="field-label svelte-m3ck68" for="mig-tc">${escape_html(NEW_CASE_PREFIX_LABEL)}</label> <input id="mig-tc" type="text" class="field-input mono svelte-m3ck68"${attr("value", migrateForm.testCasePrefix)}${attr("placeholder", prefixes.testCasePrefix)} maxlength="10"></div> <div class="field"><label class="field-label svelte-m3ck68" for="mig-ts">${escape_html(NEW_SUITE_PREFIX_LABEL)}</label> <input id="mig-ts" type="text" class="field-input mono svelte-m3ck68"${attr("value", migrateForm.testSuitePrefix)}${attr("placeholder", prefixes.testSuitePrefix)} maxlength="10"></div></div> <div class="card-footer svelte-m3ck68">`;
           Button($$payload2, {
             variant: "ghost",
             disabled: migrating,
@@ -478,207 +552,204 @@ function _page($$payload, $$props) {
           $$payload2.out += `<!----></div></div></div>`;
         } else {
           $$payload2.out += "<!--[!-->";
-          if (section === "integrations") {
+          if (section === "testcases") {
             $$payload2.out += "<!--[-->";
-            $$payload2.out += `<div class="content-section svelte-bpb2i4"><div class="content-header svelte-bpb2i4"><h2 class="svelte-bpb2i4">${escape_html(INTEGRATIONS_LABEL)}</h2> <p class="content-desc svelte-bpb2i4">${escape_html(INTEGRATIONS_DESC)}</p></div> <div class="card settings-card svelte-bpb2i4"><p class="card-title">${escape_html(WEBHOOKS_CARD_TITLE)}</p> <div class="field"><label class="field-label svelte-bpb2i4" for="discord-url"><span>${escape_html(DISCORD_WEBHOOK_LABEL)}</span> <span class="field-hint svelte-bpb2i4">${escape_html(DISCORD_WEBHOOK_HINT)}</span></label> <input id="discord-url" type="url" class="field-input"${attr("value", integrations.discordWebhookUrl)}${attr("placeholder", DISCORD_WEBHOOK_PLACEHOLDER)}></div> <div class="field"><label class="field-label svelte-bpb2i4" for="slack-url"><span>${escape_html(SLACK_WEBHOOK_LABEL)}</span> <span class="field-hint svelte-bpb2i4">${escape_html(SLACK_WEBHOOK_HINT)}</span></label> <input id="slack-url" type="url" class="field-input"${attr("value", integrations.slackWebhookUrl)}${attr("placeholder", SLACK_WEBHOOK_PLACEHOLDER)}></div> <div class="field"><label class="field-label svelte-bpb2i4" for="public-url"><span>${escape_html(PUBLIC_URL_LABEL)}</span> <span class="field-hint svelte-bpb2i4">${escape_html(PUBLIC_URL_HINT)}</span></label> <input id="public-url" type="url" class="field-input"${attr("value", integrations.notifyPublicUrl)}${attr("placeholder", PUBLIC_URL_PLACEHOLDER)}></div> `;
+            $$payload2.out += `<div class="content-section svelte-m3ck68"><div class="content-header svelte-m3ck68"><h2 class="svelte-m3ck68">${escape_html(TEST_CASES_HEADING)}</h2> <p class="content-desc svelte-m3ck68">${escape_html(TEST_CASES_DESC)}</p></div> <div class="card settings-card svelte-m3ck68"><p class="card-title">${escape_html(TC_IMPORT_CARD_TITLE)}</p> <div class="backup-block svelte-m3ck68"><p class="backup-block-desc svelte-m3ck68">${escape_html(TC_IMPORT_DESC)}</p> <div class="import-row svelte-m3ck68"><label class="file-label svelte-m3ck68"><input type="file" accept=".json,application/json" class="file-input-hidden svelte-m3ck68"> <span class="file-btn svelte-m3ck68">${escape_html(CHOOSE_FILE_LABEL)}</span></label> `;
             Button($$payload2, {
-              disabled: integrationsSaving,
+              disabled: true,
               children: ($$payload3) => {
-                $$payload3.out += `<!---->${escape_html(saveIntegrationsLabel())}`;
+                $$payload3.out += `<!---->${escape_html(tcImportLabel())}`;
               },
               $$slots: { default: true }
             });
-            $$payload2.out += `<!----></div> <div class="card settings-card svelte-bpb2i4"><p class="card-title">${escape_html(CI_TRIGGERS_CARD_TITLE)}</p> <p class="content-desc svelte-bpb2i4">${escape_html(CI_DESC_PART1)} <code class="code-sample svelte-bpb2i4">POST ${escape_html(API_BASE)}/trigger</code> ${escape_html(CI_DESC_PART2)} <code class="code-sample svelte-bpb2i4">Authorization: ApiKey …</code> ${escape_html(CI_DESC_PART3)} <button class="link-btn svelte-bpb2i4">${escape_html(MCP_TAB_LINK_LABEL)}</button> ${escape_html(CI_DESC_PART4)} `;
-            Badge($$payload2, {
-              variant: "external",
-              children: ($$payload3) => {
-                $$payload3.out += `<!---->${escape_html(EXTERNAL_BADGE_LABEL)}`;
-              },
-              $$slots: { default: true }
-            });
-            $$payload2.out += `<!---->.</p> <pre class="mcp-snippet svelte-bpb2i4">${escape_html(ciWorkflowSnippet)}</pre> <div class="card-footer svelte-bpb2i4">`;
-            Button($$payload2, {
-              variant: "ghost",
-              children: ($$payload3) => {
-                $$payload3.out += `<!---->${escape_html(copyCiSnippetLabel())}`;
-              },
-              $$slots: { default: true }
-            });
-            $$payload2.out += `<!----></div></div></div>`;
+            $$payload2.out += `<!----></div> `;
+            {
+              $$payload2.out += "<!--[!-->";
+            }
+            $$payload2.out += `<!--]--> <p class="backup-block-desc svelte-m3ck68">${escape_html(TC_IMPORT_HINT)}</p></div></div></div>`;
           } else {
             $$payload2.out += "<!--[!-->";
-            if (section === "mcp") {
+            if (section === "integrations") {
               $$payload2.out += "<!--[-->";
-              $$payload2.out += `<div class="content-section svelte-bpb2i4"><div class="content-header svelte-bpb2i4"><h2 class="svelte-bpb2i4">${escape_html(MCP_HEADING)}</h2> <p class="content-desc svelte-bpb2i4">${escape_html(MCP_DESC)}</p></div> <div class="card settings-card svelte-bpb2i4"><p class="card-title">${escape_html(API_KEY_CARD_TITLE)}</p> `;
-              {
-                $$payload2.out += "<!--[-->";
-                $$payload2.out += `<p class="content-desc svelte-bpb2i4">${escape_html(NO_KEY_GENERATED_MESSAGE)}</p> <div class="card-footer svelte-bpb2i4">`;
-                Button($$payload2, {
-                  disabled: mcpGenerating,
-                  children: ($$payload3) => {
-                    $$payload3.out += `<!---->${escape_html(generateKeyLabel())}`;
-                  },
-                  $$slots: { default: true }
-                });
-                $$payload2.out += `<!----></div>`;
-              }
-              $$payload2.out += `<!--]--></div> `;
-              {
-                $$payload2.out += "<!--[!-->";
-              }
-              $$payload2.out += `<!--]--></div>`;
+              $$payload2.out += `<div class="content-section svelte-m3ck68"><div class="content-header svelte-m3ck68"><h2 class="svelte-m3ck68">${escape_html(INTEGRATIONS_LABEL)}</h2> <p class="content-desc svelte-m3ck68">${escape_html(INTEGRATIONS_DESC)}</p></div> <div class="card settings-card svelte-m3ck68"><p class="card-title">${escape_html(WEBHOOKS_CARD_TITLE)}</p> <div class="field"><label class="field-label svelte-m3ck68" for="discord-url"><span>${escape_html(DISCORD_WEBHOOK_LABEL)}</span> <span class="field-hint svelte-m3ck68">${escape_html(DISCORD_WEBHOOK_HINT)}</span></label> <input id="discord-url" type="url" class="field-input"${attr("value", integrations.discordWebhookUrl)}${attr("placeholder", DISCORD_WEBHOOK_PLACEHOLDER)}></div> <div class="field"><label class="field-label svelte-m3ck68" for="slack-url"><span>${escape_html(SLACK_WEBHOOK_LABEL)}</span> <span class="field-hint svelte-m3ck68">${escape_html(SLACK_WEBHOOK_HINT)}</span></label> <input id="slack-url" type="url" class="field-input"${attr("value", integrations.slackWebhookUrl)}${attr("placeholder", SLACK_WEBHOOK_PLACEHOLDER)}></div> <div class="field"><label class="field-label svelte-m3ck68" for="public-url"><span>${escape_html(PUBLIC_URL_LABEL)}</span> <span class="field-hint svelte-m3ck68">${escape_html(PUBLIC_URL_HINT)}</span></label> <input id="public-url" type="url" class="field-input"${attr("value", integrations.notifyPublicUrl)}${attr("placeholder", PUBLIC_URL_PLACEHOLDER)}></div> `;
+              Button($$payload2, {
+                disabled: integrationsSaving,
+                children: ($$payload3) => {
+                  $$payload3.out += `<!---->${escape_html(saveIntegrationsLabel())}`;
+                },
+                $$slots: { default: true }
+              });
+              $$payload2.out += `<!----></div> <div class="card settings-card svelte-m3ck68"><p class="card-title">${escape_html(CI_TRIGGERS_CARD_TITLE)}</p> <p class="content-desc svelte-m3ck68">${escape_html(CI_DESC_PART1)} <code class="code-sample svelte-m3ck68">POST ${escape_html(API_BASE)}/trigger</code> ${escape_html(CI_DESC_PART2)} <code class="code-sample svelte-m3ck68">Authorization: ApiKey …</code> ${escape_html(CI_DESC_PART3)} <button class="link-btn svelte-m3ck68">${escape_html(MCP_TAB_LINK_LABEL)}</button> ${escape_html(CI_DESC_PART4)} `;
+              Badge($$payload2, {
+                variant: "external",
+                children: ($$payload3) => {
+                  $$payload3.out += `<!---->${escape_html(EXTERNAL_BADGE_LABEL)}`;
+                },
+                $$slots: { default: true }
+              });
+              $$payload2.out += `<!---->.</p> <pre class="mcp-snippet svelte-m3ck68">${escape_html(ciWorkflowSnippet)}</pre> <div class="card-footer svelte-m3ck68">`;
+              Button($$payload2, {
+                variant: "ghost",
+                children: ($$payload3) => {
+                  $$payload3.out += `<!---->${escape_html(copyCiSnippetLabel())}`;
+                },
+                $$slots: { default: true }
+              });
+              $$payload2.out += `<!----></div></div></div>`;
             } else {
               $$payload2.out += "<!--[!-->";
-              if (section === "account") {
+              if (section === "mcp") {
                 $$payload2.out += "<!--[-->";
-                $$payload2.out += `<div class="content-section svelte-bpb2i4"><div class="content-header svelte-bpb2i4"><h2 class="svelte-bpb2i4">${escape_html(ACCOUNT_LABEL)}</h2> <p class="content-desc svelte-bpb2i4">${escape_html(ACCOUNT_DESC)}</p></div> <div class="card settings-card svelte-bpb2i4"><p class="card-title">${escape_html(PROFILE_CARD_TITLE)}</p> <div class="field"><label class="field-label svelte-bpb2i4" for="profile-name">${escape_html(NAME_LABEL)}</label> <input id="profile-name" type="text" class="field-input"${attr("value", profileForm.name)}></div> <div class="field"><label class="field-label svelte-bpb2i4" for="profile-email">${escape_html(EMAIL_LABEL)}</label> <input id="profile-email" type="email" class="field-input"${attr("value", profileForm.email)}></div> `;
+                $$payload2.out += `<div class="content-section svelte-m3ck68"><div class="content-header svelte-m3ck68"><h2 class="svelte-m3ck68">${escape_html(MCP_HEADING)}</h2> <p class="content-desc svelte-m3ck68">${escape_html(MCP_DESC)}</p></div> <div class="card settings-card svelte-m3ck68"><p class="card-title">${escape_html(API_KEY_CARD_TITLE)}</p> `;
                 {
-                  $$payload2.out += "<!--[!-->";
+                  $$payload2.out += "<!--[-->";
+                  $$payload2.out += `<p class="content-desc svelte-m3ck68">${escape_html(NO_KEY_GENERATED_MESSAGE)}</p> <div class="card-footer svelte-m3ck68">`;
+                  Button($$payload2, {
+                    disabled: mcpGenerating,
+                    children: ($$payload3) => {
+                      $$payload3.out += `<!---->${escape_html(generateKeyLabel())}`;
+                    },
+                    $$slots: { default: true }
+                  });
+                  $$payload2.out += `<!----></div>`;
                 }
-                $$payload2.out += `<!--]--> <div class="card-footer svelte-bpb2i4">`;
-                Button($$payload2, {
-                  disabled: true,
-                  children: ($$payload3) => {
-                    $$payload3.out += `<!---->${escape_html(saveProfileLabel())}`;
-                  },
-                  $$slots: { default: true }
-                });
-                $$payload2.out += `<!----></div></div> <div class="card settings-card svelte-bpb2i4"><p class="card-title">${escape_html(CHANGE_PASSWORD_CARD_TITLE)}</p> <div class="field"><label class="field-label svelte-bpb2i4" for="pw-current">${escape_html(CURRENT_PASSWORD_LABEL)}</label> <input id="pw-current" type="password" class="field-input"${attr("value", pwForm.currentPassword)} autocomplete="current-password"></div> <div class="field"><label class="field-label svelte-bpb2i4" for="pw-new">${escape_html(NEW_PASSWORD_LABEL)}</label> <input id="pw-new" type="password" class="field-input"${attr("value", pwForm.newPassword)} autocomplete="new-password"></div> <div class="field"><label class="field-label svelte-bpb2i4" for="pw-confirm">${escape_html(CONFIRM_NEW_PASSWORD_LABEL)}</label> <input id="pw-confirm" type="password" class="field-input"${attr("value", pwForm.confirmPassword)} autocomplete="new-password"></div> `;
+                $$payload2.out += `<!--]--></div> `;
                 {
                   $$payload2.out += "<!--[!-->";
                 }
-                $$payload2.out += `<!--]--> <div class="card-footer svelte-bpb2i4">`;
-                Button($$payload2, {
-                  disabled: true,
-                  children: ($$payload3) => {
-                    $$payload3.out += `<!---->${escape_html(changePasswordLabel())}`;
-                  },
-                  $$slots: { default: true }
-                });
-                $$payload2.out += `<!----></div></div> <div class="card settings-card svelte-bpb2i4"><div class="card-footer svelte-bpb2i4">`;
-                Button($$payload2, {
-                  variant: "danger",
-                  size: "sm",
-                  children: ($$payload3) => {
-                    $$payload3.out += `<!---->${escape_html(SIGN_OUT_LABEL)}`;
-                  },
-                  $$slots: { default: true }
-                });
-                $$payload2.out += `<!----></div></div></div>`;
+                $$payload2.out += `<!--]--></div>`;
               } else {
                 $$payload2.out += "<!--[!-->";
-                if (section === "users") {
+                if (section === "account") {
                   $$payload2.out += "<!--[-->";
-                  $$payload2.out += `<div class="content-section svelte-bpb2i4"><div class="content-header svelte-bpb2i4"><h2 class="svelte-bpb2i4">${escape_html(USERS_LABEL)}</h2> <p class="content-desc svelte-bpb2i4">${escape_html(USERS_DESC)}</p></div> `;
-                  ConfirmModal($$payload2, {
-                    title: REMOVE_USER_MODAL_TITLE,
-                    confirmLabel: REMOVE_USER_LABEL,
-                    get open() {
-                      return confirmDeleteUserOpen;
-                    },
-                    set open($$value) {
-                      confirmDeleteUserOpen = $$value;
-                      $$settled = false;
-                    },
+                  $$payload2.out += `<div class="content-section svelte-m3ck68"><div class="content-header svelte-m3ck68"><h2 class="svelte-m3ck68">${escape_html(ACCOUNT_LABEL)}</h2> <p class="content-desc svelte-m3ck68">${escape_html(ACCOUNT_DESC)}</p></div> <div class="card settings-card svelte-m3ck68"><p class="card-title">${escape_html(PROFILE_CARD_TITLE)}</p> <div class="field"><label class="field-label svelte-m3ck68" for="profile-name">${escape_html(NAME_LABEL)}</label> <input id="profile-name" type="text" class="field-input"${attr("value", profileForm.name)}></div> <div class="field"><label class="field-label svelte-m3ck68" for="profile-email">${escape_html(EMAIL_LABEL)}</label> <input id="profile-email" type="email" class="field-input"${attr("value", profileForm.email)}></div> `;
+                  {
+                    $$payload2.out += "<!--[!-->";
+                  }
+                  $$payload2.out += `<!--]--> <div class="card-footer svelte-m3ck68">`;
+                  Button($$payload2, {
+                    disabled: true,
                     children: ($$payload3) => {
-                      {
-                        $$payload3.out += "<!--[!-->";
-                      }
-                      $$payload3.out += `<!--]-->`;
+                      $$payload3.out += `<!---->${escape_html(saveProfileLabel())}`;
                     },
                     $$slots: { default: true }
                   });
-                  $$payload2.out += `<!----> <div class="card settings-card svelte-bpb2i4"><p class="card-title">${escape_html(ADD_USER_CARD_TITLE)}</p> <div class="field-row svelte-bpb2i4"><div class="field"><label class="field-label svelte-bpb2i4" for="u-name">${escape_html(NAME_LABEL)}</label> <input id="u-name" type="text" class="field-input"${attr("value", userForm.name)}${attr("placeholder", USER_NAME_PLACEHOLDER)}></div> <div class="field"><label class="field-label svelte-bpb2i4" for="u-email">${escape_html(EMAIL_LABEL)}</label> <input id="u-email" type="email" class="field-input"${attr("value", userForm.email)}${attr("placeholder", USER_EMAIL_PLACEHOLDER)}></div></div> <div class="field-row svelte-bpb2i4"><div class="field"><label class="field-label svelte-bpb2i4" for="u-pw">${escape_html(PASSWORD_LABEL)}</label> <input id="u-pw" type="password" class="field-input"${attr("value", userForm.password)} autocomplete="new-password"></div> <div class="field"><label class="field-label svelte-bpb2i4" for="u-role">${escape_html(ROLE_LABEL)}</label> <select id="u-role" class="field-input"><option value="user">${escape_html(USER_ROLE_OPTION)}</option><option value="admin">${escape_html(ADMIN_ROLE_OPTION)}</option></select></div></div> `;
+                  $$payload2.out += `<!----></div></div> <div class="card settings-card svelte-m3ck68"><p class="card-title">${escape_html(CHANGE_PASSWORD_CARD_TITLE)}</p> <div class="field"><label class="field-label svelte-m3ck68" for="pw-current">${escape_html(CURRENT_PASSWORD_LABEL)}</label> <input id="pw-current" type="password" class="field-input"${attr("value", pwForm.currentPassword)} autocomplete="current-password"></div> <div class="field"><label class="field-label svelte-m3ck68" for="pw-new">${escape_html(NEW_PASSWORD_LABEL)}</label> <input id="pw-new" type="password" class="field-input"${attr("value", pwForm.newPassword)} autocomplete="new-password"></div> <div class="field"><label class="field-label svelte-m3ck68" for="pw-confirm">${escape_html(CONFIRM_NEW_PASSWORD_LABEL)}</label> <input id="pw-confirm" type="password" class="field-input"${attr("value", pwForm.confirmPassword)} autocomplete="new-password"></div> `;
                   {
                     $$payload2.out += "<!--[!-->";
                   }
-                  $$payload2.out += `<!--]--> <div class="card-footer svelte-bpb2i4">`;
+                  $$payload2.out += `<!--]--> <div class="card-footer svelte-m3ck68">`;
                   Button($$payload2, {
-                    disabled: userFormSaving,
+                    disabled: true,
                     children: ($$payload3) => {
-                      $$payload3.out += `<!---->${escape_html(addUserLabel())}`;
+                      $$payload3.out += `<!---->${escape_html(changePasswordLabel())}`;
                     },
                     $$slots: { default: true }
                   });
-                  $$payload2.out += `<!----></div></div> `;
-                  if (allUsers.length > 0) {
-                    $$payload2.out += "<!--[-->";
-                    const each_array_5 = ensure_array_like(allUsers);
-                    $$payload2.out += `<div class="users-table svelte-bpb2i4"><!--[-->`;
-                    for (let $$index_5 = 0, $$length = each_array_5.length; $$index_5 < $$length; $$index_5++) {
-                      let u = each_array_5[$$index_5];
-                      $$payload2.out += `<div class="user-row svelte-bpb2i4"><div class="user-info svelte-bpb2i4"><span class="user-name svelte-bpb2i4">${escape_html(u.name)}</span> <span class="user-email svelte-bpb2i4">${escape_html(u.email)}</span></div> <span${attr("class", `role-chip ${stringify(u.role)} svelte-bpb2i4`)}>${escape_html(u.role)}</span> `;
-                      if (u.id !== store_get($$store_subs ??= {}, "$auth", auth).user?.id) {
-                        $$payload2.out += "<!--[-->";
-                        $$payload2.out += `<button class="icon-btn danger svelte-bpb2i4"${attr("title", REMOVE_USER_ICON_TITLE)}><svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="3 6 5 6 21 6"></polyline><path d="M19 6l-1 14a2 2 0 0 1-2 2H8a2 2 0 0 1-2-2L5 6"></path><path d="M10 11v6M14 11v6"></path><path d="M9 6V4h6v2"></path></svg></button>`;
-                      } else {
-                        $$payload2.out += "<!--[!-->";
-                        $$payload2.out += `<span class="you-chip svelte-bpb2i4">${escape_html(YOU_CHIP_LABEL)}</span>`;
-                      }
-                      $$payload2.out += `<!--]--></div>`;
-                    }
-                    $$payload2.out += `<!--]--></div>`;
-                  } else {
-                    $$payload2.out += "<!--[!-->";
-                  }
-                  $$payload2.out += `<!--]--></div>`;
+                  $$payload2.out += `<!----></div></div> <div class="card settings-card svelte-m3ck68"><div class="card-footer svelte-m3ck68">`;
+                  Button($$payload2, {
+                    variant: "danger",
+                    size: "sm",
+                    children: ($$payload3) => {
+                      $$payload3.out += `<!---->${escape_html(SIGN_OUT_LABEL)}`;
+                    },
+                    $$slots: { default: true }
+                  });
+                  $$payload2.out += `<!----></div></div></div>`;
                 } else {
                   $$payload2.out += "<!--[!-->";
-                  if (section === "backup") {
+                  if (section === "users") {
                     $$payload2.out += "<!--[-->";
-                    $$payload2.out += `<div class="content-section svelte-bpb2i4"><div class="content-header svelte-bpb2i4"><h2 class="svelte-bpb2i4">${escape_html(BACKUP_LABEL)}</h2> <p class="content-desc svelte-bpb2i4">${escape_html(BACKUP_DESC)}</p></div> <div class="card settings-card svelte-bpb2i4"><p class="card-title">${escape_html(MANUAL_BACKUP_CARD_TITLE)}</p> <div class="backup-row svelte-bpb2i4"><div class="backup-block svelte-bpb2i4"><p class="backup-block-title svelte-bpb2i4">${escape_html(EXPORT_BLOCK_TITLE)}</p> <p class="backup-block-desc svelte-bpb2i4">${escape_html(EXPORT_BLOCK_DESC_PREFIX)} <code class="svelte-bpb2i4">.json</code> ${escape_html(EXPORT_BLOCK_DESC_SUFFIX)}</p> `;
-                    Button($$payload2, {
-                      disabled: exporting,
-                      children: ($$payload3) => {
-                        $$payload3.out += `<!---->${escape_html(exportLabel())}`;
+                    $$payload2.out += `<div class="content-section svelte-m3ck68"><div class="content-header svelte-m3ck68"><h2 class="svelte-m3ck68">${escape_html(USERS_LABEL)}</h2> <p class="content-desc svelte-m3ck68">${escape_html(USERS_DESC)}</p></div> `;
+                    ConfirmModal($$payload2, {
+                      title: REMOVE_USER_MODAL_TITLE,
+                      confirmLabel: REMOVE_USER_LABEL,
+                      get open() {
+                        return confirmDeleteUserOpen;
                       },
-                      $$slots: { default: true }
-                    });
-                    $$payload2.out += `<!----></div> <div class="backup-divider svelte-bpb2i4"></div> <div class="backup-block svelte-bpb2i4"><p class="backup-block-title svelte-bpb2i4">${escape_html(IMPORT_BLOCK_TITLE)}</p> <p class="backup-block-desc svelte-bpb2i4">${escape_html(IMPORT_BLOCK_DESC)}</p> <div class="import-row svelte-bpb2i4"><label class="file-label svelte-bpb2i4"><input type="file" accept=".json" class="file-input-hidden svelte-bpb2i4"> <span class="file-btn svelte-bpb2i4">${escape_html(CHOOSE_FILE_LABEL)}</span></label> `;
-                    Button($$payload2, {
-                      disabled: true,
-                      children: ($$payload3) => {
-                        $$payload3.out += `<!---->${escape_html(importLabel())}`;
+                      set open($$value) {
+                        confirmDeleteUserOpen = $$value;
+                        $$settled = false;
                       },
-                      $$slots: { default: true }
-                    });
-                    $$payload2.out += `<!----></div></div></div> <p class="backup-disclaimer svelte-bpb2i4">${escape_html(BACKUP_DISCLAIMER_PREFIX)} <code>pg_dump</code> ${escape_html(BACKUP_DISCLAIMER_SUFFIX)}</p></div> <div class="card settings-card svelte-bpb2i4"><p class="card-title">${escape_html(S3_STORAGE_CARD_TITLE)}</p> <p class="backup-block-desc svelte-bpb2i4" style="margin-bottom: 1.25rem;">${escape_html(S3_STORAGE_DESC_PREFIX)} <strong>${escape_html(ENDPOINT_URL_LABEL)}</strong> ${escape_html(S3_STORAGE_DESC_SUFFIX)}</p> <div class="field-row svelte-bpb2i4"><div class="field"><label class="field-label svelte-bpb2i4" for="s3-endpoint"><span>${escape_html(ENDPOINT_URL_LABEL)}</span> <span class="field-hint svelte-bpb2i4">${escape_html(ENDPOINT_URL_HINT)}</span></label> <input id="s3-endpoint" type="url" class="field-input"${attr("value", backupConfig.backupS3Endpoint)}${attr("placeholder", ENDPOINT_URL_PLACEHOLDER)}></div> <div class="field"><label class="field-label svelte-bpb2i4" for="s3-region"><span>${escape_html(REGION_LABEL)}</span> <span class="field-hint svelte-bpb2i4">${escape_html(REGION_HINT_PREFIX)} <code>auto</code> ${escape_html(REGION_HINT_SUFFIX)}</span></label> <input id="s3-region" type="text" class="field-input"${attr("value", backupConfig.backupS3Region)}${attr("placeholder", REGION_PLACEHOLDER)}></div></div> <div class="field-row svelte-bpb2i4"><div class="field"><label class="field-label svelte-bpb2i4" for="s3-bucket"><span>${escape_html(BUCKET_LABEL)}</span></label> <input id="s3-bucket" type="text" class="field-input"${attr("value", backupConfig.backupS3Bucket)}${attr("placeholder", BUCKET_PLACEHOLDER)}></div> <div class="field"><label class="field-label svelte-bpb2i4" for="s3-prefix"><span>${escape_html(PATH_PREFIX_LABEL)}</span> <span class="field-hint svelte-bpb2i4">${escape_html(PATH_PREFIX_HINT)}</span></label> <input id="s3-prefix" type="text" class="field-input"${attr("value", backupConfig.backupS3Prefix)}${attr("placeholder", PATH_PREFIX_PLACEHOLDER)}></div></div> <div class="field-row svelte-bpb2i4"><div class="field"><label class="field-label svelte-bpb2i4" for="s3-access-key"><span>${escape_html(ACCESS_KEY_LABEL)}</span></label> <input id="s3-access-key" type="text" class="field-input"${attr("value", backupConfig.backupS3AccessKey)}${attr("placeholder", ACCESS_KEY_PLACEHOLDER)} autocomplete="off"></div> <div class="field"><label class="field-label svelte-bpb2i4" for="s3-secret-key"><span>${escape_html(SECRET_KEY_LABEL)}</span> <span class="field-hint svelte-bpb2i4">${escape_html(secretKeyHint())}</span></label> <input id="s3-secret-key" type="password" class="field-input"${attr("value", backupConfig.backupS3SecretKey)}${attr("placeholder", secretKeyPlaceholder(backupS3SecretKeySet))} autocomplete="new-password"></div></div> <div class="backup-actions svelte-bpb2i4">`;
-                    Button($$payload2, {
-                      variant: "ghost",
-                      disabled: backupTestingS3,
                       children: ($$payload3) => {
-                        $$payload3.out += `<!---->${escape_html(testConnectionLabel())}`;
+                        {
+                          $$payload3.out += "<!--[!-->";
+                        }
+                        $$payload3.out += `<!--]-->`;
                       },
                       $$slots: { default: true }
                     });
-                    $$payload2.out += `<!----> `;
+                    $$payload2.out += `<!----> <div class="card settings-card svelte-m3ck68"><p class="card-title">${escape_html(ADD_USER_CARD_TITLE)}</p> <div class="field-row svelte-m3ck68"><div class="field"><label class="field-label svelte-m3ck68" for="u-name">${escape_html(NAME_LABEL)}</label> <input id="u-name" type="text" class="field-input"${attr("value", userForm.name)}${attr("placeholder", USER_NAME_PLACEHOLDER)}></div> <div class="field"><label class="field-label svelte-m3ck68" for="u-email">${escape_html(EMAIL_LABEL)}</label> <input id="u-email" type="email" class="field-input"${attr("value", userForm.email)}${attr("placeholder", USER_EMAIL_PLACEHOLDER)}></div></div> <div class="field-row svelte-m3ck68"><div class="field"><label class="field-label svelte-m3ck68" for="u-pw">${escape_html(PASSWORD_LABEL)}</label> <input id="u-pw" type="password" class="field-input"${attr("value", userForm.password)} autocomplete="new-password"></div> <div class="field"><label class="field-label svelte-m3ck68" for="u-role">${escape_html(ROLE_LABEL)}</label> <select id="u-role" class="field-input"><option value="user">${escape_html(USER_ROLE_OPTION)}</option><option value="admin">${escape_html(ADMIN_ROLE_OPTION)}</option></select></div></div> `;
+                    {
+                      $$payload2.out += "<!--[!-->";
+                    }
+                    $$payload2.out += `<!--]--> <div class="card-footer svelte-m3ck68">`;
                     Button($$payload2, {
-                      disabled: backupConfigSaving,
+                      disabled: userFormSaving,
                       children: ($$payload3) => {
-                        $$payload3.out += `<!---->${escape_html(saveS3ConfigLabel())}`;
+                        $$payload3.out += `<!---->${escape_html(addUserLabel())}`;
                       },
                       $$slots: { default: true }
                     });
-                    $$payload2.out += `<!----></div> `;
-                    {
-                      $$payload2.out += "<!--[!-->";
-                    }
-                    $$payload2.out += `<!--]--></div> <div${attr("class", `card settings-card svelte-bpb2i4 ${stringify([!s3Configured ? "card-disabled" : ""].filter(Boolean).join(" "))}`)}><p class="card-title">${escape_html(SCHEDULED_BACKUP_CARD_TITLE)}</p> `;
-                    if (!s3Configured) {
+                    $$payload2.out += `<!----></div></div> `;
+                    if (allUsers.length > 0) {
                       $$payload2.out += "<!--[-->";
-                      $$payload2.out += `<p class="backup-block-desc svelte-bpb2i4">${escape_html(CONFIGURE_S3_FIRST_MESSAGE)}</p>`;
+                      const each_array_5 = ensure_array_like(allUsers);
+                      $$payload2.out += `<div class="users-table svelte-m3ck68"><!--[-->`;
+                      for (let $$index_5 = 0, $$length = each_array_5.length; $$index_5 < $$length; $$index_5++) {
+                        let u = each_array_5[$$index_5];
+                        $$payload2.out += `<div class="user-row svelte-m3ck68"><div class="user-info svelte-m3ck68"><span class="user-name svelte-m3ck68">${escape_html(u.name)}</span> <span class="user-email svelte-m3ck68">${escape_html(u.email)}</span></div> <span${attr("class", `role-chip ${stringify(u.role)} svelte-m3ck68`)}>${escape_html(u.role)}</span> `;
+                        if (u.id !== store_get($$store_subs ??= {}, "$auth", auth).user?.id) {
+                          $$payload2.out += "<!--[-->";
+                          $$payload2.out += `<button class="icon-btn danger svelte-m3ck68"${attr("title", REMOVE_USER_ICON_TITLE)}><svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="3 6 5 6 21 6"></polyline><path d="M19 6l-1 14a2 2 0 0 1-2 2H8a2 2 0 0 1-2-2L5 6"></path><path d="M10 11v6M14 11v6"></path><path d="M9 6V4h6v2"></path></svg></button>`;
+                        } else {
+                          $$payload2.out += "<!--[!-->";
+                          $$payload2.out += `<span class="you-chip svelte-m3ck68">${escape_html(YOU_CHIP_LABEL)}</span>`;
+                        }
+                        $$payload2.out += `<!--]--></div>`;
+                      }
+                      $$payload2.out += `<!--]--></div>`;
                     } else {
                       $$payload2.out += "<!--[!-->";
-                      $$payload2.out += `<div class="field"><label class="field-label backup-toggle-label svelte-bpb2i4" for="backup-enabled"><span>${escape_html(ENABLE_SCHEDULED_BACKUP_LABEL)}</span> <button id="backup-enabled"${attr("class", `toggle-btn svelte-bpb2i4 ${stringify([""].filter(Boolean).join(" "))}`)} role="switch"${attr("aria-checked", backupConfig.backupEnabled)}><span class="toggle-thumb svelte-bpb2i4"></span></button></label></div> <div class="field"><label class="field-label svelte-bpb2i4" for="backup-cron"><span>${escape_html(CRON_EXPRESSION_LABEL)}</span> <span class="field-hint svelte-bpb2i4">${escape_html(CRON_HINT_PREFIX)} <code>0 2 * * *</code> ${escape_html(CRON_HINT_SUFFIX)} <a href="https://crontab.guru" target="_blank" rel="noopener noreferrer">${escape_html(CRONTAB_LINK_LABEL)}</a></span></label> <input id="backup-cron" type="text" class="field-input field-input-mono svelte-bpb2i4"${attr("value", backupConfig.backupCron)}${attr("placeholder", CRON_PLACEHOLDER)}></div> `;
-                      {
-                        $$payload2.out += "<!--[!-->";
-                      }
-                      $$payload2.out += `<!--]--> <div class="backup-actions svelte-bpb2i4">`;
+                    }
+                    $$payload2.out += `<!--]--></div>`;
+                  } else {
+                    $$payload2.out += "<!--[!-->";
+                    if (section === "backup") {
+                      $$payload2.out += "<!--[-->";
+                      $$payload2.out += `<div class="content-section svelte-m3ck68"><div class="content-header svelte-m3ck68"><h2 class="svelte-m3ck68">${escape_html(BACKUP_LABEL)}</h2> <p class="content-desc svelte-m3ck68">${escape_html(BACKUP_DESC)}</p></div> <div class="card settings-card svelte-m3ck68"><p class="card-title">${escape_html(MANUAL_BACKUP_CARD_TITLE)}</p> <div class="backup-row svelte-m3ck68"><div class="backup-block svelte-m3ck68"><p class="backup-block-title svelte-m3ck68">${escape_html(EXPORT_BLOCK_TITLE)}</p> <p class="backup-block-desc svelte-m3ck68">${escape_html(EXPORT_BLOCK_DESC_PREFIX)} <code class="svelte-m3ck68">.json</code> ${escape_html(EXPORT_BLOCK_DESC_SUFFIX)}</p> `;
+                      Button($$payload2, {
+                        disabled: exporting,
+                        children: ($$payload3) => {
+                          $$payload3.out += `<!---->${escape_html(exportLabel())}`;
+                        },
+                        $$slots: { default: true }
+                      });
+                      $$payload2.out += `<!----></div> <div class="backup-divider svelte-m3ck68"></div> <div class="backup-block svelte-m3ck68"><p class="backup-block-title svelte-m3ck68">${escape_html(IMPORT_BLOCK_TITLE)}</p> <p class="backup-block-desc svelte-m3ck68">${escape_html(IMPORT_BLOCK_DESC)}</p> <div class="import-row svelte-m3ck68"><label class="file-label svelte-m3ck68"><input type="file" accept=".json" class="file-input-hidden svelte-m3ck68"> <span class="file-btn svelte-m3ck68">${escape_html(CHOOSE_FILE_LABEL)}</span></label> `;
+                      Button($$payload2, {
+                        disabled: true,
+                        children: ($$payload3) => {
+                          $$payload3.out += `<!---->${escape_html(importLabel())}`;
+                        },
+                        $$slots: { default: true }
+                      });
+                      $$payload2.out += `<!----></div></div></div> <div class="include-reports-row svelte-m3ck68"><label class="field-label backup-toggle-label svelte-m3ck68" for="include-reports"><span class="svelte-m3ck68">${escape_html(INCLUDE_REPORTS_LABEL)} <span class="field-hint svelte-m3ck68">${escape_html(INCLUDE_REPORTS_HINT)}</span></span> <button id="include-reports"${attr("class", `toggle-btn svelte-m3ck68 ${stringify([
+                        ""
+                      ].filter(Boolean).join(" "))}`)} role="switch"${attr("aria-checked", backupConfig.backupIncludeReports)}><span class="toggle-thumb svelte-m3ck68"></span></button></label> `;
+                      Button($$payload2, {
+                        variant: "ghost",
+                        disabled: includeReportsSaving,
+                        children: ($$payload3) => {
+                          $$payload3.out += `<!---->${escape_html(saveIncludeReportsLabel())}`;
+                        },
+                        $$slots: { default: true }
+                      });
+                      $$payload2.out += `<!----></div> <p class="backup-disclaimer svelte-m3ck68">${escape_html(includeReportsDisclaimer())}</p></div> <div class="card settings-card svelte-m3ck68"><p class="card-title">${escape_html(S3_STORAGE_CARD_TITLE)}</p> <p class="backup-block-desc svelte-m3ck68" style="margin-bottom: 1.25rem;">${escape_html(S3_STORAGE_DESC_PREFIX)} <strong>${escape_html(ENDPOINT_URL_LABEL)}</strong> ${escape_html(S3_STORAGE_DESC_SUFFIX)}</p> <div class="field-row svelte-m3ck68"><div class="field"><label class="field-label svelte-m3ck68" for="s3-endpoint"><span>${escape_html(ENDPOINT_URL_LABEL)}</span> <span class="field-hint svelte-m3ck68">${escape_html(ENDPOINT_URL_HINT)}</span></label> <input id="s3-endpoint" type="url" class="field-input"${attr("value", backupConfig.backupS3Endpoint)}${attr("placeholder", ENDPOINT_URL_PLACEHOLDER)}></div> <div class="field"><label class="field-label svelte-m3ck68" for="s3-region"><span>${escape_html(REGION_LABEL)}</span> <span class="field-hint svelte-m3ck68">${escape_html(REGION_HINT_PREFIX)} <code>auto</code> ${escape_html(REGION_HINT_SUFFIX)}</span></label> <input id="s3-region" type="text" class="field-input"${attr("value", backupConfig.backupS3Region)}${attr("placeholder", REGION_PLACEHOLDER)}></div></div> <div class="field-row svelte-m3ck68"><div class="field"><label class="field-label svelte-m3ck68" for="s3-bucket"><span>${escape_html(BUCKET_LABEL)}</span></label> <input id="s3-bucket" type="text" class="field-input"${attr("value", backupConfig.backupS3Bucket)}${attr("placeholder", BUCKET_PLACEHOLDER)}></div> <div class="field"><label class="field-label svelte-m3ck68" for="s3-prefix"><span>${escape_html(PATH_PREFIX_LABEL)}</span> <span class="field-hint svelte-m3ck68">${escape_html(PATH_PREFIX_HINT)}</span></label> <input id="s3-prefix" type="text" class="field-input"${attr("value", backupConfig.backupS3Prefix)}${attr("placeholder", PATH_PREFIX_PLACEHOLDER)}></div></div> <div class="field-row svelte-m3ck68"><div class="field"><label class="field-label svelte-m3ck68" for="s3-access-key"><span>${escape_html(ACCESS_KEY_LABEL)}</span></label> <input id="s3-access-key" type="text" class="field-input"${attr("value", backupConfig.backupS3AccessKey)}${attr("placeholder", ACCESS_KEY_PLACEHOLDER)} autocomplete="off"></div> <div class="field"><label class="field-label svelte-m3ck68" for="s3-secret-key"><span>${escape_html(SECRET_KEY_LABEL)}</span> <span class="field-hint svelte-m3ck68">${escape_html(secretKeyHint())}</span></label> <input id="s3-secret-key" type="password" class="field-input"${attr("value", backupConfig.backupS3SecretKey)}${attr("placeholder", secretKeyPlaceholder(backupS3SecretKeySet))} autocomplete="new-password"></div></div> <div class="backup-actions svelte-m3ck68">`;
                       Button($$payload2, {
                         variant: "ghost",
-                        disabled: backupRunningNow,
+                        disabled: backupTestingS3,
                         children: ($$payload3) => {
-                          $$payload3.out += `<!---->${escape_html(uploadS3NowLabel())}`;
+                          $$payload3.out += `<!---->${escape_html(testConnectionLabel())}`;
                         },
                         $$slots: { default: true }
                       });
@@ -686,15 +757,113 @@ function _page($$payload, $$props) {
                       Button($$payload2, {
                         disabled: backupConfigSaving,
                         children: ($$payload3) => {
-                          $$payload3.out += `<!---->${escape_html(saveScheduleLabel())}`;
+                          $$payload3.out += `<!---->${escape_html(saveS3ConfigLabel())}`;
+                        },
+                        $$slots: { default: true }
+                      });
+                      $$payload2.out += `<!----></div> `;
+                      {
+                        $$payload2.out += "<!--[!-->";
+                      }
+                      $$payload2.out += `<!--]--></div> `;
+                      ConfirmModal($$payload2, {
+                        title: RESTORE_CONFIRM_TITLE,
+                        confirmLabel: restoreLabel(false),
+                        loading: false,
+                        get open() {
+                          return restoreConfirmOpen;
+                        },
+                        set open($$value) {
+                          restoreConfirmOpen = $$value;
+                          $$settled = false;
+                        },
+                        children: ($$payload3) => {
+                          {
+                            $$payload3.out += "<!--[!-->";
+                          }
+                          $$payload3.out += `<!--]-->`;
                         },
                         $$slots: { default: true }
                       });
-                      $$payload2.out += `<!----></div>`;
+                      $$payload2.out += `<!----> <div${attr("class", `card settings-card svelte-m3ck68 ${stringify([!s3Configured ? "card-disabled" : ""].filter(Boolean).join(" "))}`)}><div class="card-title-row svelte-m3ck68"><p class="card-title svelte-m3ck68">${escape_html(RESTORE_FROM_S3_CARD_TITLE)}</p> `;
+                      if (s3Configured) {
+                        $$payload2.out += "<!--[-->";
+                        Button($$payload2, {
+                          variant: "ghost",
+                          disabled: loadingS3Backups,
+                          children: ($$payload3) => {
+                            $$payload3.out += `<!---->${escape_html(refreshingLabel(loadingS3Backups))}`;
+                          },
+                          $$slots: { default: true }
+                        });
+                      } else {
+                        $$payload2.out += "<!--[!-->";
+                      }
+                      $$payload2.out += `<!--]--></div> `;
+                      if (!s3Configured) {
+                        $$payload2.out += "<!--[-->";
+                        $$payload2.out += `<p class="backup-block-desc svelte-m3ck68">${escape_html(CONFIGURE_S3_FIRST_RESTORE_MESSAGE)}</p>`;
+                      } else {
+                        $$payload2.out += "<!--[!-->";
+                        $$payload2.out += `<p class="backup-block-desc svelte-m3ck68" style="margin-bottom: 1rem;">${escape_html(RESTORE_FROM_S3_DESC)}</p> `;
+                        if (s3Backups.length === 0) {
+                          $$payload2.out += "<!--[-->";
+                          $$payload2.out += `<p class="backup-block-desc svelte-m3ck68">${escape_html(loadingS3Backups ? refreshingLabel(true) : NO_S3_BACKUPS_MESSAGE)}</p>`;
+                        } else {
+                          $$payload2.out += "<!--[!-->";
+                          const each_array_6 = ensure_array_like(s3Backups);
+                          $$payload2.out += `<ul class="s3-backup-list svelte-m3ck68"><!--[-->`;
+                          for (let $$index_6 = 0, $$length = each_array_6.length; $$index_6 < $$length; $$index_6++) {
+                            let backup = each_array_6[$$index_6];
+                            $$payload2.out += `<li class="s3-backup-row svelte-m3ck68"><div class="s3-backup-info svelte-m3ck68"><span class="s3-backup-key svelte-m3ck68">${escape_html(backup.key)}</span> <span class="s3-backup-meta svelte-m3ck68">${escape_html(new Date(backup.lastModified).toLocaleString())} · ${escape_html(backupSizeLabel(backup.size))}</span></div> `;
+                            Button($$payload2, {
+                              variant: "ghost",
+                              disabled: restoringKey === backup.key,
+                              children: ($$payload3) => {
+                                $$payload3.out += `<!---->${escape_html(restoreLabel(restoringKey === backup.key))}`;
+                              },
+                              $$slots: { default: true }
+                            });
+                            $$payload2.out += `<!----></li>`;
+                          }
+                          $$payload2.out += `<!--]--></ul>`;
+                        }
+                        $$payload2.out += `<!--]-->`;
+                      }
+                      $$payload2.out += `<!--]--></div> <div${attr("class", `card settings-card svelte-m3ck68 ${stringify([!s3Configured ? "card-disabled" : ""].filter(Boolean).join(" "))}`)}><p class="card-title">${escape_html(SCHEDULED_BACKUP_CARD_TITLE)}</p> `;
+                      if (!s3Configured) {
+                        $$payload2.out += "<!--[-->";
+                        $$payload2.out += `<p class="backup-block-desc svelte-m3ck68">${escape_html(CONFIGURE_S3_FIRST_MESSAGE)}</p>`;
+                      } else {
+                        $$payload2.out += "<!--[!-->";
+                        $$payload2.out += `<div class="field"><label class="field-label backup-toggle-label svelte-m3ck68" for="backup-enabled"><span>${escape_html(ENABLE_SCHEDULED_BACKUP_LABEL)}</span> <button id="backup-enabled"${attr("class", `toggle-btn svelte-m3ck68 ${stringify([""].filter(Boolean).join(" "))}`)} role="switch"${attr("aria-checked", backupConfig.backupEnabled)}><span class="toggle-thumb svelte-m3ck68"></span></button></label></div> <div class="field"><label class="field-label svelte-m3ck68" for="backup-cron"><span>${escape_html(CRON_EXPRESSION_LABEL)}</span> <span class="field-hint svelte-m3ck68">${escape_html(CRON_HINT_PREFIX)} <code>0 2 * * *</code> ${escape_html(CRON_HINT_SUFFIX)} <a href="https://crontab.guru" target="_blank" rel="noopener noreferrer">${escape_html(CRONTAB_LINK_LABEL)}</a></span></label> <input id="backup-cron" type="text" class="field-input field-input-mono svelte-m3ck68"${attr("value", backupConfig.backupCron)}${attr("placeholder", CRON_PLACEHOLDER)}></div> `;
+                        {
+                          $$payload2.out += "<!--[!-->";
+                        }
+                        $$payload2.out += `<!--]--> <div class="backup-actions svelte-m3ck68">`;
+                        Button($$payload2, {
+                          variant: "ghost",
+                          disabled: backupRunningNow,
+                          children: ($$payload3) => {
+                            $$payload3.out += `<!---->${escape_html(uploadS3NowLabel())}`;
+                          },
+                          $$slots: { default: true }
+                        });
+                        $$payload2.out += `<!----> `;
+                        Button($$payload2, {
+                          disabled: backupConfigSaving,
+                          children: ($$payload3) => {
+                            $$payload3.out += `<!---->${escape_html(saveScheduleLabel())}`;
+                          },
+                          $$slots: { default: true }
+                        });
+                        $$payload2.out += `<!----></div>`;
+                      }
+                      $$payload2.out += `<!--]--></div></div>`;
+                    } else {
+                      $$payload2.out += "<!--[!-->";
                     }
-                    $$payload2.out += `<!--]--></div></div>`;
-                  } else {
-                    $$payload2.out += "<!--[!-->";
+                    $$payload2.out += `<!--]-->`;
                   }
                   $$payload2.out += `<!--]-->`;
                 }