Files
zeusina-keycloak/src/login/pages/QrLoginVerify.tsx
T

50 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 { Alert, AlertTitle } from "@/components/ui/alert";
export default function QrLoginVerify(props: PageProps<Extract<KcContext, { pageId: "qr-login-verify.ftl" }>, I18n>) {
const { kcContext, i18n, doUseDefaultCss, Template, classes } = props;
const { ua_device, ua_os, ua_agent, local_localized, tabId, approveURL, rejectURL } = kcContext;
const { msg } = i18n;
return (
<Template
kcContext={kcContext}
i18n={i18n}
doUseDefaultCss={doUseDefaultCss}
classes={classes}
displayInfo={false}
headerNode={msg("doQrCodeVerify")}
>
<div id="kc-qr-verify-form" className={classes?.kcFormClass}>
<Alert variant="destructive" className="mb-4 w-full">
<AlertTitle>{msg("doQrCodeWarning")}</AlertTitle>
</Alert>
<p className="kcQrDeviceInfoClass">
You are authorizing a session on a <b>{ua_device}</b> running <b>{ua_os}</b> / <b>{ua_agent}</b> in locale{" "}
<b>{local_localized}</b>.
</p>
{tabId && (
<p className="kcQrSessionClass">
Session: <b>{tabId}</b>
</p>
)}
<div className="kcQrVerifyButtonsClass">
<Button asChild size="lg">
<a href={approveURL}>{msg("doAccept")}</a>
</Button>
<Button variant="secondary" asChild size="lg">
<a href={rejectURL}>{msg("doDecline")}</a>
</Button>
</div>
</div>
</Template>
);
}