// src/components/backlink/overview/actions-card.tsx
import { ArrowRightIcon } from "lucide-react";
import Link from "next/link";
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
import type { BacklinkOverview } from "@/lib/backlink/overview";
import { suggestedActions } from "@/lib/backlink/overview-logic";

export function ActionsCard({ ov }: { ov: BacklinkOverview }) {
  const actions = suggestedActions({
    lostSite: ov.risks.lostSite,
    toxicSite: ov.risks.toxicSite,
    prospects: ov.campaign.counters.prospect,
    opportunities: ov.opportunities.length,
  });
  return (
    <Card>
      <CardHeader>
        <CardTitle className="text-sm">Actions suggérées</CardTitle>
      </CardHeader>
      <CardContent>
        {actions.length === 0 ? (
          <p className="text-muted-foreground text-sm">Rien à faire ✅</p>
        ) : (
          <ul className="space-y-2">
            {actions.map((a) => (
              <li key={a.label}>
                <Link
                  href={a.href}
                  className="flex items-center justify-between gap-2 text-sm hover:underline"
                >
                  <span>{a.label}</span>
                  <ArrowRightIcon className="size-4 shrink-0" />
                </Link>
              </li>
            ))}
          </ul>
        )}
      </CardContent>
    </Card>
  );
}