import Head from "next/head";
import Link from "next/link";
import Image from "next/image";
import { Box, Grid, Container, IconButton } from "@mui/material";
import { Apple as AppleIcon, Google as GoogleIcon } from "@mui/icons-material";
import { useTranslate } from "react-polyglot";
import { LanguageSelect } from "components/LanguageSelect";
import LeafcutterLogoLarge from "images/leafcutter-logo-large.png";
import { signIn, getSession } from "next-auth/react";
import { useAppContext } from "components/AppProvider";
const Login = ({ session }) => {
const t = useTranslate();
const {
colors: { leafcutterElectricBlue, lightGray },
typography: { h1, h4 },
} = useAppContext();
const buttonStyles = {
backgroundColor: lightGray,
borderRadius: 500,
width: "100%",
fontSize: "16px",
fontWeight: "bold",
};
return (
<>
Leafcutter: Login
{t("welcomeToLeafcutter")}
{t("welcomeToLeafcutterDescription")}
{!session ? (
signIn("google", {
callbackUrl: `${window.location.origin}/setup`,
})
}
>
{`${t("signInWith")} Google`}
signIn("apple", {
callbackUrl: `${window.location.origin}/setup`,
})
}
>
{`${t("signInWith")} Apple`}
{t("dontHaveAccount")}{" "}
{t("requestAccessHere")}
) : null}
{session ? (
<>
{`${t("welcome")}, ${
session.user.name ?? session.user.email
}.`}
{t("goHome")}
) : null}
);
};
export default Login;
export async function getServerSideProps(context) {
const session = (await getSession(context)) ?? null;
return {
props: { session },
};
}