rework routing

src/views/Home.svelte

@@ -2,6 +2,7 @@
     import { onMount, createEventDispatcher } from 'svelte';
     import { invoke } from '@tauri-apps/api/tauri';
 
+    import { navigate } from '../lib/routing.js';
     import Icon from '../ui/Icon.svelte';
 
     export let appState;
@@ -11,9 +12,7 @@
         // will block until a request comes in
         let req = await appState.pendingRequests.get();
         appState.currentRequest = req;
-        console.log('Got credentials request from queue:');
-        console.log(req);
-        dispatch('navigate', {target: 'Approve'});
+        navigate('Approve');
     });
 
     let status = 'unknown';
@@ -40,7 +39,7 @@
     <div class="flex flex-col h-screen justify-center items-center space-y-4">
         <img src="/static/padlock-closed.svg" alt="An unlocked padlock" class="w-32" />
         <h2 class="text-2xl font-bold">Creddy is locked</h2>
-        <button class="btn btn-primary" on:click={() => dispatch('navigate', {target: 'Unlock'})}>Unlock</button>
+        <button class="btn btn-primary" on:click={() => navigate('Unlock')}>Unlock</button>
     </div>
 
 {:else if status === 'unlocked'}
@@ -50,7 +49,7 @@
     </div>
 
 {:else if status === 'empty'}
-    <button class="btn btn-primary" on:click={() => dispatch('navigate', {target: 'EnterCredentials'})}>
+    <button class="btn btn-primary" on:click={() => navigate('EnterCredentials')}>
         Enter Credentials
     </button>
 {/if}