fix permissions errors and terminal launching

src/ui/settings/FileSetting.svelte

@@ -7,6 +7,13 @@
     export let value;
 
     const dispatch = createEventDispatcher();
+
+    async function pickFile() {
+        let file = await open();
+        if (file) {
+            value = file.path
+        }
+    }
 </script>
 
 
@@ -18,9 +25,10 @@
             bind:value
             on:change={() => dispatch('update', {value})}
         >
-        <button 
+        <button
+            type="button"
             class="btn btn-sm btn-primary"
-            on:click={async () => value = await open()}
+            on:click={pickFile}
         >Browse</button>
     </div>
     <slot name="description" slot="description"></slot>

src/views/Home.svelte

@@ -8,11 +8,15 @@
     import Icon from '../ui/Icon.svelte';
     import Link from '../ui/Link.svelte';
 
-
-    let launchBase = false;
-    function launchTerminal() {
-        invoke('launch_terminal', {base: launchBase});
-        launchBase = false;
+    let launchTerminalError;
+    async function launchTerminal() {
+        try {
+            await invoke('launch_terminal', {base: false});
+        }
+        catch (e) {
+            console.log(e);
+            launchTerminalError = e;
+        }
     }
 
     async function lock() {
@@ -49,16 +53,16 @@
         </Link>
 
         <Link target={lock}>
-            <div class="flex flex-col items-center gap-4 h-full max-w-56 rounded-box p-4 border border-accent hover:bg-base-200 transition-colors">
-                <Icon name="shield-check" class="size-12 stroke-1 stroke-accent" />
+            <div class="flex flex-col items-center gap-4 h-full max-w-56 rounded-box p-4 border border-warning hover:bg-base-200 transition-colors">
+                <Icon name="shield-check" class="size-12 stroke-1 stroke-warning" />
                 <h3 class="text-lg font-bold">Lock</h3>
                 <p class="text-sm">Lock Creddy.</p>
             </div>
         </Link>
 
         <Link target={() => invoke('exit')}>
-            <div class="flex flex-col items-center gap-4 h-full max-w-56 rounded-box p-4 border border-warning hover:bg-base-200 transition-colors">
-                <Icon name="arrow-right-start-on-rectangle" class="size-12 stroke-1 stroke-warning" />
+            <div class="flex flex-col items-center gap-4 h-full max-w-56 rounded-box p-4 border border-accent hover:bg-base-200 transition-colors">
+                <Icon name="arrow-right-start-on-rectangle" class="size-12 stroke-1 stroke-accent" />
                 <h3 class="text-lg font-bold">Exit</h3>
                 <p class="text-sm">Close Creddy.</p>
             </div>
@@ -71,10 +75,25 @@
         {#each $appState.setupErrors as error}
             {#if error.show}
                 <div class="alert alert-error shadow-lg">
-                    {error.msg}
-                    <button class="btn btn-sm btn-alert-error" on:click={() => error.show = false}>Ok</button>
+                    <span>{error.msg}</span>
+                    <div>
+                        <button class="btn btn-sm btn-alert-error" on:click={() => error.show = false}>Ok</button>
+                    </div>
                 </div>
             {/if}
         {/each}
     </div>
+{/if}
+
+{#if launchTerminalError}
+    <div class="toast">
+        <div class="alert alert-error shadow-lg">
+            <span>{launchTerminalError.msg || launchTerminalError}</span>
+            <div>
+                <button class="btn btn-alert-error" on:click={() => launchTerminalError = null}>
+                    Ok
+                </button>
+            </div>
+        </div>
+    </div>
 {/if}

src/views/Settings.svelte

@@ -29,6 +29,7 @@
         }
     }
 
+    window.getOsType = type;
     let osType = null;
     type().then(t => osType = t);
 </script>