import "./StatisticsSection.scss";
import { apiInstance } from "@/shared/config/apiConfig";
import { useTranslations } from "next-intl";
import { getTranslations } from "next-intl/server";

interface ICategoryStatistics {
  category: number;
  total: number;
}

const StatisticsSection = async () => {
  const t = await getTranslations("general");

  const getCategoryStatistics = async () => {
    const res = await apiInstance.get<ICategoryStatistics[]>(
      "/report/category_count/"
    );

    return res.data;
  };

  const statistics = await getCategoryStatistics();

  const ROAD_TYPES_STATS: Record<number, string> = {
    1: t("broken_roads"),
    2: t("accident_hotspots"),
    3: t("local_defects"),
    4: t("repair_plans"),
    5: t("repaired"),
    6: t("fixed_local_defects"),
  };

  return (
    <section className="statistics-section">
      <ul className="statistics-section__list">
        {statistics.map((cat) => (
          <li key={cat.category}>
            <p>{ROAD_TYPES_STATS[cat.category]}</p>
            <span>{cat.total}</span>
          </li>
        ))}
      </ul>
    </section>
  );
};

export default StatisticsSection;