"use client";

import { useMemo, useState } from "react";

type FieldType = "text" | "number" | "select" | "checkboxGroup";

interface FieldOption {
  value: string;
  label: string;
}

interface FieldConfig {
  name: string;
  label: string;
  type: FieldType;
  options?: FieldOption[];
  placeholder?: string;
  help?: string;
}

interface StepConfig {
  title: string;
  fields: FieldConfig[];
}

const OUI_NON_NS: FieldOption[] = [
  { value: "oui", label: "Oui" },
  { value: "non", label: "Non" },
  { value: "ns", label: "Je ne sais pas" },
];

const OUI_NON: FieldOption[] = [
  { value: "oui", label: "Oui" },
  { value: "non", label: "Non" },
];

const MENTAL_OPTIONS: FieldOption[] = [
  { value: "0", label: "Jamais" },
  { value: "1", label: "Plusieurs jours" },
  { value: "2", label: "Plus de la moitié du temps" },
  { value: "3", label: "Presque tous les jours" },
];

const BASE_STEPS: StepConfig[] = [
  {
    title: "Votre profil",
    fields: [
      { name: "prenom", label: "Prénom", type: "text" },
      { name: "nom", label: "Nom", type: "text" },
      {
        name: "age",
        label: "Tranche d'âge",
        type: "select",
        options: [
          { value: "18-25", label: "18–25 ans" },
          { value: "45-50", label: "45–50 ans" },
          { value: "60-65", label: "60–65 ans" },
          { value: "70-75", label: "70–75 ans" },
        ],
      },
      {
        name: "sexe",
        label: "Sexe",
        type: "select",
        options: [
          { value: "Homme", label: "Homme" },
          { value: "Femme", label: "Femme" },
          { value: "Préfère ne pas répondre", label: "Préfère ne pas répondre" },
        ],
      },
      { name: "medecin_traitant", label: "Avez-vous un médecin traitant déclaré ?", type: "select", options: OUI_NON_NS },
    ],
  },
  {
    title: "Votre situation",
    fields: [
      {
        name: "famille",
        label: "Situation familiale",
        type: "checkboxGroup",
        options: [
          { value: "vit seul", label: "Je vis seul(e)" },
          { value: "couple", label: "Je vis en couple" },
          { value: "enfants couple", label: "J'ai des enfants que j'élève avec mon/ma conjoint(e)" },
          { value: "enfants seul", label: "J'ai des enfants que j'élève seul(e)" },
          { value: "aidant", label: "J'ai un rôle d'aidant auprès d'une personne dépendante" },
        ],
      },
      { name: "conditions_penibles", label: "Vos conditions de vie ou de travail sont-elles difficiles ou pénibles ?", type: "select", options: [...OUI_NON, { value: "nc", label: "Non concerné(e)" }] },
      { name: "entourage", label: "En cas de besoin, pouvez-vous compter sur une personne de votre entourage ?", type: "select", options: OUI_NON_NS },
    ],
  },
  {
    title: "Antécédents et santé actuelle",
    fields: [
      {
        name: "pathologies",
        label: "Avez-vous ou avez-vous déjà eu une de ces maladies ou facteurs de risque ?",
        type: "checkboxGroup",
        options: [
          { value: "hta", label: "Hypertension artérielle" },
          { value: "diabete", label: "Diabète" },
          { value: "cholesterol", label: "Cholestérol élevé" },
          { value: "cardio", label: "Maladie cardiovasculaire (infarctus, AVC...)" },
          { value: "respiratoire", label: "Maladie respiratoire (asthme, BPCO...)" },
          { value: "cancer", label: "Cancer" },
          { value: "aucune", label: "Aucune" },
        ],
      },
      { name: "antecedents_famille", label: "Des antécédents familiaux connus (diabète, cancer, infarctus...) ?", type: "select", options: OUI_NON_NS },
      { name: "biologie", label: "Dernière prise de sang ou analyse d'urine", type: "select", options: [{ value: "moins6", label: "Moins de 6 mois" }, { value: "plus6", label: "Plus de 6 mois" }, { value: "ns", label: "Je ne sais pas" }] },
      { name: "traitement", label: "Suivez-vous actuellement un traitement ?", type: "select", options: OUI_NON },
      { name: "nb_medicaments", label: "Si oui, combien de médicaments par jour ?", type: "number", placeholder: "Ex : 4" },
      { name: "oubli_traitement", label: "Vous arrive-t-il d'oublier votre traitement ?", type: "select", options: [{ value: "jamais", label: "Jamais" }, { value: "rarement", label: "Rarement" }, { value: "parfois", label: "Parfois" }, { value: "souvent", label: "Souvent" }, { value: "tres_souvent", label: "Très souvent" }] },
      { name: "doute_prise", label: "Avez-vous déjà eu un doute sur une prise ?", type: "select", options: [{ value: "non", label: "Non" }, { value: "oui", label: "Oui" }, { value: "regulier", label: "Cela m'arrive régulièrement" }] },
    ],
  },
  {
    title: "Poids et taille",
    fields: [
      { name: "poids", label: "Poids (kg)", type: "number", placeholder: "Ex : 72" },
      { name: "taille", label: "Taille (cm)", type: "number", placeholder: "Ex : 167" },
    ],
  },
  {
    title: "Habitudes de vie",
    fields: [
      { name: "fruits_legumes", label: "Fruits et légumes", type: "select", options: [{ value: "quotidien", label: "Tous les jours" }, { value: "parfois", label: "Parfois" }, { value: "rare", label: "Rarement" }] },
      { name: "sucre", label: "Grignotage / produits sucrés / boissons sucrées", type: "select", options: [{ value: "rare", label: "Rarement" }, { value: "parfois", label: "Parfois" }, { value: "souvent", label: "Souvent" }] },
      { name: "activite", label: "Activité physique dynamique (30 min, plusieurs fois/semaine)", type: "select", options: [{ value: "ok", label: "Au moins 30 min, 5 jours/semaine" }, { value: "insuffisant", label: "Moins que recommandé" }, { value: "aucune", label: "Aucune ou quasi aucune" }] },
      { name: "sedentarite", label: "Temps assis prolongé", type: "select", options: [{ value: "faible", label: "Je bouge régulièrement" }, { value: "moderee", label: "Assis longtemps mais pauses possibles" }, { value: "forte", label: "Plusieurs heures sans pause" }] },
      { name: "tabac", label: "Tabac", type: "select", options: [{ value: "non", label: "Non" }, { value: "ancien", label: "Ancien fumeur" }, { value: "oui", label: "Oui" }] },
      { name: "alcool_semaine", label: "Alcool — verres par semaine", type: "number", placeholder: "Ex : 6" },
      { name: "jours_sans_alcool", label: "Alcool — jours sans alcool par semaine", type: "number", placeholder: "Ex : 3" },
      { name: "cannabis", label: "Cannabis ou autre substance psychoactive", type: "select", options: OUI_NON },
      { name: "sommeil", label: "Sommeil", type: "select", options: [{ value: "bon", label: "Sommeil satisfaisant" }, { value: "moyen", label: "Sommeil irrégulier ou insuffisant" }, { value: "mauvais", label: "Troubles importants ou fatigue fréquente" }] },
    ],
  },
  {
    title: "Bien-être, ces 2 dernières semaines",
    fields: [
      { name: "mental_interet", label: "Peu d'intérêt ou de plaisir à faire les choses", type: "select", options: MENTAL_OPTIONS },
      { name: "mental_triste", label: "Sentiment de tristesse ou de découragement", type: "select", options: MENTAL_OPTIONS },
      { name: "mental_anxiete", label: "Nervosité ou anxiété", type: "select", options: MENTAL_OPTIONS },
      { name: "mental_inquietude", label: "Incapable d'arrêter de vous inquiéter", type: "select", options: MENTAL_OPTIONS },
    ],
  },
  {
    title: "Dépistages et accès aux soins",
    fields: [
      { name: "dentaire", label: "Suivi dentaire", type: "select", options: [{ value: "moins1", label: "Consultation il y a moins d'un an" }, { value: "plus1", label: "Plus d'un an" }, { value: "douleur", label: "Douleur ou problème actuel" }] },
      { name: "vaccins", label: "Vaccinations à jour ?", type: "select", options: OUI_NON_NS },
      { name: "depistages", label: "Dépistages recommandés selon âge/sexe", type: "select", options: [{ value: "ok", label: "À jour" }, { value: "non", label: "Pas à jour" }, { value: "ns", label: "Je ne sais pas" }] },
      { name: "audition", label: "Audition", type: "select", options: [{ value: "ok", label: "Pas de difficulté" }, { value: "difficulte", label: "Difficultés à entendre" }, { value: "bruit", label: "Exposition fréquente au bruit" }] },
      { name: "droits", label: "Renoncement à des soins ou difficulté de droits", type: "select", options: OUI_NON_NS },
      { name: "violences", label: "Violences ou sentiment d'insécurité", type: "select", options: [...OUI_NON, { value: "prefere_pas", label: "Préfère ne pas répondre" }] },
    ],
  },
];

