"use client";

import { useEffect, useRef, useState } from "react";
import { useRouter } from "next/navigation";
import { useUsagerForm } from "../../../app/hooks/useUsagerForm";
import { createUsager, updateUsager, getUsagerById } from "../../../api/usager";
import { validateBirthdate, getMissingRequiredFields } from "../../../app/utils/validationUsagerForm";

import UsagerTabs from "./UsagerTabs";
import IdentificationTab from "./tabs/IdentificationTab";
import SituationTab from "./tabs/SituationTab";
import ExperienceFormationTab from "./tabs/ExperienceFormationTab";
import InfoDossierTab from "./tabs/InfoDossierTab";
import { mapUsagerApiToForm } from "../../../app/utils/mapUsagerToFormData";
import { requiredFieldsByTab } from "../../../app/utils/requiredUsagerFields";
import RendezVousTab from "./tabs/RDVTab";
import { createDossierRDV, getDossierRDVs, getDossierRDVsCount, updateDossierRDV } from "../../../api/dossier_rdv";
import ContratsTab from "./tabs/ContratsTab";
import { createDossierContrat, getDossierContrats, getDossierContratsCount, updateDossierContrat } from "../../../api/dossier_contrat";
import ProjetsTab from "./tabs/ProjetsTab";
import { createDossierProjet, getDossierProjets, updateDossierProjet } from "../../../api/dossier_projet";
import BilanTab from "./tabs/BilanTab";
import { createDossierAdministration, getDossierAdministrations, getDossierAdministrationsCount, updateDossierAdministration } from "../../../api/dossier_administration";
import AdministrationTab from "./tabs/AdministrationTab";
import { useToast } from "../../../context/ToastContext";
import { measure } from "../../../app/utils/performance";
import Link from "next/link";

interface UsagerFormProps {
  id?: string;
}

