// src/components/backlink/planning/planning-container.tsx
"use client";

import { useRouter } from "next/navigation";
import { useState } from "react";
import { toast } from "sonner";
import { Button } from "@/components/ui/button";
import type { PlanningCard } from "@/lib/backlink/planning";
import {
  fetchDisavowDomainsAction,
  moveBacklinkAction,
} from "@/lib/backlink/planning-actions";
import { buildDisavowFile } from "@/lib/backlink/planning-logic";
import type { BacklinkStatus } from "@/lib/db/domain-schema";
import { BacklinkDetailSheet } from "./backlink-detail-sheet";
import { PlanningBoard } from "./planning-board";

function triggerDownload(blob: Blob, filename: string) {
  const url = URL.createObjectURL(blob);
  const a = document.createElement("a");
  a.href = url;
  a.download = filename;
  document.body.appendChild(a);
  a.click();
  a.remove();
  URL.revokeObjectURL(url);
}

export function BacklinkPlanningContainer({
  initialCards,
  cadence,
  activeSiteId,
}: {
  initialCards: PlanningCard[];
  cadence: { thisMonth: number; lastMonth: number };
  activeSiteId: string;
}) {
  const router = useRouter();
  // Optimisme du drag — le remount key={siteId} re-seede au switch de site.
  const [cards, setCards] = useState(initialCards);
  const [openCard, setOpenCard] = useState<PlanningCard | null>(null);

  // Sync render-time : re-seede le board quand le RSC refresh livre de
  // nouvelles props (sinon `cards` reste figé sur le premier render).
  const [prevInitial, setPrevInitial] = useState(initialCards);
  if (prevInitial !== initialCards) {
    setPrevInitial(initialCards);
    setCards(initialCards);
  }

  function onMove(backlinkId: string, status: BacklinkStatus) {
    const current = cards.find((c) => c.backlinkId === backlinkId);
    if (!current || current.status === status) return;
    const prev = cards;
    const prevOpen = openCard;
    setCards((xs) =>
      xs.map((c) => (c.backlinkId === backlinkId ? { ...c, status } : c)),
    );
    setOpenCard((c) =>
      c && c.backlinkId === backlinkId ? { ...c, status } : c,
    );
    moveBacklinkAction(activeSiteId, backlinkId, status)
      .then((r) => {
        if (!r.ok) {
          setCards(prev);
          setOpenCard(prevOpen);
          toast.error("Échec du changement de statut");
          return;
        }
        router.refresh();
      })
      .catch(() => {
        setCards(prev);
        setOpenCard(prevOpen);
        toast.error("Échec du changement de statut");
      });
  }

  // Mise à jour optimiste des flags (toxic/disavow) — la sheet appelle
  // l'action serveur puis remonte ici pour refléter l'état immédiatement.
  function onFlagsChange(
    backlinkId: string,
    flags: { toxic?: boolean; disavow?: boolean },
  ) {
    setCards((xs) =>
      xs.map((c) => (c.backlinkId === backlinkId ? { ...c, ...flags } : c)),
    );
    setOpenCard((c) =>
      c && c.backlinkId === backlinkId ? { ...c, ...flags } : c,
    );
  }

  async function exportDisavow() {
    try {
      const domains = await fetchDisavowDomainsAction(activeSiteId);
      if (domains.length === 0) {
        toast.info("Aucun domaine flagué disavow");
        return;
      }
      const blob = new Blob([buildDisavowFile(domains)], {
        type: "text/plain",
      });
      triggerDownload(blob, `disavow-${activeSiteId}.txt`);
      toast.success(`${domains.length} domaine(s) exporté(s)`);
    } catch {
      toast.error("Échec de l'export disavow");
    }
  }

  return (
    <div className="space-y-3 p-4">
      <div className="flex flex-wrap items-center justify-between gap-2">
        <div>
          <h1 className="font-semibold text-lg">Planning netlinking</h1>
          <p className="text-muted-foreground text-sm">
            {cadence.thisMonth} lien(s) live ce mois · {cadence.lastMonth} le
            mois dernier
          </p>
        </div>
        <Button size="sm" variant="outline" onClick={exportDisavow}>
          Exporter disavow
        </Button>
      </div>
      <PlanningBoard cards={cards} onMove={onMove} onOpen={setOpenCard} />
      <BacklinkDetailSheet
        card={openCard}
        activeSiteId={activeSiteId}
        onOpenChange={(v) => {
          if (!v) setOpenCard(null);
        }}
        onMove={onMove}
        onFlagsChange={onFlagsChange}
      />
    </div>
  );
}