Mirrors/headscale-ui
1
0
Fork 0
mirror of https://github.com/gurucomputing/headscale-ui.git synced 2026-01-23 02:34:43 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

switchable registration and login window

Browse source
This commit is contained in:
Chris 2025-11-15 01:03:00 +00:00
parent 30989d5fce
commit ed2f0f2d35
3 changed files with 52 additions and 11 deletions
Download patch file Download diff file Expand all files Collapse all files

17
src/lib/components/login/auth-functions.svelte Normal file
View file

@ -0,0 +1,17 @@
<script module lang="ts">
import { appSettings } from '../common/state.svelte';
export async function loginOrRegister() {
try {
let authData = await appSettings.pb.collection('_superusers').authWithPassword('superadmin@breakglass.local', 'firsttimepasswordchangeme');
if (authData) {
appSettings.pb.authStore.clear();
return 'registration';
}
} catch (error) {
return 'login';
}
return 'none';
}
</script>

2
src/routes/+layout.svelte
View file

@ -35,7 +35,7 @@
}
// do an initial authentication check
checkAuth();
await checkAuth();
// delay load until page is hydrated
appSettings.appLoaded = true;

44
src/routes/login.html/+page.svelte
View file

@ -1,20 +1,44 @@
<script lang="ts">
import { appSettings } from '$lib/components/common/state.svelte';
import { fade } from 'svelte/transition';
import { loginOrRegister } from '$lib/components/login/auth-functions.svelte';
appSettings.navbarTitle = 'Login';
appSettings.sidebarDrawerOpen = false;
let loginType = $state('none');
loginOrRegister().then(function (loginResult) {
loginType = loginResult;
});
</script>
<div class="flex items-center justify-center">
<fieldset class="fieldset bg-base-200 border-base-300 rounded-box w-xs border p-4">
<legend class="fieldset-legend">Login</legend>
{#if loginType == 'login'}
<div in:fade class="flex items-center justify-center">
<fieldset class="fieldset bg-base-200 border-base-300 rounded-box w-xs border p-4">
<legend class="fieldset-legend">Login</legend>
<label class="label" for="email">Email</label>
<input type="email" class="input" id="email" placeholder="Email" />
<label class="label" for="email">Email</label>
<input type="email" class="input" id="email" placeholder="Email" />
<label class="label" for="password">Password</label>
<input type="password" class="input" id="password" placeholder="Password" />
<label class="label" for="password">Password</label>
<input type="password" class="input" id="password" placeholder="Password" />
<button class="btn btn-neutral mt-4">Login</button>
</fieldset>
</div>
<button class="btn btn-neutral mt-4">Login</button>
</fieldset>
</div>
{/if}
{#if loginType == 'registration'}
<div in:fade class="flex items-center justify-center">
<fieldset class="fieldset bg-base-200 border-base-300 rounded-box w-xs border p-4">
<legend class="fieldset-legend">First Time Registration</legend>
<label class="label" for="email">Email</label>
<input type="email" required class="input validator" id="email" placeholder="Email" />
<label class="label" for="password">New Password</label>
<input type="password" class="input" id="password" placeholder="Password" />
<button class="btn btn-neutral mt-4" type="submit">Register Admin Account</button>
</fieldset>
</div>
{/if}