import { InfoStatCard } from "@/components/card/InfoStatCard";
import type { ClinicSnapshot } from "@/features/report/types/clinicSnapshot";
import { buildClinicSnapshotStatRows } from "@/features/report/ui/clinic/clinicSnapshotStatRows";

export type ClinicInfoStatGridProps = {
  data: ClinicSnapshot;
};

export function ClinicInfoStatGrid({ data }: ClinicInfoStatGridProps) {
  const rows = buildClinicSnapshotStatRows(data);

  return (
    <div className="grid grid-cols-1 md:grid-cols-2 gap-4 mb-8">
      {rows.map((field, i) => (
        <InfoStatCard
          key={field.label}
          icon={field.icon}
          label={field.label}
          value={field.value}
          style={{ animationDelay: `${i * 50}ms` }}
        />
      ))}
    </div>
  );
}