export default function UsagerForm({ id }: UsagerFormProps) {
  const isEdit = !!id;
  const [isDossierReady, setDossierReady] = useState(false);
  const [idDossier, setIdDossier] = useState(null);
  const [isSaving, setIsSaving] = useState(false);
  const [isLoaded, setIsLoaded] = useState(false);

  const [saveState, setSaveState] = useState<"saved" | "saving" | "dirty">("saved");

  const [draftCreated, setDraftCreated] = useState(false);

  const lastSavedRef = useRef("");

  const router = useRouter();
  const { showToast } = useToast();

  const tabs = [
    {
      label: "Identification",
      disabled: false
    },
    {
      label: "Situation",
      disabled: !isEdit
    },
    {
      label: "Expériences et Formations",
      disabled: !isEdit
    },
    {
      label: "Infos dossier",
      disabled: !isEdit
    },
    {
      label: "Projets",
      disabled: !isDossierReady
    },
    {
      label: "Rendez-vous",
      disabled: !isDossierReady
    },
    {
      label: "Contrats",
      disabled: !isDossierReady
    },
    {
      label: "Bilan",
      disabled: !isDossierReady
    },
    {
      label: "Administration",
      disabled: !isDossierReady
    }
  ];

  const [activeTab, setActiveTab] = useState(tabs[0].label);

  const handleTabChange = async (tab: string) => {
    if (!disableSubmit) {
      await handleSave();
    }
    setActiveTab(tab);
  };

  const { formData, updateField, setFormData } = useUsagerForm();

  const loadUsager = async (id: string) => {
    const apiData = await measure("Chargement usager", () => getUsagerById(id));
    let cleanUsagerFormData = mapUsagerApiToForm(apiData);
    if (apiData.id_dossier) {
      setDossierReady(true);
      setIdDossier(apiData.id_dossier);
      const apiRDVData = await measure("Chargement RDVS dossier usager", () => getDossierRDVs(apiData.id_dossier));
      const apiContratsData = await measure("Chargement Contrats dossier usager", () => getDossierContrats(apiData.id_dossier));
      const apiProjetsData = await measure("Chargement Projets dossier usager", () => getDossierProjets(apiData.id_dossier));
      const apiAdministrationsData = await measure("Chargement Administration dossier usager",
        () => getDossierAdministrations(apiData.id_dossier));
      cleanUsagerFormData = mapUsagerApiToForm(apiData, apiRDVData, apiContratsData, apiProjetsData, apiAdministrationsData);
    }

    const mergedData = { ...formData, ...cleanUsagerFormData };

    setFormData(mergedData);

    lastSavedRef.current = JSON.stringify(buildPayload(mergedData));

    setSaveState("saved");
  }

  useEffect(() => {
    if (!id) return;
    loadUsager(id);
    setIsLoaded(true);
  }, [id]);

  const buildPayload = (formData: any) => {
    const selectedStatuts = Object.entries(formData.statuts || {})
      .filter(([_, value]: any) => value.checked)
      .map(([id, value]: any) => ({
        statutId: Number(id),
        fields: value.fields || {}
      }));
    let filledRendezVous = [];
    if (formData.rendezVous.length > 0 && formData.rendezVous) {
      filledRendezVous = formData.rendezVous?.map(
        (rdv: any) => ({
          id: rdv.id || null,
          date: rdv.date || null,
          presence: rdv.presence || null,
          presence_autre: rdv.presence_autre || null,
          temps: rdv.temps ? Number(rdv.temps) : null,
          contenu: rdv.contenu || null,
          type: rdv.type || null,
          conseiller: rdv.conseiller || null,
          action: rdv.action || null,
          convention: rdv.convention || null,
          commentaire: rdv.commentaire || null
        })
      );
    }

    const contratsPayload = {
      caf: formData.contrats?.caf || null,

      list: (formData.contrats?.list || []).map((contrat: any) => ({
            debut: contrat.debut || null,

            fin: contrat.fin || null,

            duree: contrat.duree ? Number(contrat.duree) : null,

            numero: contrat.numero || null,

            service_insertion: contrat.service_insertion || null,

            gestionnaire: contrat.gestionnaire || null,

            conseiller_rsa: contrat.conseiller_rsa || null,

            organisme_ru: contrat.organisme_ru || null,

            referent_unique: contrat.referent_unique || null
          })),

      bilan: {
        ante: {
          coherence: formData.contrats?.bilan?.ante?.coherence || null,

          faisabilite: formData.contrats?.bilan?.ante?.faisabilite || null
        },

        post: {
          evolution_ca: formData.contrats?.bilan?.post?.evolution_ca || null
        },

        global: {
          implication: formData.contrats?.bilan?.global?.implication || null,

          points_forts: formData.contrats?.bilan?.global?.points_forts || null,

          points_faibles: formData.contrats?.bilan?.global?.points_faibles || null
        }
      }
    }

    const projetsPayload = {
      entreprise: {
        raison_sociale: formData.projets?.raison_sociale || null,

        siret: formData.projets?.siret || null,

        date_creation: formData.projets?.date_creation || null,

        adresse: formData.projets?.adresse || null,

        id_lieu: formData.projets?.ville_cp || null,

        no_tel_1: formData.projets?.tel1 || null,

        no_tel_2: formData.projets?.tel2 || null,

        email: formData.projets?.email || null,

        site_web: formData.projets?.site || null,

        id_secteur_activite: formData.projets?.secteur || null,

        description_activite: formData.projets?.activite || null,

        id_statut_juridique: formData.projets?.statut_juridique || null,

        id_regime_fiscal: formData.projets?.regime_fiscal || null,

        id_regime_tva: formData.projets?.regime_tva || null,

        id_cfe: formData.projets?.cfe || null,

        effectif_total: formData.projets?.effectif || null,

        nom_responsable: formData.projets?.responsable || null
      },

      projet: {
        intitule_projet: formData.projets?.intitule || null,

        id_action: formData.projets?.creation_accompagnee ? formData.projets?.action : null,

        id_convention: formData.projets?.creation_accompagnee ? formData.projets?.convention : null,

        creation_non_accompagnee: formData.projets?.creation_non_accompagnee || false,

        creation_accompagnee: formData.projets?.creation_accompagnee || false,

        reprise_entreprise: formData.projets?.reprise || false,

        date_reprise_entreprise: formData.projets?.reprise !== false ? formData.projets?.date_reprise : null,

        couveuse_entreprise: formData.projets?.couveuse || false,

        detail_couveuse: formData.projets?.couveuse !== false ? formData.projets?.detail_couveuse : null,

        date_cessation_activite: formData.projets?.date_cessation_activite || null,

        motif_cessation_activite: formData.projets?.motif_cessation_activite || null,
        entreprise_creee: formData.projets?.entreprise_creee || false,
        aide_financiere_obtenue: formData.projets?.aide_financiere_obtenue || false
      }
    };

    let administrationsPayload = [];
    if (formData.administrations.length > 0 && formData.administrations) {
      administrationsPayload = formData.administrations?.map((administration: any) => ({
          id: administration.id || null,
          id_admin: administration.id_admin || null,
          precision_commentaire: administration.precision_commentaire || null,
          date_action: administration.date_action || null
        }))
    }

    return {
      ...formData,
      statuts: selectedStatuts,
      extras: {
        permis: {
          enabled: formData.extras?.permis?.enabled || false,
          b: formData.extras?.permis?.enabled !== false ? formData.extras?.permis?.b : false,
          autre: formData.extras?.permis?.enabled !== false ? formData.extras?.permis?.autre : null
        },
        moyen_locomotion: {
          value: formData.extras?.moyen_locomotion?.value || null,
          autre: formData.extras?.moyen_locomotion?.autre || null
        }
      },
      rendezVous: filledRendezVous,
      contrats: contratsPayload,
      projets: projetsPayload,
      administrations: administrationsPayload
    };
  };

  const handleSave = async () => {
    if (!isLoaded) {
      return;
    }
    try {
      await saveDraft();
      showToast("success", "Modifications enregistrées avec succès");
      loadUsager(id!);
    }
    catch (error: any) {
      setSaveState("dirty");
      showToast('error', error.message);
      console.error(error);
    } finally {
      setIsSaving(false);
      setSaveState("saved");
    }
  };

  const saveDraft = async () => {
    if (disableSubmit) {
      return;
    }
    const payload = buildPayload(formData);
    const currentPayload = JSON.stringify(payload);

    if (currentPayload === lastSavedRef.current) {
      setSaveState("saved");
      return;
    }
    try {
      setSaveState("saving");
      setIsSaving(true);

      if (!isEdit) {
        const newUser = await measure("Chargement Création d'usager", () => createUsager(payload));
        setDraftCreated(true);
        lastSavedRef.current = currentPayload;

        setSaveState("saved");
        showToast('success', 'Usager créé avec succès.');
        router.push(`/usagers/${newUser.id}`);
        return;
      }
      if (activeTab === "Rendez-vous") {
        const countRDVs = await measure("Chargement Count RDVs", async () => getDossierRDVsCount(await getDossierRDVs(idDossier!!)));
        if (countRDVs === 0) {
          await measure("Chargement Création d'un RDV", () => createDossierRDV(idDossier!!, payload.rendezVous));
        }
        else {
          await measure("Chargement mise à jour d'un RDV", () => updateDossierRDV(idDossier!!, payload.rendezVous));
        }
      }
      if (activeTab === "Contrats" || activeTab === "Bilan") {
        const countContrats = await measure("Chargement Count Contrats", async () => getDossierContratsCount(await getDossierContrats(idDossier!!)));
        if (countContrats === 0) {
          await measure("Chargement Création d'un Contrat", () => createDossierContrat(idDossier!!, payload.contrats));
        }
        else {
          await measure("Chargement mise à jour d'un Contrat", () => updateDossierContrat(idDossier!!, payload.contrats));
        }
      }
      if (activeTab === "Projets") {
        const projets = await measure("Chargement projets", () => getDossierProjets(idDossier!!));
        const hasProjet = !!projets?.raison_sociale || !!projets?.id;
        if (!hasProjet) {
          await measure("Chargement Création d'un projet", () => createDossierProjet(idDossier!!, payload.projets));
        }
        else {
          await measure("Chargement mise à jour d'un projet", () => updateDossierProjet(idDossier!!, payload.projets));
        }
      }
      if (activeTab === "Administration") {
        const countAdministrations = await measure("Chargement Count Administrations", async () => getDossierAdministrationsCount(await getDossierAdministrations(idDossier!!)));
        if (countAdministrations === 0) {
          await measure("Chargement Création d'une note administrative", () => createDossierAdministration(idDossier!!, payload.administrations));
        }
        else {
          await measure("Chargement mise à jour d'une note administrative", () => updateDossierAdministration(idDossier!!, payload.administrations));
        }
      }
      await measure(
        "Chargement mise à jour d'un usager", () => updateUsager(id!, payload));

      lastSavedRef.current = currentPayload;

      setSaveState("saved");
      loadUsager(id!);
    }
    catch (error: any) {
      showToast('error', error.message);
      console.error(error);
    } finally {
      setIsSaving(false);
    }
  };

  const hasErrors = !!validateBirthdate(formData.date_naissance);

  const currentTabRequiredFields = requiredFieldsByTab[activeTab as keyof typeof requiredFieldsByTab] || [];

  const missingFields = getMissingRequiredFields(formData, currentTabRequiredFields);
  const hasMissingRequiredFields = missingFields.length > 0;

  const disableSubmit = hasErrors || hasMissingRequiredFields;

  useEffect(() => {
    setSaveState("dirty");
  }, [formData]);

  useEffect(() => {
    if (disableSubmit) {
      return;
    }

    if (!isEdit && draftCreated) {
      return;
    }

    const timeout =
      setTimeout(() => {
        saveDraft();
      }, 10000);

    return () => clearTimeout(timeout);
  }, [formData, disableSubmit]);

  useEffect(() => {
    if (!isEdit && disableSubmit) {
      return;
    }

    if (!isEdit && !draftCreated) {
      saveDraft();
    }

  }, [disableSubmit, draftCreated]);

  return (
    <div className="bg-white p-1 rounded-2xl shadow-xl">

      <UsagerTabs tabs={tabs} activeTab={activeTab} setActiveTab={handleTabChange} />
      <div className="flex justify-end mb-1">

        {saveState === "saving" && (
          <span className="text-sm text-orange-600">
            ⟳ Enregistrement...
          </span>
        )}

        {saveState === "saved" && (
          <span className="text-sm text-green-600">
            ✓ Sauvegardé
          </span>
        )}

        {saveState === "dirty" && (
          <span className="text-sm text-red-600">
            ● Modifications non enregistrées
          </span>
        )}

      </div>

      <div className="flex gap-3">

        <Link
          href="/usagers"
          className="
          px-1 py-1 rounded-xl
          bg-white border border-[#dce8e2]
          text-[#2f5d4b]
        "
        >
          ← Retour liste usagers
        </Link>
      </div>
      <div className="flex justify-end mt-1">
        <button
          onClick={handleSave}
          className={`
    relative overflow-hidden
    px-1 py-1
    rounded-2xl
    font-semibold text-sm
    text-white
    shadow-md
    transition-all duration-300
    
    ${disableSubmit || isSaving
              ? `
        bg-[#b8c8c1]
        cursor-not-allowed
        shadow-none
      `
              : `
        bg-gradient-to-r
        from-[#2f7d5f]
        to-[#3f9b74]
        hover:shadow-xl
        hover:-translate-y-0.5
        active:translate-y-0
        cursor-pointer`
            }
  `}
          disabled={disableSubmit || isSaving}
        >
          {isSaving ? "Enregistrement..." : "Enregistrer"}
        </button>
      </div>
      {activeTab === "Identification" && (
        <IdentificationTab data={formData} onChange={updateField} />
      )}
      {activeTab === "Situation" && (
        <SituationTab data={formData} onChange={updateField} />
      )}
      {activeTab === "Expériences et Formations" && (
        <ExperienceFormationTab data={formData} onChange={updateField} />
      )}
      {activeTab === "Infos dossier" && (
        <InfoDossierTab data={formData} onChange={updateField} />
      )}
      {activeTab === "Rendez-vous" && (
        <RendezVousTab data={formData} onChange={updateField} />
      )}
      {activeTab === "Contrats" && (
        <ContratsTab data={formData} onChange={updateField} />
      )}
      {activeTab === "Projets" && (
        <ProjetsTab data={formData} onChange={updateField} />
      )}
      {activeTab === "Bilan" && (
        <BilanTab data={formData} onChange={updateField} />
      )}
      {activeTab === "Administration" && (
        <AdministrationTab data={formData} onChange={updateField} />
      )}

    </div>
  );
}