import type { Metadata } from "next";
import { getTranslations } from "next-intl/server";

import { SettingsBilling } from "@/components/dashboard/settings/SettingsBilling";
import { SettingsNotifications } from "@/components/dashboard/settings/SettingsNotifications";
import { SettingsProfile } from "@/components/dashboard/settings/SettingsProfile";
import { SettingsSecurity } from "@/components/dashboard/settings/SettingsSecurity";
import { getCurrentUser } from "@/lib/auth/session";
import { createPageMetadata } from "@/lib/metadata";
import { getUserProfile } from "@/lib/profiles";

export const metadata: Metadata = createPageMetadata({
  title: "Settings",
  description: "Manage your FlatRender account and workspace preferences.",
  path: "/dashboard/settings",
});

export const dynamic = "force-dynamic";

export default async function DashboardSettingsPage() {
  const t = await getTranslations("auto.appDashboardSettingsPage");
  // Auth is served by the V2 Identity service (JWT cookie), not Supabase.
  const user = await getCurrentUser();

  const email = user?.email ?? "";
  const u = (user ?? {}) as Record<string, unknown>;
  const str = (v: unknown) => (typeof v === "string" ? v : "");
  const initialProfile = {
    full_name: str(u.full_name),
    avatar_url: typeof u.avatar_url === "string" ? u.avatar_url : null,
    slogan: str(u.slogan),
    about_me: str(u.about_me),
    company_name: str(u.company_name),
    website_name: str(u.website_name),
    country_code: str(u.country_code),
    national_code: str(u.national_code),
    birth_date: str(u.birth_date),
    gender: str(u.gender),
  };

  const profile = user ? await getUserProfile(user.id) : null;
  const plan = profile?.plan ?? "free";

  return (
    <div className="flex flex-1 flex-col">
      {/* Page header */}
      <header className="border-b border-gray-100 bg-white px-6 py-4">
        <h1 className="font-heading text-xl font-bold text-neutral-900">{t("title")}</h1>
        <p className="mt-0.5 text-sm text-neutral-500">
          {t("subtitle")}
        </p>
      </header>

      {/* Content */}
      <div className="flex-1 p-6">
        <div className="mx-auto max-w-2xl space-y-6">
          <SettingsProfile email={email} initial={initialProfile} />
          <SettingsSecurity />
          <SettingsBilling plan={plan} />
          <SettingsNotifications />

          {/* Danger zone */}
          <div className="rounded-xl border border-red-100 bg-white p-6">
            <h2 className="font-heading text-base font-semibold text-red-600">{t("dangerZoneTitle")}</h2>
            <p className="mt-1 text-sm text-neutral-500">
              {t("dangerZoneDescription")}
            </p>
            <button
              type="button"
              className="mt-4 rounded-lg border border-red-200 px-4 py-2 text-sm font-semibold text-red-600 transition-colors hover:bg-red-50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-red-500 focus-visible:ring-offset-2"
            >
              {t("deleteAccount")}
            </button>
          </div>
        </div>
      </div>
    </div>
  );
}
