From c2f55d96dbb517d393d1f4e0a5a607ea48f1a597 Mon Sep 17 00:00:00 2001
From: Christoph Brandau <Christoph.Brandau@janus-engineering.com>
Date: Mon, 13 Jul 2026 00:15:58 +0200
Subject: [PATCH] feat(settings): implement persistent auto-refresh
 functionality

Adds a configurable and persistable auto-refresh setting to the application's settings dialog. This feature allows users to control whether the repository view automatically updates its status, branch information, and remote tracking in the background. The logic is integrated across core components to manage state changes and provide visual feedback to the user.

- Auto-refresh state is now persistent and managed via local storage.
- Updated settings dialog UI to include a dedicated toggle for auto-refresh.
- Removed manual auto-refresh toggling from the repository toolbar component.
---
 src/App.svelte                              | 20 +++++++-------
 src/lib/RepoToolbar.svelte                  | 21 +++------------
 src/lib/components/AppSettingsDialog.svelte | 29 ++++++++++++++++++---
 3 files changed, 37 insertions(+), 33 deletions(-)

diff --git a/src/App.svelte b/src/App.svelte
index 177b531..52174ff 100644
--- a/src/App.svelte
+++ b/src/App.svelte
@@ -185,6 +185,7 @@
   const ANALYTICS_SETTINGS_KEY = "gitlite.analyticsSettings.v1";
   const APP_THEME_KEY = "gitlite.theme.v1";
   const APP_LANGUAGE_KEY = "gitlite.language.v1";
+  const AUTO_REFRESH_ENABLED_KEY = "gitlite.autoRefreshEnabled.v1";
   const COMMIT_PANEL_HEIGHT_KEY = "gitlite.commitPanelHeight.v1";
   const LEFT_SIDEBAR_WIDTH_KEY = "gitlite.leftSidebarWidth.v1";
   const LEFT_BRANCH_PANEL_HEIGHT_KEY = "gitlite.leftBranchPanelHeight.v1";
@@ -311,7 +312,7 @@
   let conflictTarget = "";
   let conflict: ConflictFile | null = null;
   let preparedResolutions: Record<string, PreparedResolution> = {};
-  let autoRefreshEnabled = true;
+  let autoRefreshEnabled = loadStoredBoolean(AUTO_REFRESH_ENABLED_KEY, true);
   let autoRefreshInFlight = false;
   let credDialogOpen = false;
   let credDialogAction: CredentialAction | null = null;
@@ -868,15 +869,19 @@
     if (appTheme === "system") applyThemePreference(appTheme);
   }
 
-  function saveAppSettings(next: AnalyticsSettings, nextTheme: AppTheme, nextLanguage: AppLanguage) {
+  function saveAppSettings(next: AnalyticsSettings, nextTheme: AppTheme, nextLanguage: AppLanguage, nextAutoRefresh: boolean) {
+    const autoRefreshWasEnabled = autoRefreshEnabled;
     analyticsSettings = next;
     appTheme = nextTheme;
     appLanguage = nextLanguage;
+    autoRefreshEnabled = nextAutoRefresh;
     persistAnalyticsSettings(next);
     persistThemePreference(nextTheme);
     persistLanguagePreference(nextLanguage);
+    persistStoredBoolean(AUTO_REFRESH_ENABLED_KEY, nextAutoRefresh);
     appSettingsOpen = false;
-    if (next.enabled) trackEvent("settings_saved", { analytics_enabled: 1, theme: nextTheme, language: nextLanguage });
+    if (nextAutoRefresh && !autoRefreshWasEnabled) void autoRefreshTick();
+    if (next.enabled) trackEvent("settings_saved", { analytics_enabled: 1, theme: nextTheme, language: nextLanguage, auto_refresh: nextAutoRefresh ? 1 : 0 });
   }
 
   function updateCommitMessage(message: string) {
@@ -982,11 +987,6 @@
     }
   }
 
