cecilia/components/pages/home/header.tsx

import Image from "next/image";

const Header: React.FC = async () => {
  const res = await fetch(
    "https://discord.com/api/v10/users/739702692393517076",
    {
      headers: {
        Authorization: `Bot ${process.env.DISCORD_TOKEN}`,
      },
    },
  );
  const data = await res.json();
  const avatarURL = `https://cdn.discordapp.com/avatars/739702692393517076/${data.avatar}.png?size=1024`;
  return (
    <header className="h-screen w-screen flex justify-center items-center">
      <div>
        <Image
          alt="avatar"
          src={avatarURL}
          width={156}
          height={156}
          className="mb-2 rounded-full"
        />
        <h1 className="text-2xl font-bold text-center">tuna2134</h1>
      </div>
    </header>
  );
};

export default Header;