const STEP_AUTONOMIE: StepConfig = {
  title: "Gestes du quotidien",
  fields: [
    {
      name: "autonomie_difficultes",
      label: "Avez-vous des difficultés à réaliser certains gestes de la vie quotidienne ?",
      type: "checkboxGroup",
      options: [
        { value: "toilette", label: "Faire sa toilette seul(e)" },
        { value: "habillage", label: "Se vêtir seul(e)" },
        { value: "marche", label: "Marcher seul(e), avec ou sans canne" },
        { value: "transport", label: "Utiliser seul(e) un moyen de transport" },
        { value: "repas", label: "Manger et boire seul(e)" },
      ],
      help: "Ne cochez que ce qui s'applique. Laissez vide si aucune difficulté.",
    },
  ],
};

const STEP_SANTE_SEXUELLE: StepConfig = {
  title: "Santé sexuelle",
  fields: [
    { name: "contraception", label: "Utilisez-vous un moyen de contraception ?", type: "select", options: [...OUI_NON, { value: "nc", label: "Non concerné(e)" }] },
    { name: "depistage_ist", label: "Avez-vous déjà réalisé un dépistage des infections sexuellement transmissibles ?", type: "select", options: OUI_NON_NS },
  ],
};

const STEP_COMMENTAIRE: StepConfig = {
  title: "Une dernière chose ?",
  fields: [
    { name: "commentaire", label: "Un point que vous voulez signaler à votre pharmacien ?", type: "text", placeholder: "Facultatif" },
  ],
};