-  function toggleAutoRefresh() {
-    autoRefreshEnabled = !autoRefreshEnabled;
-    if (autoRefreshEnabled) void autoRefreshTick();
-  }
-
   // ── Updates ────────────────────────────────────────────────────────────────
 
   async function checkForUpdates() {
@@ -3609,8 +3609,6 @@
         {operation}
         ahead={status?.ahead ?? 0}
         behind={status?.behind ?? 0}
-        {autoRefreshEnabled}
-        {autoRefreshInFlight}
         language={appLanguage}
         onFetch={fetchRepo}
         onPull={pullRepo}
@@ -3621,7 +3619,6 @@
         onInteractiveRebase={openInteractiveRebase}
         onReflog={openReflog}
         onOpenInExplorer={openActiveRepoInExplorer}
-        onToggleAutoRefresh={toggleAutoRefresh}
       />
     {/if}
 
@@ -4191,6 +4188,7 @@
     analytics={analyticsSettings}
     theme={appTheme}
     language={appLanguage}
+    autoRefresh={autoRefreshEnabled}
     onSave={saveAppSettings}
     onClose={() => { appSettingsOpen = false; }}
   />
diff --git a/src/lib/RepoToolbar.svelte b/src/lib/RepoToolbar.svelte
index 2dcf701..2969aa9 100644
--- a/src/lib/RepoToolbar.svelte
+++ b/src/lib/RepoToolbar.svelte
@@ -18,8 +18,6 @@
   export let operation: string = "";
   export let ahead: number = 0;
   export let behind: number = 0;
-  export let autoRefreshEnabled: boolean = true;
-  export let autoRefreshInFlight: boolean = false;
   export let language: "en" | "de" = "en";
   export let onFetch: () => void = () => {};
   export let onPull: () => void = () => {};
@@ -30,7 +28,6 @@
   export let onInteractiveRebase: () => void = () => {};
   export let onReflog: () => void = () => {};
   export let onOpenInExplorer: () => void = () => {};
-  export let onToggleAutoRefresh: () => void = () => {};
 
   let historyOpen = false;
   let toolbarElement: HTMLDivElement;
@@ -192,26 +189,14 @@
     </button>
 
     <button
-      class="repo-action icon-action"
+      class="repo-action"
       onclick={onRefresh}
       disabled={isBusy || !hasRepository}
       title={isGerman ? "Manuell aktualisieren" : "Refresh now"}
       aria-label={isGerman ? "Manuell aktualisieren" : "Refresh now"}
     >
-      <RefreshCw class={operation === "Refreshing" ? "spin" : ""} size={15} aria-hidden="true" />
-    </button>
-
-    <button
-      class="repo-auto-toggle"
-      class:active={autoRefreshEnabled}
-      onclick={onToggleAutoRefresh}
-      aria-pressed={autoRefreshEnabled}
-      title={autoRefreshEnabled
-        ? (isGerman ? "Auto-Aktualisierung ausschalten" : "Turn auto-refresh off")
-        : (isGerman ? "Auto-Aktualisierung einschalten" : "Turn auto-refresh on")}
-    >
-      <span>{isGerman ? "Auto" : "Auto"}</span>
-      <span class="repo-switch" class:busy={autoRefreshInFlight} aria-hidden="true"><span></span></span>
+      <RefreshCw class={operation === "Refreshing" ? "spin" : ""} size={16} aria-hidden="true" />
+      <span class="repo-action-label utility-label">{isGerman ? "Aktualisieren" : "Refresh"}</span>
     </button>
   </div>
 </div>
diff --git a/src/lib/components/AppSettingsDialog.svelte b/src/lib/components/AppSettingsDialog.svelte
index d3053d0..b904bb8 100644
--- a/src/lib/components/AppSettingsDialog.svelte
+++ b/src/lib/components/AppSettingsDialog.svelte
@@ -1,26 +1,29 @@
 <script lang="ts">
-  import { Check, Languages, Settings, X } from "@lucide/svelte";
+  import { Check, Languages, RefreshCw, Settings, X } from "@lucide/svelte";
   import type { AnalyticsSettings, AppLanguage, AppTheme } from "../types";
 
   interface Props {
     analytics: AnalyticsSettings;
     theme: AppTheme;
     language: AppLanguage;
-    onSave: (settings: AnalyticsSettings, theme: AppTheme, language: AppLanguage) => void;
+    autoRefresh: boolean;
+    onSave: (settings: AnalyticsSettings, theme: AppTheme, language: AppLanguage, autoRefresh: boolean) => void;
     onClose: () => void;
   }
 
-  let { analytics, theme = "system", language = "en", onSave = () => {}, onClose = () => {} }: Props = $props();
+  let { analytics, theme = "system", language = "en", autoRefresh = true, onSave = () => {}, onClose = () => {} }: Props = $props();
 
   let analyticsEnabled = $state(true);
   let selectedTheme = $state<AppTheme>("system");
   let selectedLanguage = $state<AppLanguage>("en");
+  let autoRefreshEnabled = $state(true);
   const isGerman = $derived(selectedLanguage === "de");
 
   $effect(() => {
     analyticsEnabled = analytics.enabled;
     selectedTheme = theme;
     selectedLanguage = language;
+    autoRefreshEnabled = autoRefresh;
   });
 
   function save() {
@@ -28,7 +31,7 @@
       ...analytics,
       enabled: analyticsEnabled,
       noticeSeen: true,
-    }, selectedTheme, selectedLanguage);
+    }, selectedTheme, selectedLanguage, autoRefreshEnabled);
   }
 </script>
 
@@ -70,6 +73,24 @@
         </div>
       </section>
 
+      <section class="settings-section">
+        <header>
+          <RefreshCw size={16} aria-hidden="true" />
+          <div>
+            <span class="eyebrow">Repository</span>
+            <h3>{isGerman ? "Automatische Aktualisierung" : "Auto refresh"}</h3>
+          </div>
+        </header>
+
+        <label class="settings-toggle-row">
+          <input type="checkbox" bind:checked={autoRefreshEnabled} />
+          <span>
+            <strong>{isGerman ? "Repositories automatisch aktualisieren" : "Refresh repositories automatically"}</strong>
+            <small>{isGerman ? "Aktualisiert Arbeitsbereich, Branch-Status und Remotes regelmäßig im Hintergrund." : "Periodically refreshes the working tree, branch status, and remotes in the background."}</small>
+          </span>
+        </label>
+      </section>
+
       <section class="settings-section">
         <header>
           <Languages size={16} aria-hidden="true" />