feat: PhotoPrism M0 bring-up — compose stack, web client, sidecar, migrate
Replace the legacy mule-image backend with PhotoPrism plus a thin SvelteKit client and a Node sidecar for endpoints PhotoPrism doesn't expose (file rename), and add a two-phase migrator (metadata via PUT, heaps → albums) for the existing Postgres library. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
78
web/src/routes/login/+page.svelte
Normal file
78
web/src/routes/login/+page.svelte
Normal file
@@ -0,0 +1,78 @@
|
||||
<script lang="ts">
|
||||
import { goto } from '$app/navigation';
|
||||
import { toast } from 'svelte-sonner';
|
||||
import { login } from '$lib/services/photoprism';
|
||||
import { isAuthenticated } from '$lib/stores/session.svelte';
|
||||
|
||||
let username = $state('');
|
||||
let password = $state('');
|
||||
let submitting = $state(false);
|
||||
|
||||
$effect(() => {
|
||||
if (isAuthenticated()) {
|
||||
void goto('/', { replaceState: true });
|
||||
}
|
||||
});
|
||||
|
||||
async function onSubmit(e: SubmitEvent) {
|
||||
e.preventDefault();
|
||||
if (submitting) return;
|
||||
submitting = true;
|
||||
try {
|
||||
await login(username, password);
|
||||
toast.success('Signed in');
|
||||
await goto('/', { replaceState: true });
|
||||
} catch (err) {
|
||||
const msg = err instanceof Error ? err.message : 'Login failed';
|
||||
toast.error(msg);
|
||||
} finally {
|
||||
submitting = false;
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="flex min-h-screen items-center justify-center bg-background p-6">
|
||||
<form
|
||||
onsubmit={onSubmit}
|
||||
class="w-full max-w-sm space-y-5 rounded-lg border border-border bg-card p-8 shadow-sm"
|
||||
>
|
||||
<header class="space-y-1">
|
||||
<h1 class="text-2xl font-semibold tracking-tight text-foreground">Mule</h1>
|
||||
<p class="text-sm text-muted-foreground">Sign in with your PhotoPrism account.</p>
|
||||
</header>
|
||||
|
||||
<label class="block space-y-1.5">
|
||||
<span class="text-sm font-medium text-foreground">Username</span>
|
||||
<input
|
||||
type="text"
|
||||
autocomplete="username"
|
||||
required
|
||||
bind:value={username}
|
||||
class="w-full rounded-md border border-input bg-background px-3 py-2 text-sm shadow-sm focus:outline-none focus:ring-2 focus:ring-ring"
|
||||
/>
|
||||
</label>
|
||||
|
||||
<label class="block space-y-1.5">
|
||||
<span class="text-sm font-medium text-foreground">Password</span>
|
||||
<input
|
||||
type="password"
|
||||
autocomplete="current-password"
|
||||
required
|
||||
bind:value={password}
|
||||
class="w-full rounded-md border border-input bg-background px-3 py-2 text-sm shadow-sm focus:outline-none focus:ring-2 focus:ring-ring"
|
||||
/>
|
||||
</label>
|
||||
|
||||
<button
|
||||
type="submit"
|
||||
disabled={submitting}
|
||||
class="w-full rounded-md bg-primary px-4 py-2 text-sm font-medium text-primary-foreground shadow-sm hover:opacity-90 disabled:opacity-50"
|
||||
>
|
||||
{submitting ? 'Signing in…' : 'Sign in'}
|
||||
</button>
|
||||
|
||||
<p class="text-xs text-muted-foreground">
|
||||
OIDC SSO ships in M4 when the IdP is wired up.
|
||||
</p>
|
||||
</form>
|
||||
</div>
|
||||
Reference in New Issue
Block a user