import { getTranslations, setRequestLocale } from "next-intl/server";
import { Link } from "@/i18n/navigation";
import { requireUser } from "@/lib/session";

export default async function ToolsPage({
  params,
}: {
  params: Promise<{ locale: string }>;
}) {
  const { locale } = await params;
  setRequestLocale(locale);
  await requireUser();
  const t = await getTranslations("tools");
  const items = [
    { href: "/dashboard/tools/quick", title: t("quick"), text: t("quickText") },
    { href: "/dashboard/tools/free", title: t("free"), text: t("freeText") },
    { href: "/dashboard/tools/bulk", title: t("bulk"), text: t("bulkText") },
    { href: "/dashboard/tools/fullpage", title: t("fullpage"), text: t("fullpageText") },
    { href: "/dashboard/tools/api", title: t("api"), text: t("apiText") },
    { href: "/dashboard/tools/bookmarklet", title: t("bookmarklet"), text: t("bookmarkletText") },
  ];
  return (
    <div className="space-y-6">
      <h1 className="page-title">{t("title")}</h1>
      <div className="grid gap-4 md:grid-cols-2">
        {items.map((item) => (
          <Link key={item.href} href={item.href} className="card card-interactive block p-5">
            <h2 className="text-lg font-semibold">{item.title}</h2>
            <p className="mt-2 text-sm text-muted">{item.text}</p>
          </Link>
        ))}
      </div>
    </div>
  );
}
