(init): Keys and Prefix Management

2026-06-21 23:56:50 -04:00
commit 80c747226f
50 changed files with 4631 additions and 0 deletions
@@ -0,0 +1,138 @@
+<script>
+	import HeaderBar from '$lib/client/components/HeaderBar.svelte';
+	import { resolve } from '$app/paths';
+	import { bS, iS } from '$lib/client/styles';
+	let { data } = $props();
+
+	const pageTitle = 'Auth Keys | TAM';
+
+	let auth = $state({
+		toggle: false,
+		pwd: ''
+	});
+
+	let authKeys = $state([]);
+	let newDesc = $state('');
+	let curKey = $state('');
+</script>
+
+<svelte:head>
+	<title>{pageTitle}</title>
+</svelte:head>
+
+<HeaderBar>
+	<a href={resolve('/settings')} class={bS.gray}>Back to Settings</a>
+	<div>Other Settings:</div>
+</HeaderBar>
+
+<div id="app_container" class="p-1">
+	<h1 class="text-xl font-bold">{pageTitle}</h1>
+	{#if !auth.toggle}
+		<div class="flex flex-row gap-1 items-center py-1">
+			<div>Password:</div>
+			<input type="password" class={iS.normal} bind:value={auth.pwd} />
+			<button
+				class={bS.gray}
+				onclick={async () => {
+					const res = await fetch('/api/auth', {
+						headers: { 'TAM-PWD': auth.pwd }
+					});
+					if (res.ok) {
+						auth.toggle = true;
+						const resData = await res.json();
+						authKeys = [...resData];
+						curKey = data.authKey;
+					} else {
+						auth.pwd = 'Invalid Password!';
+						setTimeout(() => (auth.pwd = ''), 3000);
+					}
+				}}>Login</button
+			>
+		</div>
+	{:else}
+		<table class="w-full my-1">
+			<thead class="text-left">
+				<tr>
+					<th>AuthKey</th>
+					<th>Description</th>
+					<th>Actions</th>
+				</tr>
+			</thead>
+			<tbody>
+				{#each authKeys as key (key.auth_key)}
+					<tr>
+						<td>{'*'.repeat(key.auth_key.length - 4) + key.auth_key.slice(-4)}</td>
+						<td>{key.description}</td>
+						<td
+							><div class="flex flex-row gap-1 items-center">
+								{#if curKey == key.auth_key}
+									<div>(Cur)</div>
+								{:else}
+									<button
+										class={bS.gray}
+										onclick={async () => {
+											const res = await fetch('/api/settings', {
+												method: 'POST',
+												headers: { 'Content-Type': 'application/json' },
+												body: JSON.stringify({ remote_key: key.auth_key })
+											});
+											if (res.ok) {
+												curKey = key.auth_key;
+											}
+										}}>Use</button
+									>
+								{/if}
+								<button
+									class={bS.red}
+									onclick={async () => {
+										const res = await fetch(`/api/auth?key_to_del=${key.auth_key}`, {
+											method: 'DELETE',
+											headers: { 'TAM-PWD': auth.pwd }
+										});
+										if (res.ok) {
+										  setTimeout(() => {
+    										  const newKeys = authKeys.filter(i => i.auth_key !== key.auth_key);
+    										  authKeys = [...newKeys];
+											}, 1)
+										}
+									}}>Delete</button
+								>
+							</div></td
+						>
+					</tr>
+				{/each}
+				<tr>
+					<td>New</td>
+					<td><input type="text" class="{iS.normal} w-full" bind:value={newDesc} /></td>
+					<td>
+						<button
+							class={bS.gray}
+							onclick={async () => {
+   							    if (newDesc) {
+    								const res = await fetch('/api/auth', {
+     									method: 'POST',
+     									headers: { 'TAM-PWD': auth.pwd, 'Content-Type': 'application/json' },
+     									body: JSON.stringify({ description: newDesc })
+    								});
+    								if (res.ok) {
+     									newDesc = '';
+     									const data = await res.json();
+     									authKeys = [...authKeys, data];
+    								}
+								}
+							}}>New Key</button
+						>
+					</td>
+				</tr>
+			</tbody>
+		</table>
+	{/if}
+</div>
+
+<style>
+	table td,
+	table th {
+		border: solid black 1px;
+		padding: 0.25rem;
+	}
+</style>