jfmonty2/creddy
2
1
Fork 0
Code Issues Pull Requests Packages Projects Releases 12 Wiki Activity

move app state to store

Browse Source
This commit is contained in:
Joseph Montanaro 2023-04-25 08:49:00 -07:00
parent 865b7fd5c4
commit 6f9cd6b471
11 changed files with 63 additions and 65 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
src/App.svelte
View File

@ -2,25 +2,17 @@
import { emit, listen } from '@tauri-apps/api/event';
import { invoke } from '@tauri-apps/api/tauri';
import { appState } from './lib/state.js';
import { currentView } from './lib/routing.js';
import queue from './lib/queue.js';
const VIEWS = import.meta.glob('./views/*.svelte', {eager: true});
var appState = {
currentRequest: null,
pendingRequests: queue(),
credentialStatus: 'locked',
}
listen('credentials-request', (tauriEvent) => {
appState.pendingRequests.put(tauriEvent.payload);
$appState.pendingRequests.put(tauriEvent.payload);
});
</script>
<svelte:component
this={VIEWS[`./views/${$currentView}.svelte`].default}
bind:appState={appState}
this="{$currentView}"
/>
<!-- <svelte:component this="{VIEWS['./views/ShowApproved.svelte'].default}" bind:appState="{appState}" /> -->

11
src/lib/routing.js
View File

@ -1,8 +1,13 @@
import { writable } from 'svelte/store';
import { writable, derived } from 'svelte/store';
const VIEWS = import.meta.glob('../views/*.svelte', {eager: true});
export const currentView = writable('Home');
export let currentView = writable();
export function navigate(viewName) {
currentView.set(viewName);
let view = VIEWS[`../views/${viewName}.svelte`].default;
currentView.set(view);
}
navigate('Home');

9
src/lib/state.js Normal file
View File

@ -0,0 +1,9 @@
import { writable } from 'svelte/store';
import queue from './queue.js';
export let appState = writable({
currentRequest: null,
pendingRequests: queue(),
credentialStatus: 'locked',
});

6
src/ui/Link.svelte
View File

