1.1.0 - automations, clean only mode, bug fixes

frontend/src/components/SettingsPanel.svelte

@@ -1,76 +1,76 @@
 <script>
-  import { onMount } from 'svelte'
-  import { getSettings, updateSettings } from '../lib/api.js'
-  import { Skeleton } from '../lib/components/ui/skeleton'
-  import GeneralSettings from './settings/GeneralSettings.svelte'
-  import IntegrationsSettings from './settings/IntegrationsSettings.svelte'
-  import FilenameCleaningSettings from './settings/FilenameCleaningSettings.svelte'
-  import ScheduledScansSettings from './settings/ScheduledScansSettings.svelte'
-  import FolderRulesSettings from './settings/FolderRulesSettings.svelte'
-  import TasksSettings from './settings/TasksSettings.svelte'
-  import { addToast } from '../lib/toastStore.js'
-  import { Bolt, Calendar, Folder, Plug, Settings, Wand2 } from 'lucide-svelte'
+  import { onMount } from "svelte";
+  import { getSettings, updateSettings } from "../lib/api.js";
+  import { Skeleton } from "../lib/components/ui/skeleton";
+  import GeneralSettings from "./settings/GeneralSettings.svelte";
+  import IntegrationsSettings from "./settings/IntegrationsSettings.svelte";
+  import FilenameCleaningSettings from "./settings/FilenameCleaningSettings.svelte";
+  import FolderRulesSettings from "./settings/FolderRulesSettings.svelte";
+  import TasksSettings from "./settings/TasksSettings.svelte";
+  import { addToast } from "../lib/toastStore.js";
+  import { Bolt, Calendar, Folder, Plug, Settings, Wand2 } from "lucide-svelte";
 
-  let currentSection = 'general'
-  let settings = {}
-  let loading = false
-  let saving = false
-  let error = null
-  let successMessage = null
+  let currentSection = "general";
+  let settings = {};
+  let loading = false;
+  let saving = false;
+  let error = null;
+  let successMessage = null;
 
   const sections = [
-    { id: 'general', label: 'General', icon: 'settings' },
-    { id: 'folder-rules', label: 'Folder Rules', icon: 'folder' },
-    { id: 'scheduled', label: 'Scheduled Scans', icon: 'calendar' },
-    { id: 'cleanup', label: 'Cleanup', icon: 'wand' },
-    { id: 'integrations', label: 'Integrations', icon: 'plug' },
-    { id: 'tasks', label: 'Tasks', icon: 'bolt' }
-  ]
+    { id: "general", label: "General", icon: "settings" },
+    { id: "folder-rules", label: "Folder Rules", icon: "folder" },
+    { id: "cleanup", label: "Cleanup", icon: "wand" },
+    { id: "integrations", label: "Integrations", icon: "plug" },
+    { id: "tasks", label: "Tasks", icon: "bolt" },
+  ];
 
   onMount(async () => {
-    await loadSettings()
-  })
+    await loadSettings();
+  });
 
   async function loadSettings() {
-    loading = true
-    error = null
-    const loadingStart = Date.now()
+    loading = true;
+    error = null;
+    const loadingStart = Date.now();
 
     try {
-      settings = await getSettings()
+      settings = await getSettings();
     } catch (err) {
-      error = `Failed to load settings: ${err.message}`
+      error = `Failed to load settings: ${err.message}`;
     } finally {
-      const elapsed = Date.now() - loadingStart
-      const minDelayMs = 500
+      const elapsed = Date.now() - loadingStart;
+      const minDelayMs = 500;
       if (elapsed < minDelayMs) {
-        await new Promise((resolve) => setTimeout(resolve, minDelayMs - elapsed))
+        await new Promise((resolve) =>
+          setTimeout(resolve, minDelayMs - elapsed),
+        );
       }
-      loading = false
+      loading = false;
     }
   }
 
   async function handleSave(updates) {
-    saving = true
-    error = null
-    successMessage = null
+    saving = true;
+    error = null;
+    successMessage = null;
 
     try {
-      const result = await updateSettings(updates)
-      successMessage = result.message || 'Settings saved successfully'
-      addToast({ message: successMessage, tone: 'success' })
+      const result = await updateSettings(updates);
+      successMessage = result.message || "Settings saved successfully";
+      addToast({ message: successMessage, tone: "success" });
 
       // Reload settings
-      await loadSettings()
+      await loadSettings();
 
       setTimeout(() => {
-        successMessage = null
-      }, 3000)
+        successMessage = null;
+      }, 3000);
     } catch (err) {
-      error = `Failed to save settings: ${err.message}`
-      addToast({ message: error, tone: 'error' })
+      error = `Failed to save settings: ${err.message}`;
+      addToast({ message: error, tone: "error" });
     } finally {
-      saving = false
+      saving = false;
     }
   }
 </script>
@@ -116,66 +116,72 @@
     </div>
 
     <div class="flex flex-col lg:flex-row gap-8 lg:gap-12">
