use save dialog for settings instead of autosaving

src-tauri/src/main.rs

@@ -18,6 +18,7 @@ fn main() {
         },
         Some(("get", m)) => cli::get(m),
         Some(("exec", m)) => cli::exec(m),
+        Some(("shortcut", m)) => cli::invoke_shortcut(m),
         _ => unreachable!(),
     };
 

src-tauri/src/server/server_win.rs

@@ -6,12 +6,11 @@ use tokio::{
     sync::oneshot,
 };
 
-#[cfg(windows)]
 use windows::Win32:: {
     Foundation::HANDLE,
     System::Pipes::GetNamedPipeClientProcessId,
 };
-#[cfg(windows)]
+
 use std::os::windows::io::AsRawHandle;
 
 use tauri::async_runtime as rt;

src/ui/settings/NumericSetting.svelte

@@ -10,15 +10,21 @@
     export let min = null;
     export let max = null;
     export let decimal = false;
+    export let debounceInterval = 0;
 
     const dispatch = createEventDispatcher();
 
     $: localValue = value.toString();
     let lastInputTime = null;
     function debounce(event) {
-        lastInputTime = Date.now();
         localValue = localValue.replace(/[^-0-9.]/g, '');
 
+        if (debounceInterval === 0) {
+            updateValue(localValue);
+            return;
+        }
+
+        lastInputTime = Date.now();
         const eventTime = lastInputTime;
         const pendingValue = localValue;
         window.setTimeout(
@@ -28,7 +34,7 @@
                     updateValue(pendingValue);
                 }
             },
-            500
+            debounceInterval,
         )
     }
 

src/views/Settings.svelte

@@ -14,15 +14,19 @@
     import { backInOut } from 'svelte/easing';
 
 
+    // make an independent copy so it can differ from the main config object
+    let config = JSON.parse(JSON.stringify($appState.config));
+    $: configModified = JSON.stringify(config) !== JSON.stringify($appState.config);
+
     let error = null;
     async function save() {
         console.log('updating config');
         try {
-            await invoke('save_config', {config: $appState.config});
+            await invoke('save_config', {config});
+            $appState.config = await invoke('get_config');
         }
         catch (e) {
             error = e;
-            $appState.config = await invoke('get_config');
         }
     }
 
@@ -35,22 +39,21 @@
     <h1 slot="title" class="text-2xl font-bold">Settings</h1>
 </Nav>
 
-{#await invoke('get_config') then config}
+<div class="max-w-lg mx-auto mt-1.5 mb-24 p-4 space-y-16">
-    <div class="max-w-lg mx-auto mt-1.5 p-4 space-y-16">
     <SettingsGroup name="General">            
-            <ToggleSetting title="Start on login" bind:value={$appState.config.start_on_login} on:update={save}>
+        <ToggleSetting title="Start on login" bind:value={config.start_on_login}>
             <svelte:fragment slot="description">
                 Start Creddy when you log in to your computer.
             </svelte:fragment>
         </ToggleSetting>
 
-            <ToggleSetting title="Start minimized" bind:value={$appState.config.start_minimized} on:update={save}>
+        <ToggleSetting title="Start minimized" bind:value={config.start_minimized}>
             <svelte:fragment slot="description">
                 Minimize to the system tray at startup.
             </svelte:fragment>
         </ToggleSetting>
 
-            <NumericSetting title="Re-hide delay" bind:value={$appState.config.rehide_ms} min={0} unit="Milliseconds" on:update={save}>
+        <NumericSetting title="Re-hide delay" bind:value={config.rehide_ms} min={0} unit="Milliseconds">
             <svelte:fragment slot="description">
                 How long to wait after a request is approved/denied before minimizing
                 the window to tray. Only applicable if the window was minimized
@@ -69,8 +72,8 @@
 
         <FileSetting
             title="Terminal emulator"
-                bind:value={$appState.config.terminal.exec}
+            bind:value={config.terminal.exec}
-                on:update={save}
+        
         >
             <svelte:fragment slot="description">
                 Choose your preferred terminal emulator (e.g. <code>gnome-terminal</code> or <code>wt.exe</code>.) May be an absolute path or an executable discoverable on <code>$PATH</code>.
@@ -83,14 +86,13 @@
             <p>Click on a keybinding to modify it. Use the checkbox to enable or disable a keybinding entirely.</p>
 
             <div class="grid grid-cols-[auto_1fr_auto] gap-y-3 items-center">
-                    <Keybind description="Show Creddy" value={$appState.config.hotkeys.show_window} on:update={save} />
+                <Keybind description="Show Creddy" bind:value={config.hotkeys.show_window} />
-                    <Keybind description="Launch terminal" value={$appState.config.hotkeys.launch_terminal} on:update={save} />
+                <Keybind description="Launch terminal" bind:value={config.hotkeys.launch_terminal} />
             </div>
         </div>
     </SettingsGroup>
 
-    </div>
+</div>
-{/await}
 
 {#if error}
     <div transition:fly={{y: 100, easing: backInOut, duration: 400}} class="toast">
@@ -104,4 +106,15 @@
             </div>
         </div>
     </div>
+{:else if configModified}
+    <div transition:fly={{y: 100, easing: backInOut, duration: 400}} class="toast">
+        <div class="alert shadow-lg no-animation">
+            <span>You have unsaved changes.</span>
+
+            <div>
+                <!-- <button class="btn btn-sm btn-ghost">Cancel</button> -->
+                <buton class="btn btn-sm btn-primary" on:click={save}>Save</buton>
+            </div>
+        </div>
+    </div>
 {/if}