// src/components/backlink/overview/pool-card.tsx
import { BarList } from "@/components/keywords/overview/bar-list";
import { Badge } from "@/components/ui/badge";
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
import type { BacklinkOverview } from "@/lib/backlink/overview";
import { SOURCE_KIND_LABEL } from "@/lib/backlink/types";

export function PoolCard({ ov }: { ov: BacklinkOverview }) {
  return (
    <Card>
      <CardHeader>
        <CardTitle className="text-sm">Pool — distribution DR</CardTitle>
      </CardHeader>
      <CardContent className="space-y-4">
        <BarList
          items={ov.pool.drBuckets.map((b) => ({
            label: b.label,
            value: b.count,
          }))}
        />
        <div className="flex flex-wrap gap-1.5 border-t pt-3">
          {ov.pool.byKind.map((k) => (
            <Badge key={k.kind} variant="secondary">
              {SOURCE_KIND_LABEL.get(k.kind) ?? k.kind} · {k.count}
            </Badge>
          ))}
          {ov.pool.byLanguage.map((l) => (
            <Badge key={l.language} variant="outline" className="uppercase">
              {l.language} · {l.count}
            </Badge>
          ))}
        </div>
      </CardContent>
    </Card>
  );
}