import Image from "next/image";
import { getServerT, getServerLocale } from "@/lib/i18n/server";

interface ProfileCoverProps {
  locale: string;
}

export async function ProfileCover({ locale }: ProfileCoverProps) {
  const t = await getServerT(locale, "profile");

  return (
    <div className="pf-cover">
      <Image
        src="https://images.unsplash.com/photo-1495020689067-958852a7765e?w=2000&q=80"
        alt=""
        fill
        style={{ objectFit: "cover" }}
        priority
        unoptimized
      />
      {/* top-to-bottom gradient: transparent → dark */}
      <div
        style={{
          position: "absolute",
          inset: 0,
          background:
            "linear-gradient(to bottom, transparent 30%, rgba(0,0,0,0.55) 70%, rgba(0,0,0,0.82) 100%)",
          pointerEvents: "none",
        }}
      />
    </div>
  );
}