import { redirect } from "next/navigation";
import Link from "next/link";
import { ArrowLeft, Share2 } from "lucide-react";
import SocialLinksForm from "./social-links-form";
import { getCurrentRole } from "@/lib/auth";
import { getSocialLinks } from "@db/queries/settings";
import { PageHeader } from "@/components/ui";

export const metadata = { title: "Social links · Admin" };

export default async function SocialSettingsPage() {
  const { isAdmin } = await getCurrentRole();
  if (!isAdmin) redirect("/dashboard");

  const links = await getSocialLinks();

  return (
    <div className="max-w-2xl space-y-6">
      <div>
        <Link
          href="/admin/settings"
          className="mb-3 inline-flex items-center gap-1.5 text-sm text-be-muted hover:text-be-text"
        >
          <ArrowLeft className="h-4 w-4" />
          Site settings
        </Link>
        <PageHeader
          icon={Share2}
          title="Social links"
          description="The icons shown in the site footer. Add, reorder, or remove — changes go live on save."
        />
      </div>

      <SocialLinksForm links={links} />
    </div>
  );
}