import { ProfileStatItem } from "@/types/profileStat";
import { memo } from "react";
import ProfileStat from "./ProfileStat";

export interface ProfileStatsProps {
  stats: readonly ProfileStatItem[];
}

const ProfileStats = memo(function ProfileStats({
  stats,
}: ProfileStatsProps) {
  return (
    <div className="grid grid-cols-2 gap-3 px-4 py-3">
      {stats.map(stat => (
        <ProfileStat key={stat.label} {...stat} />
      ))}
    </div>
  );
});

export default ProfileStats;