use save dialog for settings instead of autosaving

This commit is contained in:
Joseph Montanaro 2023-10-08 22:06:30 -07:00
parent d4fa8966b2
commit 5e0ffc1155
4 changed files with 73 additions and 54 deletions

View File

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

View File

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

View File

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

View File

@ -14,15 +14,19 @@
import { backInOut } from 'svelte/easing'; 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; let error = null;
async function save() { async function save() {
console.log('updating config'); console.log('updating config');
try { try {
await invoke('save_config', {config: $appState.config}); await invoke('save_config', {config});
$appState.config = await invoke('get_config');
} }
catch (e) { catch (e) {
error = e; error = e;
$appState.config = await invoke('get_config');
} }
} }
@ -35,62 +39,60 @@
<h1 slot="title" class="text-2xl font-bold">Settings</h1> <h1 slot="title" class="text-2xl font-bold">Settings</h1>
</Nav> </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">
<SettingsGroup name="General"> <ToggleSetting title="Start on login" bind:value={config.start_on_login}>
<ToggleSetting title="Start on login" bind:value={$appState.config.start_on_login} on:update={save}> <svelte:fragment slot="description">
<svelte:fragment slot="description"> Start Creddy when you log in to your computer.
Start Creddy when you log in to your computer. </svelte:fragment>
</svelte:fragment> </ToggleSetting>
</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"> <svelte:fragment slot="description">
Minimize to the system tray at startup. Minimize to the system tray at startup.
</svelte:fragment> </svelte:fragment>
</ToggleSetting> </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"> <svelte:fragment slot="description">
How long to wait after a request is approved/denied before minimizing How long to wait after a request is approved/denied before minimizing
the window to tray. Only applicable if the window was minimized the window to tray. Only applicable if the window was minimized
to tray before the request was received. to tray before the request was received.
</svelte:fragment> </svelte:fragment>
</NumericSetting> </NumericSetting>
<Setting title="Update credentials"> <Setting title="Update credentials">
<Link slot="input" target="EnterCredentials"> <Link slot="input" target="EnterCredentials">
<button class="btn btn-sm btn-primary">Update</button> <button class="btn btn-sm btn-primary">Update</button>
</Link> </Link>
<svelte:fragment slot="description"> <svelte:fragment slot="description">
Update or re-enter your encrypted credentials. Update or re-enter your encrypted credentials.
</svelte:fragment> </svelte:fragment>
</Setting> </Setting>
<FileSetting <FileSetting
title="Terminal emulator" 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>.
</svelte:fragment>
</FileSetting>
</SettingsGroup>
<SettingsGroup name="Hotkeys"> >
<div class="space-y-4"> <svelte:fragment slot="description">
<p>Click on a keybinding to modify it. Use the checkbox to enable or disable a keybinding entirely.</p> 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>.
</svelte:fragment>
</FileSetting>
</SettingsGroup>
<div class="grid grid-cols-[auto_1fr_auto] gap-y-3 items-center"> <SettingsGroup name="Hotkeys">
<Keybind description="Show Creddy" value={$appState.config.hotkeys.show_window} on:update={save} /> <div class="space-y-4">
<Keybind description="Launch terminal" value={$appState.config.hotkeys.launch_terminal} on:update={save} /> <p>Click on a keybinding to modify it. Use the checkbox to enable or disable a keybinding entirely.</p>
</div>
<div class="grid grid-cols-[auto_1fr_auto] gap-y-3 items-center">
<Keybind description="Show Creddy" bind:value={config.hotkeys.show_window} />
<Keybind description="Launch terminal" bind:value={config.hotkeys.launch_terminal} />
</div> </div>
</SettingsGroup> </div>
</SettingsGroup>
</div> </div>
{/await}
{#if error} {#if error}
<div transition:fly={{y: 100, easing: backInOut, duration: 400}} class="toast"> <div transition:fly={{y: 100, easing: backInOut, duration: 400}} class="toast">
@ -104,4 +106,15 @@
</div> </div>
</div> </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} {/if}