links, navs, and more

This commit is contained in:
2023-04-24 22:16:25 -07:00
parent 53580d7919
commit f35352eedd
9 changed files with 109 additions and 66 deletions

View File

@ -1,9 +1,8 @@
<script>
import { invoke } from '@tauri-apps/api/tauri';
import { fly } from 'svelte/transition';
import { expoIn } from 'svelte/easing';
import { navigate } from '../lib/routing.js';
import Link from '../ui/Link.svelte';
import Icon from '../ui/Icon.svelte';
export let appState;
@ -22,21 +21,7 @@
}
}
function deny() {
navigate('ShowDenied');
}
function handleHotkey(event) {
if (event.shiftKey && (event.code === 'Enter' || event.code === 'NumpadEnter')) {
approve();
}
else if (event.code === 'Escape') {
deny();
}
}
var appName = null;
console.log(appName);
if (appState.currentRequest.clients.length === 1) {
let path = appState.currentRequest.clients[0].exe;
let m = path.match(/\/([^/]+?$)|\\([^\\]+?$)/);
@ -45,12 +30,6 @@
</script>
<svelte:window on:keydown={handleHotkey} />
<!-- <div
out:fly="{{x: '-100vw', duration: 200, easing: expoIn}}"
class="flex flex-col space-y-4 p-4 m-auto max-w-max h-screen justify-center"
> -->
<div class="flex flex-col space-y-4 p-4 m-auto max-w-max h-screen justify-center">
<!-- <div class="p-4 rounded-box border-2 border-neutral-content"> -->
<div class="space-y-1 mb-4">
@ -62,19 +41,20 @@
</div>
<div class="grid grid-cols-2">
<button class="btn btn-error justify-self-start" on:click={deny}>
Deny
&nbsp;
<!-- <kbd class="kbd kbd-xs bg-error border-base-100">Esc</kbd> -->
<kbd class="normal-case px-1 py-0.5 rounded border border-neutral">Esc</kbd>
</button>
<button class="btn btn-success justify-self-end" on:click={approve}>
Approve
&nbsp;
<kbd class="normal-case px-1 py-0.5 rounded border border-neutral">Shift</kbd>
<span class="mx-0.5">+</span>
<kbd class="normal-case px-1 py-0.5 rounded border border-neutral">Enter</kbd>
</button>
<Link target="ShowDenied" hotkey="Escape">
<button class="btn btn-error justify-self-start">
Deny
<kbd class="ml-2 normal-case px-1 py-0.5 rounded border border-neutral">Esc</kbd>
</button>
</Link>
<Link target="{approve}" hotkey="Enter" shift="{true}">
<button class="btn btn-success justify-self-end">
Approve
<kbd class="ml-2 normal-case px-1 py-0.5 rounded border border-neutral">Shift</kbd>
<span class="mx-0.5">+</span>
<kbd class="normal-case px-1 py-0.5 rounded border border-neutral">Enter</kbd>
</button>
</Link>
</div>
<!-- </div> -->
</div>

View File

@ -4,6 +4,7 @@
import { getRootCause } from '../lib/errors.js';
import { navigate } from '../lib/routing.js';
import Link from '../ui/Link.svelte';
import ErrorAlert from '../ui/ErrorAlert.svelte';
export let appState;
@ -42,18 +43,20 @@
</script>
{#if errorMsg}
<ErrorAlert>{errorMsg}</ErrorAlert>
{/if}
<form action="#" on:submit|preventDefault="{save}" class="form-control space-y-4 max-w-sm m-auto p-4 h-screen justify-center">
<h2 class="text-2xl font-bold text-center">Enter your credentials</h2>
<h2 class="text-2xl font-bold text-center">Enter your credentials</h2>
<input type="text" placeholder="AWS Access Key ID" bind:value="{AccessKeyId}" class="input input-bordered" />
{#if errorMsg}
<ErrorAlert bind:this="{alert}">{errorMsg}</ErrorAlert>
{/if}
<input type="password" placeholder="AWS Secret Access Key" bind:value="{SecretAccessKey}" class="input input-bordered" />
<input type="text" placeholder="AWS Access Key ID" bind:value="{AccessKeyId}" class="input input-bordered" />
<input type="password" placeholder="AWS Secret Access Key" bind:value="{SecretAccessKey}" class="input input-bordered" />
<input type="password" placeholder="Passphrase" bind:value="{passphrase}" class="input input-bordered" />
<input type="password" placeholder="Passphrase" bind:value="{passphrase}" class="input input-bordered" />
<input type="submit" class="btn btn-primary" />
<input type="submit" class="btn btn-primary" />
<Link target="Home" hotkey="Escape">
<button class="btn btn-sm btn-outline w-full">Cancel</button>
</Link>
</form>

View File

@ -3,6 +3,7 @@
import { invoke } from '@tauri-apps/api/tauri';
import { navigate } from '../lib/routing.js';
import Nav from '../ui/Nav.svelte';
import Icon from '../ui/Icon.svelte';
export let appState;
@ -22,34 +23,25 @@
</script>
<nav class="fixed top-0 grid grid-cols-2 w-full p-2">
<div id="nav-left flex">
<button class="btn btn-squre btn-ghost align-middle">
<Icon name="home" class="w-8 h-8 stroke-2" />
</button>
</div>
<div id="nav-right" class="justify-self-end">
<button class="align-middle btn btn-square btn-ghost">
<Icon name="cog-8-tooth" class="w-8 h-8 stroke-2" />
</button>
</div>
</nav>
<Nav />
{#if status === 'locked'}
<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={() => navigate('Unlock')}>Unlock</button>
<Link target="Unlock">
<button class="btn btn-primary">Unlock</button>
</Link>
</div>
{:else if status === 'unlocked'}
<div class="flex flex-col h-screen justify-center items-center space-y-4">
<img src="/static/padlock-open.svg" alt="An unlocked padlock" class="w-24" />
<h2 class="text-2xl font-bold">Creddy is ready</h2>
<h2 class="text-2xl font-bold">Waiting for requests</h2>
</div>
{:else if status === 'empty'}
<button class="btn btn-primary" on:click={() => navigate('EnterCredentials')}>
Enter Credentials
</button>
<Link target="EnterCredentials">
<button class="btn btn-primary">Enter Credentials</button>
</Link>
{/if}

View File

@ -43,7 +43,7 @@
{#if error}
<div class="flex flex-col h-screen items-center justify-center m-auto max-w-lg">
<ErrorAlert>
<svelte:fragment slot="message">{error}</svelte:fragment>
{error}
<button
slot="buttons"
class="btn btn-sm bg-transparent hover:bg-[#cd5a5a] border border-error-content text-error-content"

View File

@ -35,7 +35,7 @@
{#if error}
<div class="flex flex-col h-screen items-center justify-center m-auto max-w-lg">
<ErrorAlert>
<svelte:fragment slot="message">{error}</svelte:fragment>
{error}
<button
slot="buttons"
class="btn btn-sm bg-transparent hover:bg-[#cd5a5a] border border-error-content text-error-content"

View File

@ -4,6 +4,7 @@
import { navigate } from '../lib/routing.js';
import { getRootCause } from '../lib/errors.js';
import ErrorAlert from '../ui/ErrorAlert.svelte';
import Link from '../ui/Link.svelte';
export let appState;
@ -50,4 +51,7 @@
<input autofocus name="password" type="password" placeholder="correct horse battery staple" bind:value="{passphrase}" class="input input-bordered" />
<input type="submit" class="btn btn-primary" />
<Link target="Home" hotkey="Escape">
<button class="btn btn-outline btn-sm w-full">Cancel</button>
</Link>
</form>