51 lines
1.9 KiB
TypeScript
51 lines
1.9 KiB
TypeScript
import type { PageProps } from "keycloakify/login/pages/PageProps";
|
|
import type { KcContext } from "../KcContext";
|
|
import type { I18n } from "../i18n";
|
|
import { Button } from "@/components/ui/button";
|
|
import { Input } from "@/components/ui/input";
|
|
import { Label } from "@/components/ui/label";
|
|
|
|
export default function QrLoginShortStart(props: PageProps<Extract<KcContext, { pageId: "qr-login-short-start.ftl" }>, I18n>) {
|
|
const { kcContext, i18n, doUseDefaultCss, Template, classes } = props;
|
|
const { msg, msgStr } = i18n;
|
|
|
|
return (
|
|
<Template
|
|
kcContext={kcContext}
|
|
i18n={i18n}
|
|
doUseDefaultCss={doUseDefaultCss}
|
|
classes={classes}
|
|
displayInfo={false}
|
|
headerNode={msg("doShortCodeLogin")}
|
|
>
|
|
<form id="com-hadleyso-qrcode-short" className={classes?.kcFormClass} method="post">
|
|
<div className={classes?.kcFormGroupClass}>
|
|
<p className="kcQrShortCodeInfoClass">{msg("doShortCodeInfo")}</p>
|
|
|
|
<Label htmlFor="shortCode" className={classes?.kcLabelClass}>
|
|
{msg("doShortCode")}
|
|
</Label>
|
|
|
|
<Input
|
|
id="shortCode"
|
|
name="shortCode"
|
|
type="number"
|
|
inputMode="numeric"
|
|
pattern="\d{6}"
|
|
min={100000}
|
|
max={999999}
|
|
autoFocus
|
|
required
|
|
className={classes?.kcInputClass}
|
|
placeholder={msgStr("doShortCode")}
|
|
/>
|
|
</div>
|
|
|
|
<div className={classes?.kcFormGroupClass}>
|
|
<Button type="submit">{msgStr("doSubmit")}</Button>
|
|
</div>
|
|
</form>
|
|
</Template>
|
|
);
|
|
}
|