creddy/src/views/Home.svelte

<script>
    import { onMount } from 'svelte';
    import { invoke } from '@tauri-apps/api/core';

    import { appState } from '../lib/state.js';
    import { navigate } from '../lib/routing.js';
    import Nav from '../ui/Nav.svelte';
    import Icon from '../ui/Icon.svelte';
    import Link from '../ui/Link.svelte';


    let launchBase = false;
    function launchTerminal() {
        invoke('launch_terminal', {base: launchBase});
        launchBase = false;
    }

    async function lock() {
        try {
            await invoke('lock');
        }
        catch (e) {
            console.log(e);
        }
    }
</script>


<Nav position="fixed">
    <h2 slot="title" class="text-3xl font-bold">Creddy</h2>
</Nav>

<div class="flex flex-col h-screen items-center justify-center p-4 space-y-4">
    <div class="flex flex-col items-center space-y-4">
        <h2 class="text-2xl font-bold">Waiting for requests</h2>
        <button class="btn btn-primary w-full" on:click={launchTerminal}>
            Launch Terminal
        </button>
        <label class="label cursor-pointer flex items-center space-x-2">
            <span class="label-text">Launch with long-lived credentials</span>
            <input type="checkbox" class="checkbox checkbox-sm" bind:checked={launchBase}>
        </label>
        <button class="btn btn-primary w-full" on:click={lock}>
            Lock Creddy
        </button>
        <Link target="ChangePassphrase" class="w-full">
            <button class="btn btn-primary w-full">Change passphrase</button>
        </Link>
        <Link target="ManageCredentials" class="w-full">
            <button class="btn btn-primary w-full">Manage credentials</button>
        </Link>
    </div>
</div>

{#if $appState.setupErrors.some(e => e.show)}
    <div class="toast">
        {#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>
                </div>
            {/if}
        {/each}
    </div>
{/if}