import { getLocale, getTranslations } from "next-intl/server";

export async function CancelScheduledBanner({ plan, endsAt }: { plan: string; endsAt: Date }) {
  const t = await getTranslations("Settings.billing");
  const locale = await getLocale();
  const dateLocale = locale === "fr" ? "fr-FR" : locale === "es" ? "es-ES" : "en-US";
  const fmt = new Intl.DateTimeFormat(dateLocale, { dateStyle: "medium" });

  return (
    <div className="flex flex-col gap-1 rounded-lg border border-amber-500/40 bg-amber-500/10 p-4">
      <div className="text-sm font-semibold text-amber-700 dark:text-amber-300">
        {t("cancelScheduledTitle")}
      </div>
      <div className="text-xs text-muted-foreground">
        {t("cancelScheduledDescription", { plan, date: fmt.format(endsAt) })}
      </div>
    </div>
  );
}