campbellwireless/trips
3
0
Fork 0
Code Issues 5 Pull Requests Actions Packages Projects Releases Wiki Activity

Add local authentication option (#37)
All checks were successful
Build and Push Image / docker-build-and-push (push) Successful in 2m20s
Details

Browse Source 
Co-authored-by: Shaun Campbell <shaun@campbellwireless.net>
Reviewed-on: #37
Co-authored-by: AI Agent <ai-agent@campbellwireless.net>
Co-committed-by: AI Agent <ai-agent@campbellwireless.net>
This commit was merged in pull request #37.
This commit is contained in:
AI Agent
2026-02-22 05:17:45 +00:00
committed by shaun
parent 42fe36ca86
commit fc8e80186d
26 changed files with 695 additions and 71 deletions
Download Patch File Download Diff File Expand all files Collapse all files

87
src/routes/login/+page.svelte
View File

@@ -1,22 +1,85 @@
<script lang="ts">
import { onMount } from 'svelte';
let { data } = $props();
let form: HTMLFormElement;
onMount(() => {
form.submit();
});
</script>
<svelte:head>
<title>Sign in — Trips</title>
</svelte:head>
<form bind:this={form} method="POST" action={data.signinUrl} class="hidden">
<input type="hidden" name="csrfToken" />
</form>
<div class="mx-auto flex min-h-[70vh] w-full max-w-3xl flex-col justify-center px-6 py-12">
<div class="mb-10">
<h1 class="text-3xl font-semibold text-slate-900">Sign in</h1>
<p class="mt-2 text-sm text-slate-500">
Choose a sign-in method to access Trips.
</p>
</div>
<div class="flex min-h-[60vh] items-center justify-center">
<p class="text-gray-500">Redirecting to sign in…</p>
{#if data.error}
<div class="mb-6 rounded-lg border border-rose-200 bg-rose-50 px-4 py-3 text-sm text-rose-700">
{data.error}
</div>
{/if}
<div class="grid gap-8 md:grid-cols-2">
<section class="rounded-2xl border border-slate-200 bg-white p-6 shadow-sm">
<h2 class="text-lg font-semibold text-slate-900">Synology account</h2>
<p class="mt-2 text-sm text-slate-500">
Use your Synology SSO account.
</p>
<form method="POST" action={data.signinUrl} class="mt-6">
<input type="hidden" name="csrfToken" />
<button
type="submit"
class="inline-flex w-full items-center justify-center rounded-lg bg-slate-900 px-4 py-2 text-sm font-semibold text-white transition hover:bg-slate-800"
>
Sign in with Synology
</button>
</form>
</section>
<section class="rounded-2xl border border-slate-200 bg-white p-6 shadow-sm">
<h2 class="text-lg font-semibold text-slate-900">Local account</h2>
<p class="mt-2 text-sm text-slate-500">
Sign in with your local username or email.
</p>
{#if data.localAuthEnabled}
<form method="POST" action={data.localSigninUrl} class="mt-6 space-y-4">
<input type="hidden" name="csrfToken" />
<div>
<label class="text-sm font-medium text-slate-700" for="identifier">
Username or email
</label>
<input
id="identifier"
name="identifier"
autocomplete="username"
class="mt-2 w-full rounded-lg border border-slate-200 px-3 py-2 text-sm text-slate-900 shadow-sm focus:border-slate-400 focus:outline-none"
required
/>
</div>
<div>
<label class="text-sm font-medium text-slate-700" for="password">Password</label>
<input
id="password"
name="password"
autocomplete="current-password"
type="password"
class="mt-2 w-full rounded-lg border border-slate-200 px-3 py-2 text-sm text-slate-900 shadow-sm focus:border-slate-400 focus:outline-none"
required
/>
</div>
<button
type="submit"
class="inline-flex w-full items-center justify-center rounded-lg border border-slate-300 bg-white px-4 py-2 text-sm font-semibold text-slate-900 transition hover:border-slate-400"
>
Sign in locally
</button>
</form>
{:else}
<div class="mt-6 rounded-lg border border-slate-200 bg-slate-50 px-4 py-3 text-sm text-slate-500">
Local sign-in is disabled.
</div>
{/if}
</section>
</div>
</div>