-    <!-- Sidebar Navigation -->
-    <aside class="w-full lg:w-48 flex-shrink-0">
-      <nav class="space-y-0.5">
-        {#each sections as section}
-          <button
-            class="w-full flex items-center gap-3 px-3 py-2 rounded-lg text-left transition-all border
+      <!-- Sidebar Navigation -->
+      <aside class="w-full lg:w-48 flex-shrink-0">
+        <nav class="space-y-0.5">
+          {#each sections as section}
+            <button
+              class="w-full flex items-center gap-3 px-3 py-2 rounded-lg text-left transition-all border
                    {currentSection === section.id
-                     ? 'bg-white text-black border-white'
-                     : 'text-text-secondary hover:text-white hover:bg-bg-hover border-transparent'}"
-            on:click={() => currentSection = section.id}
+                ? 'bg-white text-black border-white'
+                : 'text-text-secondary hover:text-white hover:bg-bg-hover border-transparent'}"
+              on:click={() => (currentSection = section.id)}
+            >
+              {#if section.icon === "settings"}
+                <Settings class="w-4 h-4" />
+              {:else if section.icon === "calendar"}
+                <Calendar class="w-4 h-4" />
+              {:else if section.icon === "bolt"}
+                <Bolt class="w-4 h-4" />
+              {:else if section.icon === "wand"}
+                <Wand2 class="w-4 h-4" />
+              {:else if section.icon === "plug"}
+                <Plug class="w-4 h-4" />
+              {:else if section.icon === "folder"}
+                <Folder class="w-4 h-4" />
+              {/if}
+              <span class="text-[13px] font-medium">{section.label}</span>
+            </button>
+          {/each}
+        </nav>
+      </aside>
+
+      <!-- Main Content -->
+      <div class="flex-1 min-w-0">
+        {#if error}
+          <div
+            class="mb-6 px-5 py-4 bg-red-500/5 border border-red-500/20 rounded-xl"
           >
-                {#if section.icon === 'settings'}
-                  <Settings class="w-4 h-4" />
-                {:else if section.icon === 'calendar'}
-                  <Calendar class="w-4 h-4" />
-                {:else if section.icon === 'bolt'}
-                  <Bolt class="w-4 h-4" />
-                {:else if section.icon === 'wand'}
-                  <Wand2 class="w-4 h-4" />
-                {:else if section.icon === 'plug'}
-                  <Plug class="w-4 h-4" />
-                {:else if section.icon === 'folder'}
-                  <Folder class="w-4 h-4" />
-                {/if}
-                <span class="text-[13px] font-medium">{section.label}</span>
-          </button>
-        {/each}
-      </nav>
-    </aside>
-
-    <!-- Main Content -->
-    <div class="flex-1 min-w-0">
-      {#if error}
-        <div class="mb-6 px-5 py-4 bg-red-500/5 border border-red-500/20 rounded-xl">
-          <p class="text-[13px] text-red-300">{error}</p>
-        </div>
-      {/if}
-
-      {#if successMessage}
-        <div class="mb-6 px-5 py-4 bg-green-500/5 border border-green-500/20 rounded-xl">
-          <p class="text-[13px] text-green-300">{successMessage}</p>
-        </div>
-      {/if}
-
-      <div class="rounded-xl border border-border bg-card/60 p-6 lg:p-8 shadow-sm">
-        {#if currentSection === 'general'}
-          <GeneralSettings {settings} {saving} onSave={handleSave} />
-        {:else if currentSection === 'folder-rules'}
-          <FolderRulesSettings {settings} />
-        {:else if currentSection === 'scheduled'}
-          <ScheduledScansSettings {settings} />
-        {:else if currentSection === 'cleanup'}
-          <FilenameCleaningSettings {settings} {saving} onSave={handleSave} />
-        {:else if currentSection === 'integrations'}
-          <IntegrationsSettings {settings} {saving} onSave={handleSave} />
-        {:else if currentSection === 'tasks'}
-          <TasksSettings />
+            <p class="text-[13px] text-red-300">{error}</p>
+          </div>
         {/if}
+
+        {#if successMessage}
+          <div
+            class="mb-6 px-5 py-4 bg-green-500/5 border border-green-500/20 rounded-xl"
+          >
+            <p class="text-[13px] text-green-300">{successMessage}</p>
+          </div>
+        {/if}
+
+        <div
+          class="rounded-xl border border-border bg-card/60 p-6 lg:p-8 shadow-sm"
+        >
+          {#if currentSection === "general"}
+            <GeneralSettings {settings} {saving} onSave={handleSave} />
+          {:else if currentSection === "folder-rules"}
+            <FolderRulesSettings {settings} />
+          {:else if currentSection === "scheduled"}
+            <ScheduledScansSettings {settings} />
+          {:else if currentSection === "cleanup"}
+            <FilenameCleaningSettings {settings} {saving} onSave={handleSave} />
+          {:else if currentSection === "integrations"}
+            <IntegrationsSettings {settings} {saving} onSave={handleSave} />
+          {:else if currentSection === "tasks"}
+            <TasksSettings />
+          {/if}
+        </div>
       </div>
     </div>
   </div>
-  </div>
 {/if}