85 lines
2.7 KiB
TypeScript
85 lines
2.7 KiB
TypeScript
import { TranslatedString } from "@gnu-taler/taler-util";
|
|
import { notifyError, notifyInfo } from "@gnu-taler/web-util/browser";
|
|
import { VNode, h } from "preact";
|
|
import { UnwrapKeyError } from "../account.js";
|
|
import { createNewForm } from "../handlers/forms.js";
|
|
|
|
export function UnlockAccount({
|
|
onAccountUnlocked,
|
|
onRemoveAccount,
|
|
}: {
|
|
onAccountUnlocked: (password: string) => void;
|
|
onRemoveAccount: () => void;
|
|
}): VNode {
|
|
const Form = createNewForm<{
|
|
password: string;
|
|
}>();
|
|
|
|
return (
|
|
<div class="flex min-h-full flex-col ">
|
|
<div class="sm:mx-auto sm:w-full sm:max-w-md">
|
|
<h2 class="mt-6 text-center text-2xl font-bold leading-9 tracking-tight text-gray-900">
|
|
Account locked
|
|
</h2>
|
|
<p class="mt-6 text-lg leading-8 text-gray-600">
|
|
Your account is normally locked anytime you reload. To unlock type
|
|
your password again.
|
|
</p>
|
|
</div>
|
|
|
|
<div class="mt-10 sm:mx-auto sm:w-full sm:max-w-[480px] ">
|
|
<div class="bg-gray-100 px-6 py-6 shadow sm:rounded-lg sm:px-12">
|
|
<Form.Provider
|
|
initialValue={{
|
|
password: "welcometo.5146",
|
|
}}
|
|
onSubmit={async (v) => {
|
|
try {
|
|
await onAccountUnlocked(v.password!);
|
|
|
|
notifyInfo("Account unlocked" as TranslatedString);
|
|
} catch (e) {
|
|
if (e instanceof UnwrapKeyError) {
|
|
notifyError(
|
|
"Could not unlock account" as any,
|
|
e.message as any,
|
|
);
|
|
} else {
|
|
throw e;
|
|
}
|
|
}
|
|
}}
|
|
>
|
|
<div class="mb-4">
|
|
<Form.InputLine
|
|
label={"Password" as TranslatedString}
|
|
name="password"
|
|
type="password"
|
|
required
|
|
/>
|
|
</div>
|
|
|
|
<div class="mt-8">
|
|
<button
|
|
type="submit"
|
|
class="flex w-full justify-center rounded-md bg-indigo-600 px-3 py-1.5 text-sm font-semibold leading-6 text-white shadow-sm hover:bg-indigo-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600"
|
|
>
|
|
Unlock
|
|
</button>
|
|
</div>
|
|
</Form.Provider>
|
|
</div>
|
|
<button
|
|
type="button"
|
|
onClick={() => {
|
|
onRemoveAccount();
|
|
}}
|
|
class="m-4 block rounded-md bg-red-600 px-3 py-2 text-center text-sm text-white shadow-sm hover:bg-red-500 "
|
|
>
|
|
Remove account
|
|
</button>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|