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 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 | 1x 1x 1x 1x 1x 1x 1x 1x 11x 11x 11x 11x 11x 11x 11x 11x 11x 11x 11x 11x 11x 11x 11x 11x 11x 11x 11x 11x 11x 11x 11x 11x 11x 11x 11x 11x 11x 11x 11x 11x 11x 11x 11x 11x 11x 11x | import React from "react";
import { Row } from "react-bootstrap";
import { FaMicrosoft } from "react-icons/fa";
import { FcGoogle } from "react-icons/fc";
import SignInCard from "main/components/Auth/SignInCard";
import { useSystemInfo } from "main/utils/systemInfo";
import loginProviderSchools from "main/utils/loginProviderSchools";
export default function SignInContent({ onCardClick }) {
const { data: systemInfo } = useSystemInfo();
const microsoftIcon = () => (
<span data-testid={"SignInPage-microsoftIcon"}>
<FaMicrosoft size={"10em"} role={"img"} />
</span>
);
const googleIcon = () => (
<span data-testid={"SignInPage-googleIcon"}>
<FcGoogle size={"10em"} role={"img"} />
</span>
);
return (
<Row
xs={1}
md={2}
className={"g-5 d-flex gap-5 justify-content-center align-items-center"}
data-testid={"SignInPage-cardDisplay"}
>
{systemInfo.oauthLogin && (
<SignInCard
Icon={googleIcon}
title={"Sign in with Google"}
description={
<>
If you have credentials with these schools, sign in with Google
<ul>
{loginProviderSchools.google.map((school, index) => (
<li key={index}>{school}</li>
))}
</ul>
</>
}
url={systemInfo.oauthLogin}
testid={"google"}
onClick={onCardClick}
/>
)}
{systemInfo.activeDirectoryUrl && (
<SignInCard
Icon={microsoftIcon}
title={"Sign in with Microsoft"}
description={
<>
If you have credentials with these schools, sign in with Microsoft
<ul>
{loginProviderSchools.microsoft.map((school, index) => (
<li key={index}>{school}</li>
))}
</ul>
</>
}
url={systemInfo.activeDirectoryUrl}
testid={"microsoft"}
onClick={onCardClick}
/>
)}
</Row>
);
}
|