Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 | 356x 52x 52x 52x 52x 49x 49x 49x 49x 22x | import { ReactElement, useEffect, useState } from "react";
import { useTranslation } from "react-i18next";
import { useSearchParams } from "react-router";
import { z } from "zod";
import { postKompassiLoginRedirect } from "client/services/loginServices";
import { LoginErrorMessage } from "client/views/login/loginThunks";
import { ErrorMessage } from "client/components/ErrorMessage";
import { Button, ButtonStyle } from "client/components/Button";
export const KompassiLoginButton = (): ReactElement => {
const { t } = useTranslation();
const [searchParams, setSearchParams] = useSearchParams();
const [serverError, setServerError] = useState<LoginErrorMessage | null>(
null,
);
useEffect(() => {
const error = searchParams.get("error");
const result = z.enum(LoginErrorMessage).safeParse(error);
Eif (!result.success) {
return;
}
if (error) {
// eslint-disable-next-line react-hooks/set-state-in-effect
setServerError(result.data);
}
}, [searchParams]);
return (
<>
<Button
buttonStyle={ButtonStyle.PRIMARY}
onClick={async () => {
await postKompassiLoginRedirect();
}}
>
{t("loginView.kompassiLogin")}
</Button>
{serverError && (
<ErrorMessage
message={t(serverError)}
closeError={() => {
setServerError(null);
setSearchParams("");
}}
/>
)}
</>
);
};
|