import { FC } from "react";
import { Button } from "@mui/material";
import { signIn, signOut, useSession } from "next-auth/react";

const MyComponent: FC = () => {
  const { data: session } = useSession();

  return (
    <>
      {!session && (
        <>
          Not signed in <br />
          <Button variant="contained" onClick={signIn as any}>
            Sign in
          </Button>
        </>
      )}
      {session && (
        <>
          Signed in as {session.user?.email} <br />
          <Button variant="contained" onClick={signOut as any}>
            Sign out
          </Button>
        </>
      )}
    </>
  );
};

export default MyComponent;