@ -1,9 +1,9 @@
<script>
import { onMount } from 'svelte';
import { currentView } from '../lib/routing.js';
import { navigate } from '../lib/routing.js';
export let target = $currentView;
export let target;
export let hotkey = null;
export let ctrl = false
export let alt = false;
@ -11,7 +11,7 @@
function click() {
if (typeof target === 'string') {
$currentView = target;
navigate(target);
}
else if (typeof target === 'function') {
target();

9
src/views/Approve.svelte
View File

@ -2,11 +2,10 @@
import { invoke } from '@tauri-apps/api/tauri';
import { navigate } from '../lib/routing.js';
import { appState } from '../lib/state.js';
import Link from '../ui/Link.svelte';
import Icon from '../ui/Icon.svelte';
export let appState;
async function approve() {
let status = await invoke('get_session_status');
@ -22,8 +21,8 @@
}
var appName = null;
if (appState.currentRequest.clients.length === 1) {
let path = appState.currentRequest.clients[0].exe;
if ($appState.currentRequest.clients.length === 1) {
let path = $appState.currentRequest.clients[0].exe;
let m = path.match(/\/([^/]+?$)|\\([^\\]+?$)/);
appName = m[1] || m[2];
}
@ -34,7 +33,7 @@
<!-- <div class="p-4 rounded-box border-2 border-neutral-content"> -->
<div class="space-y-1 mb-4">
<h2 class="text-xl font-bold">{appName ? `"${appName}"` : 'An appplication'} would like to access your AWS credentials.</h2>
{#each appState.currentRequest.clients as client}
{#each $appState.currentRequest.clients as client}
<p>Path: {client ? client.exe : 'Unknown'}</p>
<p>PID: {client ? client.pid : 'Unknown'}</p>
{/each}

4
src/views/EnterCredentials.svelte
View File

@ -3,11 +3,11 @@
import { invoke } from '@tauri-apps/api/tauri';
import { getRootCause } from '../lib/errors.js';
import { appState } from '../lib/state.js';
import { navigate } from '../lib/routing.js';
import Link from '../ui/Link.svelte';
import ErrorAlert from '../ui/ErrorAlert.svelte';
export let appState;
let errorMsg = null;
let alert;
@ -19,7 +19,7 @@
try {
await invoke('save_credentials', {credentials, passphrase});
if (appState.currentRequest) {
if ($appState.currentRequest) {
navigate('ShowApproved');
}
else {

10
src/views/Home.svelte
View File

@ -1,18 +1,18 @@
<script>
import { onMount, createEventDispatcher } from 'svelte';
import { onMount } from 'svelte';
import { invoke } from '@tauri-apps/api/tauri';
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';
export let appState;
const dispatch = createEventDispatcher();
onMount(async () => {
// will block until a request comes in
let req = await appState.pendingRequests.get();
appState.currentRequest = req;
let req = await $appState.pendingRequests.get();
$appState.currentRequest = req;
navigate('Approve');
});

2
src/views/Settings.svelte
View File

@ -1,8 +1,6 @@
<script>
import Nav from '../ui/Nav.svelte';
import Link from '../ui/Link.svelte';
export let appState;
</script>

28
src/views/ShowApproved.svelte
View File

@ -1,28 +1,28 @@
<script>
import { onMount } from 'svelte';
import { fly, draw, fade } from 'svelte/transition';
import { expoIn, expoOut, expoInOut, linear } from 'svelte/easing';
import { draw, fade } from 'svelte/transition';
import { emit } from '@tauri-apps/api/event';
import { invoke } from '@tauri-apps/api/tauri';
import { appState } from '../lib/state.js';
import { navigate } from '../lib/routing.js';
import ErrorAlert from '../ui/ErrorAlert.svelte';
import Icon from '../ui/Icon.svelte';
import Link from '../ui/Link.svelte';
export let appState;
let success = false;
let error = null;
async function respond() {
let response = {
id: appState.currentRequest.id,
id: $appState.currentRequest.id,
approval: 'Approved',
};
try {
await invoke('respond', {response});
success = true;
appState.currentRequest = null;
$appState.currentRequest = null;
window.setTimeout(() => navigate('Home'), 1000);
}
catch (e) {
@ -44,20 +44,18 @@
<div class="flex flex-col h-screen items-center justify-center m-auto max-w-lg">
<ErrorAlert>
{error}
<button
slot="buttons"
class="btn btn-sm bg-transparent hover:bg-[#cd5a5a] border border-error-content text-error-content"
on:click="{() => navigate('Home')}"
>
Ok
</button>
<Link target="Home">
<button
slot="buttons"
class="btn btn-sm bg-transparent hover:bg-[#cd5a5a] border border-error-content text-error-content"
>
Ok
</button>
</Link>
</ErrorAlert>
</div>
{:else if success}
<!-- <div on:click="{() => {console.log('redraw'); k += 1}}" in:fly="{{x: '60vw', duration: 400, easing: expoOut}}" class="flex flex-col h-screen items-center justify-center max-w-max m-auto"> -->
<div class="flex flex-col h-screen items-center justify-center max-w-max m-auto">
<!-- <Icon name="check-circle" class="w-36 h-36" /> -->
<svg xmlns="http://www.w3.org/2000/svg" class="w-36 h-36" fill="none" viewBox="0 0 24 24" stroke-width="1" stroke="currentColor">
<path in:draw="{{duration: 500}}" stroke-linecap="round" stroke-linejoin="round" d="M9 12.75L11.25 15 15 9.75M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
</svg>

28
src/views/ShowDenied.svelte
View File

@ -1,26 +1,26 @@
<script>
import { onMount } from 'svelte';
import { fade, draw } from 'svelte/transition';
import { expoOut } from 'svelte/easing';
import { draw, fade } from 'svelte/transition';
import { emit } from '@tauri-apps/api/event';
import { invoke } from '@tauri-apps/api/tauri';
import { appState } from '../lib/state.js';
import { navigate } from '../lib/routing.js';
import ErrorAlert from '../ui/ErrorAlert.svelte';
import Icon from '../ui/Icon.svelte';
import Link from '../ui/Link.svelte';
export let appState;
let error = null;
async function respond() {
let response = {
id: appState.currentRequest.id,
id: $appState.currentRequest.id,
approval: 'Denied',
}
try {
await invoke('respond', {response});
appState.currentRequest = null;
$appState.currentRequest = null;
window.setTimeout(() => navigate('Home'), 1000);
}
catch (e) {
@ -36,20 +36,18 @@
<div class="flex flex-col h-screen items-center justify-center m-auto max-w-lg">
<ErrorAlert>
{error}
<button
slot="buttons"
class="btn btn-sm bg-transparent hover:bg-[#cd5a5a] border border-error-content text-error-content"
on:click="{() => dispatch('navigate', {target: 'Home'})}"
>
Ok
</button>
<Link target="Home">
<button
slot="buttons"
class="btn btn-sm bg-transparent hover:bg-[#cd5a5a] border border-error-content text-error-content"
>
Ok
</button>
</Link>
</ErrorAlert>
</div>
{:else}
<!-- <div in:fly="{{x: '60vw', duration: 400, easing: expoOut}}" class="flex flex-col items-center justify-center h-screen max-w-max m-auto"> -->
<div class="flex flex-col items-center justify-center h-screen max-w-max m-auto">
<!-- <Icon name="x-circle" class="w-36 h-36" /> -->
<svg xmlns="http://www.w3.org/2000/svg" class="w-36 h-36" fill="none" viewBox="0 0 24 24" stroke-width="1" stroke="currentColor">
<path in:draw="{{duration: 500}}" stroke-linecap="round" stroke-linejoin="round" d="M9.75 9.75l4.5 4.5m0-4.5l-4.5 4.5M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
</svg>

7
src/views/Unlock.svelte
View File

@ -1,13 +1,12 @@
<script>
import { invoke } from '@tauri-apps/api/tauri';
import { appState } from '../lib/state.js';
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;
let errorMsg = null;
let alert;
@ -15,8 +14,8 @@
async function unlock() {
try {
let r = await invoke('unlock', {passphrase});
appState.credentialStatus = 'unlocked';
if (appState.currentRequest) {
$appState.credentialStatus = 'unlocked';
if ($appState.currentRequest) {
navigate('ShowApproved');
}
else {