123 lines
4.1 KiB
Svelte
123 lines
4.1 KiB
Svelte
<script>
|
|
import { onMount } from 'svelte';
|
|
import { slide, fade } from 'svelte/transition';
|
|
import { writable } from 'svelte/store';
|
|
import { invoke } from '@tauri-apps/api/core';
|
|
|
|
import AwsCredential from './credentials/AwsCredential.svelte';
|
|
import ConfirmDelete from './credentials/ConfirmDelete.svelte';
|
|
import SshKey from './credentials/SshKey.svelte';
|
|
// import NewSshKey from './credentials/NewSshKey.svelte';
|
|
// import EditSshKey from './credentials/EditSshKey.svelte';
|
|
import Icon from '../ui/Icon.svelte';
|
|
import Nav from '../ui/Nav.svelte';
|
|
|
|
|
|
let records = null
|
|
$: awsRecords = (records || []).filter(r => r.credential.type === 'AwsBase');
|
|
$: sshRecords = (records || []).filter(r => r.credential.type === 'Ssh');
|
|
|
|
let defaults = writable({});
|
|
async function loadCreds() {
|
|
records = await invoke('list_credentials');
|
|
let pairs = records.filter(r => r.is_default).map(r => [r.credential.type, r.id]);
|
|
$defaults = Object.fromEntries(pairs);
|
|
}
|
|
onMount(loadCreds);
|
|
|
|
function newAws() {
|
|
records.push({
|
|
id: crypto.randomUUID(),
|
|
name: null,
|
|
is_default: false,
|
|
credential: {type: 'AwsBase', AccessKeyId: '', SecretAccessKey: ''},
|
|
isNew: true,
|
|
});
|
|
records = records;
|
|
}
|
|
|
|
function newSsh() {
|
|
records.push({
|
|
id: crypto.randomUUID(),
|
|
name: null,
|
|
is_default: false,
|
|
credential: {type: 'Ssh', algorithm: '', comment: '', private_key: '', public_key: '',},
|
|
isNew: true,
|
|
});
|
|
records = records;
|
|
}
|
|
|
|
let confirmDelete;
|
|
function handleDelete(evt) {
|
|
const record = evt.detail;
|
|
if (record.isNew) {
|
|
records = records.filter(r => r.id !== record.id);
|
|
}
|
|
else {
|
|
confirmDelete.confirm(record);
|
|
}
|
|
}
|
|
</script>
|
|
|
|
|
|
<Nav>
|
|
<h1 slot="title" class="text-2xl font-bold">Credentials</h1>
|
|
</Nav>
|
|
|
|
<div class="max-w-xl mx-auto mb-12 flex flex-col gap-y-12 justify-center">
|
|
<div class="flex flex-col gap-y-4">
|
|
<div class="divider">
|
|
<h2 class="text-xl font-bold">AWS Access Keys</h2>
|
|
</div>
|
|
|
|
{#if awsRecords.length > 0}
|
|
{#each awsRecords as record (record.id)}
|
|
<AwsCredential
|
|
{record} {defaults}
|
|
on:update={loadCreds}
|
|
on:delete={handleDelete}
|
|
/>
|
|
{/each}
|
|
<button class="btn btn-primary btn-wide mx-auto" on:click={newAws}>
|
|
<Icon name="plus-circle-mini" class="size-5" />
|
|
Add
|
|
</button>
|
|
{:else if records !== null}
|
|
<div class="flex flex-col gap-6 items-center rounded-box border-2 border-dashed border-neutral-content/30 p-6">
|
|
<div>You have no saved AWS credentials.</div>
|
|
<button class="btn btn-primary btn-wide mx-auto" on:click={newAws}>
|
|
<Icon name="plus-circle-mini" class="size-5" />
|
|
Add
|
|
</button>
|
|
</div>
|
|
{/if}
|
|
</div>
|
|
|
|
<div class="flex flex-col gap-y-4">
|
|
<div class="divider">
|
|
<h2 class="text-xl font-bold">SSH Keys</h2>
|
|
</div>
|
|
|
|
{#if sshRecords.length > 0}
|
|
{#each sshRecords as record (record.id)}
|
|
<SshKey {record} on:save={loadCreds} on:delete={handleDelete} />
|
|
{/each}
|
|
<button class="btn btn-primary btn-wide mx-auto" on:click={newSsh}>
|
|
<Icon name="plus-circle-mini" class="size-5" />
|
|
Add
|
|
</button>
|
|
{:else if records !== null}
|
|
<div class="flex flex-col gap-6 items-center rounded-box border-2 border-dashed border-neutral-content/30 p-6">
|
|
<div>You have no saved SSH keys.</div>
|
|
<button class="btn btn-primary btn-wide mx-auto" on:click={newSsh}>
|
|
<Icon name="plus-circle-mini" class="size-5" />
|
|
Add
|
|
</button>
|
|
</div>
|
|
{/if}
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<ConfirmDelete bind:this={confirmDelete} on:confirm={loadCreds} />
|