2021-06-18 15:21:54 -04:00
|
|
|
import { Text } from "preact-i18n";
|
|
|
|
import styles from "../Login.module.scss";
|
|
|
|
import HCaptcha from "@hcaptcha/react-hcaptcha";
|
2021-06-18 17:47:25 -04:00
|
|
|
import { useContext, useEffect } from "preact/hooks";
|
2021-06-18 15:21:54 -04:00
|
|
|
import Preloader from "../../../components/ui/Preloader";
|
2021-06-18 17:47:25 -04:00
|
|
|
import { AppContext } from "../../../context/revoltjs/RevoltClient";
|
2021-06-18 15:21:54 -04:00
|
|
|
|
|
|
|
export interface CaptchaProps {
|
|
|
|
onSuccess: (token?: string) => void;
|
|
|
|
onCancel: () => void;
|
|
|
|
}
|
|
|
|
|
|
|
|
export function CaptchaBlock(props: CaptchaProps) {
|
2021-06-18 17:47:25 -04:00
|
|
|
const { client } = useContext(AppContext);
|
|
|
|
|
2021-06-18 15:21:54 -04:00
|
|
|
useEffect(() => {
|
2021-06-18 17:47:25 -04:00
|
|
|
if (!client.configuration?.features.captcha.enabled) {
|
2021-06-18 15:21:54 -04:00
|
|
|
props.onSuccess();
|
|
|
|
}
|
|
|
|
}, []);
|
|
|
|
|
2021-06-18 17:47:25 -04:00
|
|
|
if (!client.configuration?.features.captcha.enabled)
|
2021-06-18 15:21:54 -04:00
|
|
|
return <Preloader />;
|
|
|
|
|
|
|
|
return (
|
|
|
|
<div>
|
|
|
|
<HCaptcha
|
2021-06-18 17:47:25 -04:00
|
|
|
sitekey={client.configuration.features.captcha.key}
|
2021-06-18 15:21:54 -04:00
|
|
|
onVerify={token => props.onSuccess(token)}
|
|
|
|
/>
|
|
|
|
<div className={styles.footer}>
|
|
|
|
<a onClick={props.onCancel}>
|
|
|
|
<Text id="login.cancel" />
|
|
|
|
</a>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
);
|
|
|
|
}
|