Persist Plutonium keys by server ID and add key management

2026-09-17 15:54:10 -04:00
parent e4505a3be8
commit ae173517b6
10 changed files with 305 additions and 19 deletions
@@ -0,0 +1,105 @@
+<script lang="ts">
+    import { onMount } from 'svelte';
+    import Button from '$lib/ui/components/primitives/Button.svelte';
+    import Field from '$lib/ui/components/primitives/Field.svelte';
+    import Input from '$lib/ui/components/primitives/Input.svelte';
+
+    interface SavedKey { server_id: string; deployed: number; updated_at: string }
+    let keys = $state<SavedKey[]>([]);
+    let serverId = $state('');
+    let plutoKey = $state('');
+    let editing = $state(false);
+    let busy = $state(false);
+    let loading = $state(true);
+    let error = $state('');
+    let notice = $state('');
+
+    async function load() {
+        const res = await fetch('/api/server-keys');
+        if (!res.ok) throw new Error('Could not load server keys');
+        keys = (await res.json()).keys;
+    }
+    onMount(() => { load().catch(e => error = e.message).finally(() => loading = false); });
+    function reset() { serverId = ''; plutoKey = ''; editing = false; }
+    async function save(e: SubmitEvent) {
+        e.preventDefault();
+        busy = true; error = ''; notice = '';
+        try {
+            const res = await fetch('/api/server-keys', {
+                method: 'PUT', headers: { 'Content-Type': 'application/json' },
+                body: JSON.stringify({ serverId: serverId.trim(), plutoKey })
+            });
+            const body = await res.json();
+            if (!res.ok) throw new Error(body.error ?? 'Could not save key');
+            reset(); notice = 'Server key saved.'; await load();
+        } catch (e) { error = (e as Error).message; }
+        finally { busy = false; }
+    }
+    async function remove(id: string) {
+        if (!confirm(`Remove the saved key for ${id}? Running servers are unaffected.`)) return;
+        busy = true; error = ''; notice = '';
+        try {
+            const res = await fetch('/api/server-keys', {
+                method: 'DELETE', headers: { 'Content-Type': 'application/json' },
+                body: JSON.stringify({ serverId: id })
+            });
+            if (!res.ok) throw new Error('Could not remove key');
+            if (serverId === id) reset();
+            notice = 'Saved key removed.'; await load();
+        } catch (e) { error = (e as Error).message; }
+        finally { busy = false; }
+    }
+</script>
+
+<svelte:head><title>Server keys · Electric Cherry</title></svelte:head>
+<h1>Server keys</h1>
+<p>Save a Plutonium key for each server ID, even when the server is not deployed. Destroying a server keeps its saved key.</p>
+<form onsubmit={save}>
+    <h2>{editing ? 'Update key' : 'Add key'}</h2>
+    <Field label="Server ID" hint="Use a map slug and lobby number from 1 to 20, e.g. t5_zombie_theater_2.">
+        <Input bind:value={serverId} placeholder="t5_zombie_theater_2" required readonly={editing} disabled={busy} mono />
+    </Field>
+    <Field label="Plutonium server key" hint="Changes apply the next time this server ID is deployed.">
+        <Input type="password" bind:value={plutoKey} placeholder="Paste key" autocomplete="off" required disabled={busy} />
+    </Field>
+    <div class="actions">
+        <Button type="submit" variant="primary" disabled={busy || loading} loading={busy}>{editing ? 'Update key' : 'Save key'}</Button>
+        {#if editing}<Button onclick={reset} disabled={busy}>Cancel</Button>{/if}
+    </div>
+</form>
+{#if error}<p role="alert" class="error">{error}</p>{/if}
+{#if notice}<p role="status">{notice}</p>{/if}
+<h2>Saved keys</h2>
+{#if loading}<p>Loading keys…</p>
+{:else if keys.length === 0}<p>No saved keys yet. Add one above or save one when deploying a server.</p>
+{:else}
+    <div class="table-wrap"><table>
+        <thead><tr><th>Server ID</th><th>Status</th><th>Key</th><th>Actions</th></tr></thead>
+        <tbody>{#each keys as key (key.server_id)}
+            <tr>
+                <td><code>{key.server_id}</code></td>
+                <td>{key.deployed ? 'Deployed' : 'Not deployed'}</td>
+                <td aria-label="Key saved">••••••••</td>
+                <td><div class="actions">
+                    <Button disabled={busy} onclick={() => { serverId = key.server_id; plutoKey = ''; editing = true; error = ''; notice = ''; }}>Update</Button>
+                    <Button disabled={busy} onclick={() => remove(key.server_id)}>Remove</Button>
+                </div></td>
+            </tr>
+        {/each}</tbody>
+    </table></div>
+{/if}
+
+<style>
+    h1 { margin-top: 0; }
+    h2 { font-size: var(--text-md); }
+    p { color: var(--text-secondary); }
+    form { display: grid; gap: var(--space-4); max-width: 620px; padding: var(--space-6); background: var(--surface); border: 1px solid var(--border-subtle); border-radius: var(--radius-lg); margin: var(--space-6) 0; }
+    form h2 { margin: 0; }
+    .actions { display: flex; gap: var(--space-2); }
+    .table-wrap { overflow-x: auto; }
+    table { width: 100%; border-collapse: collapse; text-align: left; }
+    th, td { padding: var(--space-4); border-bottom: 1px solid var(--border-subtle); }
+    th { color: var(--text-tertiary); font-size: var(--text-sm); }
+    code { font-family: var(--font-mono); }
+    .error { color: var(--state-danger); }
+</style>