import { getSession } from "@/lib/auth/session";
import { Agent } from "@atproto/api";
import Image from "next/image";
import Link from "next/link";
import { redirect } from "next/navigation";

const Header = async () => {
	const session = await getSession();

	if (!session) {
		redirect("/");
	}

	const agent = new Agent(session);

	let profile;

	try {
		const response = await agent.getProfile({ actor: session.did });

		profile = response.data;
	} catch (error) {
		console.error("Error loading profile:", error);
	}

	return (
		<header className="bg-emerald-900 flex items-center justify-between p-4 rounded-2xl row-span-1">
			<Link href="/">
				<h1 className="text-amber-100 text-4xl">bambü</h1>
			</Link>
			<div className="h-16 relative w-16">
				<Image
					alt={`Profile picture for ${profile?.handle}`}
					className="object-cover rounded-full"
					fill
					priority
					src={profile?.avatar || ""}
				/>
			</div>
		</header>
	);
};

export default Header;