// src/components/onboarding/activation-card.tsx — carte « Démarrage » de la
// sidebar. Purement pilotée par ses props : l'état est dérivé côté serveur par
// getActivationSnapshot() et descend depuis le layout (app). Aucun fetch au
// montage — l'ancienne version relançait la dérivation à chaque navigation, à
// chaque changement de site et sur window.focus.
"use client";

import { useTranslations } from "next-intl";
import { useState } from "react";
import {
  Popover,
  PopoverContent,
  PopoverTrigger,
} from "@/components/ui/popover";
import { SidebarMenuItem } from "@/components/ui/sidebar";
import { dismissActivationAction } from "@/lib/onboarding/activation/actions";
import {
  ACTIVATION_STEPS,
  doneCount,
  firstIncompleteStep,
  requiredComplete,
} from "@/lib/onboarding/activation/steps";
import type { ActivationSnapshot } from "@/lib/onboarding/activation/types";
import { ActivationErrorBoundary } from "./activation-error-boundary";
import { ActivationPanel } from "./activation-panel";

export function ActivationCard({
  activation,
}: {
  activation: ActivationSnapshot | null;
}) {
  const t = useTranslations("Activation");
  const [open, setOpen] = useState(false);
  // Masquage optimiste : le serveur re-rendra sans la carte au prochain
  // passage. On ne « dé-masque » jamais localement, donc pas de résurrection.
  const [dismissed, setDismissed] = useState(false);

  const flags = activation?.flags;
  // Membre sans aucun site accessible ET sans droit d'en créer : aucune des
  // cinq étapes de site n'est exécutable pour lui, requiredComplete() ne sera
  // donc jamais vrai — la carte reste affichée, mais en mode explication, sans
  // CTA (voir ActivationPanel).
  //
  // On pose la question du DROIT (`canCreateSite`, adossé à hasFullSiteAccess)
  // plutôt que de la déduire du drapeau `create-site`. Ce dernier ne dit que
  // « l'org a-t-elle un site ? » et rate le collaborateur invité AVANT la
  // création du premier site — ordre parfaitement légal, `invite-teammate`
  // étant une étape à part entière : il voyait « Ajoutez votre site » en action
  // principale, vers /projects, puis un Forbidden levé par createSiteAction.
  // Le propriétaire d'une org neuve, lui, a `canCreateSite` vrai : son CTA est
  // actionnable et la bascule ne le concerne pas.
  const noAccessibleSite =
    !!flags && !activation?.hasAccessibleSite && !activation?.canCreateSite;
  if (
    !flags ||
    activation?.dismissed ||
    dismissed ||
    (!noAccessibleSite && requiredComplete(flags))
  ) {
    return null;
  }

  const done = doneCount(flags);
  const total = ACTIVATION_STEPS.length;
  const pct = Math.round((done / total) * 100);

  const handleDismiss = () => {
    setOpen(false);
    setDismissed(true);
    // Fail-silent : un échec d'écriture ne doit pas ressusciter la carte en
    // pleine session — le prochain rendu serveur tranchera.
    dismissActivationAction().catch((error) =>
      console.error("[activation]", error),
    );
  };

  return (
    <SidebarMenuItem className="px-2 pt-1.5 pb-1 group-data-[collapsible=icon]:hidden">
      <Popover open={open} onOpenChange={setOpen}>
        <PopoverTrigger asChild>
          <button type="button" className="w-full text-left">
            <div className="flex items-center justify-between text-[11px] text-sidebar-foreground/70">
              <span>{t("title")}</span>
              <span className="tabular-nums">
                {t("progress", { done, total })}
              </span>
            </div>
            <div className="mt-1 h-1.5 w-full overflow-hidden rounded-full bg-sidebar-accent">
              <div
                className="h-full rounded-full bg-emerald-500 transition-all"
                style={{ width: `${pct}%` }}
              />
            </div>
          </button>
        </PopoverTrigger>
        {/* pointer-events-auto : fix connu du gotcha portails radix/base-ui. */}
        <PopoverContent
          side="right"
          align="start"
          className="pointer-events-auto w-80"
        >
          {/* Garantie spec : l'onboarding ne casse jamais l'app. */}
          <ActivationErrorBoundary>
            <ActivationPanel
              flags={flags}
              suggestedStepId={
                noAccessibleSite ? null : firstIncompleteStep(flags)
              }
              noAccessibleSite={noAccessibleSite}
              canResume={!!activation?.canCreateSite}
              onDismiss={handleDismiss}
            />
          </ActivationErrorBoundary>
        </PopoverContent>
      </Popover>
    </SidebarMenuItem>
  );
}