import { useTranslations } from "next-intl";
import FeatureItem from "./FeatureItem";

import { PackageProperty } from "@/types/package";

interface FeaturesListProps {
  features: PackageProperty[];
  billingCycle?: "month" | "year";
  /** Whether the *other* billing cycle has features — points the visitor there instead of the generic empty message. */
  otherCycleHasFeatures?: boolean;
}

export default function FeaturesList({
  features,
  billingCycle,
  otherCycleHasFeatures = false,
}: FeaturesListProps) {
  const t = useTranslations();

  if (features.length === 0) {
    const message = otherCycleHasFeatures
      ? billingCycle === "year"
        ? t("noFeaturesCheckMonthly")
        : t("noFeaturesCheckYearly")
      : t("noFeatures");
    return <p className="text-[14px] text-white">{message}</p>;
  }

  return (
    <div className="flex flex-col gap-3">
      {features.map((feature, index) => (
        <FeatureItem key={index} property={feature} />
      ))}
    </div>
  );
}