import { getTranslations, setRequestLocale } from "next-intl/server";
import { redirect } from "next/navigation";
import { connectDB } from "@/lib/db";
import { CharacterWish } from "@/models/CharacterWish";
import { getSessionClientId } from "@/lib/auth";
import { CharacterWishForm } from "@/components/account/CharacterWishForm";
import { AccountPageHeader } from "@/components/account/AccountPageHeader";

export const dynamic = "force-dynamic";

export default async function WishlistPage({ params }: { params: Promise<{ locale: string }> }) {
  const { locale } = await params;
  setRequestLocale(locale);
  const t = await getTranslations({ locale, namespace: "characterWishes" });

  const clientId = await getSessionClientId();
  if (!clientId) redirect(`/${locale}/login`);

  await connectDB();
  const wishes = await CharacterWish.find({ clientId }).sort({ createdAt: -1 }).lean();

  return (
    <div>
      <div className="max-w-2xl">
        <AccountPageHeader eyebrow={t("eyebrow")} title={t("title")} subtitle={t("intro")} />

        <div>
          <CharacterWishForm
            wishes={wishes.map((w) => ({
              id: String(w._id),
              character: w.character,
              fandom: w.fandom,
              note: w.note,
              status: w.status || "offen",
            }))}
            labels={{
              characterLabel: t("characterLabel"),
              fandomLabel: t("fandomLabel"),
              noteLabel: t("noteLabel"),
              submit: t("submit"),
              empty: t("empty"),
              remove: t("remove"),
              statusLabels: {
                offen: t("status.offen"),
                angenommen: t("status.angenommen"),
                abgelehnt: t("status.abgelehnt"),
                umgesetzt: t("status.umgesetzt"),
              },
            }}
          />
        </div>
      </div>
    </div>
  );
}