import { prisma } from "@repo/db";
import { getServerSession } from "../../api/auth/[...nextauth]/auth";
import { ProfileForm, SocialForm, PasswordForm, DeleteForm } from "./_components/forms";
import { GearIcon } from "@radix-ui/react-icons";
import { Error } from "_components/Error";

export default async function Page() {
	const session = await getServerSession();
	if (!session)
		return <Error statusCode={401} title="Du musst angemeldet sein, um diese Seite zu sehen." />;
	const user = await prisma.user.findFirst({
		where: {
			id: session.user.id,
		},
		include: {
			discordAccounts: true,
			Penaltys: true,
		},
	});
	const userPenaltys = await prisma.penalty.findMany({
		where: {
			userId: session.user.id,
			until: {
				gte: new Date(),
			},
			type: {
				in: ["TIME_BAN", "BAN"],
			},

			suspended: false,
		},
	});
	if (!user) return <Error statusCode={401} title="Dein Account wurde nicht gefunden" />;
	const discordAccount = user?.discordAccounts[0];
	return (
		<div className="grid grid-cols-6 gap-4">
			<div className="col-span-full">
				<p className="text-2xl font-semibold text-left flex items-center gap-2">
					<GearIcon className="w-5 h-5" /> Einstellungen
				</p>
			</div>
			<div className="card bg-base-200 shadow-xl mb-4 col-span-6 xl:col-span-3">
				<ProfileForm user={user} penaltys={userPenaltys} discordAccount={discordAccount} />
			</div>
			<div className="card bg-base-200 shadow-xl mb-4 col-span-6 xl:col-span-3">
				<SocialForm discordAccount={discordAccount} user={user} />
			</div>
			<div className="card bg-base-200 shadow-xl mb-4 col-span-6 xl:col-span-3">
				<PasswordForm />
			</div>
			<div className="card bg-base-200 shadow-xl mb-4 col-span-6 xl:col-span-3">
				<DeleteForm user={user} penaltys={userPenaltys} />
			</div>
		</div>
	);
}