handle errors on config update

src/views/Settings.svelte

@@ -5,11 +5,18 @@
     import Nav from '../ui/Nav.svelte';
     import Link from '../ui/Link.svelte';
     import ErrorAlert from '../ui/ErrorAlert.svelte';
-    // import Setting from '../ui/settings/Setting.svelte';
     import { Setting, ToggleSetting, NumericSetting } from '../ui/settings';
 
+
+    let error = null;
     async function save() {
-        await invoke('save_config', {config: $appState.config});
+        try {
+            await invoke('save_config', {config: $appState.config});
+        }
+        catch (e) {
+            error = e;
+            $appState.config = await invoke('get_config');
+        }
     }
 </script>
 
@@ -57,3 +64,17 @@
         </Setting>
     </div>
 {/await}
+
+{#if error}
+    <div class="toast">
+        <div class="alert alert-error">
+            <div>
+                <span>{error}</span>
+            </div>
+
+            <div>
+                <button class="btn btn-sm btn-alert-error" on:click={() => error = null}>Ok</button>
+            </div>
+        </div>
+    </div>
+{/if}