pocketbase/ui/src/components/admins/PageAdminRequestPasswordRes...

66 lines
2.0 KiB
Svelte
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<script>
import { link } from "svelte-spa-router";
import ApiClient from "@/utils/ApiClient";
import FullPage from "@/components/base/FullPage.svelte";
import Field from "@/components/base/Field.svelte";
let email = "";
let isLoading = false;
let success = false;
async function submit() {
if (isLoading) {
return;
}
isLoading = true;
try {
await ApiClient.admins.requestPasswordReset(email);
success = true;
} catch (err) {
ApiClient.errorResponseHandler(err);
}
isLoading = false;
}
</script>
<FullPage>
{#if success}
<div class="alert alert-success">
<div class="icon"><i class="ri-checkbox-circle-line" /></div>
<div class="content">
<p>Check <strong class="txt-nowrap">{email}</strong> for the recovery link.</p>
</div>
</div>
{:else}
<form class="m-b-base" on:submit|preventDefault={submit}>
<div class="content txt-center m-b-sm">
<h4 class="m-b-xs">Forgotten admin password</h4>
<p>Enter the email associated with your account and well send you a recovery link:</p>
</div>
<Field class="form-field required" name="email" let:uniqueId>
<label for={uniqueId}>Email</label>
<!-- svelte-ignore a11y-autofocus -->
<input type="email" id={uniqueId} required autofocus bind:value={email} />
</Field>
<button
type="submit"
class="btn btn-lg btn-block"
class:btn-loading={isLoading}
disabled={isLoading}
>
<i class="ri-mail-send-line" />
<span class="txt">Send recovery link</span>
</button>
</form>
{/if}
<div class="content txt-center">
<a href="/login" class="link-hint" use:link>Back to login</a>
</div>
</FullPage>