type Answers = Record<string, string | string[]>;

function buildSteps(answers: Answers): StepConfig[] {
  const steps = [...BASE_STEPS];
  const age = answers.age as string | undefined;
  if (age === "60-65" || age === "70-75") steps.push(STEP_AUTONOMIE);
  if (age === "18-25") steps.push(STEP_SANTE_SEXUELLE);
  steps.push(STEP_COMMENTAIRE);
  return steps;
}

function computeImcPreview(answers: Answers) {
  const poids = parseFloat((answers.poids as string) || "");
  const taille = parseFloat((answers.taille as string) || "");
  if (!poids || !taille) return null;
  const m = taille / 100;
  const imc = poids / (m * m);
  let categorie = "Corpulence normale";
  if (imc < 18.5) categorie = "Insuffisance pondérale";
  else if (imc >= 25 && imc < 30) categorie = "Surpoids";
  else if (imc >= 30) categorie = "Obésité";
  return { value: imc.toFixed(1), categorie };
}

export function QuestionnaireForm({ slug }: { slug: string }) {
  const [answers, setAnswers] = useState<Answers>({});
  const [stepIndex, setStepIndex] = useState(0);
  const [submitting, setSubmitting] = useState(false);
  const [submitted, setSubmitted] = useState(false);
  const [error, setError] = useState<string | null>(null);

  // eslint-disable-next-line react-hooks/exhaustive-deps -- steps depend only on the age bracket
  const steps = useMemo(() => buildSteps(answers), [answers.age]);
  const step = steps[stepIndex];
  const isLastStep = stepIndex === steps.length - 1;
  const imcPreview = computeImcPreview(answers);

  function setField(name: string, value: string) {
    setAnswers((prev) => ({ ...prev, [name]: value }));
  }

  function toggleCheckbox(name: string, value: string) {
    setAnswers((prev) => {
      const current = Array.isArray(prev[name]) ? (prev[name] as string[]) : [];
      const next = current.includes(value) ? current.filter((v) => v !== value) : [...current, value];
      return { ...prev, [name]: next };
    });
  }

  async function handleSubmit() {
    setSubmitting(true);
    setError(null);
    try {
      const res = await fetch("/api/bilans", {
        method: "POST",
        headers: { "content-type": "application/json" },
        body: JSON.stringify({ slug, answers }),
      });
      if (!res.ok) throw new Error("Échec de l'envoi");
      setSubmitted(true);
    } catch {
      setError("Une erreur est survenue lors de l'envoi. Merci de réessayer.");
    } finally {
      setSubmitting(false);
    }
  }

  if (submitted) {
    return (
      <div className="text-center py-16 px-4">
        <div className="w-14 h-14 rounded-full bg-[#dff8ef] text-[#027a48] grid place-items-center mx-auto mb-4 text-2xl">
          ✓
        </div>
        <h1 className="text-xl font-bold text-[#07008b] mb-2">Merci !</h1>
        <p className="text-slate-500 max-w-sm mx-auto">
          Vos réponses ont bien été transmises à votre pharmacie. Elles seront exploitées lors de votre
          Bilan Prévention avec votre pharmacien.
        </p>
      </div>
    );
  }

  const progressPct = Math.round(((stepIndex + 1) / steps.length) * 100);

  return (
    <div className="max-w-lg mx-auto px-4 py-8">
      <div className="h-2 rounded-full bg-slate-200 overflow-hidden mb-6">
        <div className="h-full bg-gradient-to-r from-[#10a37f] to-[#00a6d6]" style={{ width: `${progressPct}%` }} />
      </div>
      <h1 className="text-lg font-bold text-[#07008b] mb-1">{step.title}</h1>
      <p className="text-xs text-slate-400 mb-6">
        Étape {stepIndex + 1} / {steps.length}
      </p>

      <div className="space-y-5">
        {step.fields.map((field) => (
          <div key={field.name}>
            <label className="block text-sm font-semibold mb-1.5">{field.label}</label>
            {field.help && <p className="text-xs text-slate-400 mb-1.5">{field.help}</p>}

            {field.type === "text" && (
              <input
                type="text"
                value={(answers[field.name] as string) ?? ""}
                onChange={(e) => setField(field.name, e.target.value)}
                placeholder={field.placeholder}
                className="w-full rounded-lg border border-slate-300 px-3 py-2.5 text-sm"
              />
            )}

            {field.type === "number" && (
              <input
                type="number"
                value={(answers[field.name] as string) ?? ""}
                onChange={(e) => setField(field.name, e.target.value)}
                placeholder={field.placeholder}
                className="w-full rounded-lg border border-slate-300 px-3 py-2.5 text-sm"
              />
            )}

            {field.type === "select" && (
              <select
                value={(answers[field.name] as string) ?? ""}
                onChange={(e) => setField(field.name, e.target.value)}
                className="w-full rounded-lg border border-slate-300 px-3 py-2.5 text-sm bg-white"
              >
                <option value="">Sélectionner</option>
                {field.options?.map((opt) => (
                  <option key={opt.value} value={opt.value}>
                    {opt.label}
                  </option>
                ))}
              </select>
            )}

            {field.type === "checkboxGroup" && (
              <div className="grid gap-2">
                {field.options?.map((opt) => {
                  const checked = ((answers[field.name] as string[]) ?? []).includes(opt.value);
                  return (
                    <label
                      key={opt.value}
                      className="flex items-center gap-2 bg-slate-50 border border-slate-200 rounded-lg px-3 py-2 text-sm"
                    >
                      <input
                        type="checkbox"
                        checked={checked}
                        onChange={() => toggleCheckbox(field.name, opt.value)}
                      />
                      {opt.label}
                    </label>
                  );
                })}
              </div>
            )}

            {field.name === "taille" && imcPreview && (
              <p className="text-xs text-slate-500 mt-2">
                IMC estimé : <strong>{imcPreview.value}</strong> ({imcPreview.categorie})
              </p>
            )}
          </div>
        ))}
      </div>

      {error && <p className="text-sm text-red-600 mt-4">{error}</p>}

      <div className="flex gap-3 mt-8">
        {stepIndex > 0 && (
          <button
            type="button"
            onClick={() => setStepIndex((i) => i - 1)}
            className="flex-1 rounded-lg border border-slate-300 font-semibold py-2.5 text-sm"
          >
            Précédent
          </button>
        )}
        {!isLastStep && (
          <button
            type="button"
            onClick={() => setStepIndex((i) => i + 1)}
            className="flex-1 rounded-lg bg-[#07008b] text-white font-semibold py-2.5 text-sm"
          >
            Suivant
          </button>
        )}
        {isLastStep && (
          <button
            type="button"
            disabled={submitting}
            onClick={handleSubmit}
            className="flex-1 rounded-lg bg-[#10a37f] text-white font-semibold py-2.5 text-sm disabled:opacity-50"
          >
            {submitting ? "Envoi..." : "Envoyer à ma pharmacie"}
          </button>
        )}
      </div>
    </div>
  );
}
