"use client";

import { useEffect, useRef, useState } from "react";

// ALTCHA کپچای خودمیزبان روی بک‌اند clinicpro. widget فقط وقتی رندر می‌شود که
// سرور کپچا را فعال کرده باشد (/api/v1/altcha/config). چون nobat724 روی دامنه‌ی
// جدا از API است، آدرس challenge باید absolute باشد.

const API = process.env.NEXT_PUBLIC_API_URL;

const FA_STRINGS = JSON.stringify({
  label: "من ربات نیستم",
  verifying: "در حال بررسی...",
  verified: "تأیید شد",
  waitAlert: "در حال بررسی... لطفاً منتظر بمانید.",
  error: "احراز هویت ناموفق بود. کمی بعد دوباره تلاش کنید.",
  expired: "احراز هویت منقضی شد. دوباره تلاش کنید.",
});

export default function Altcha({ onVerified }) {
  const ref = useRef(null);
  // null=در حال بررسی، true/false=فعال/غیرفعال بودن کپچا در سرور
  const [enabled, setEnabled] = useState(null);

  // ثبت custom element فقط در مرورگر (وابسته به customElements/DOM).
  useEffect(() => {
    import("altcha");
  }, []);

  useEffect(() => {
    let alive = true;
    fetch(`${API}/api/v1/altcha/config`)
      .then((r) => r.json())
      .then((c) => {
        if (!alive) return;
        setEnabled(!!c.enabled);
        if (!c.enabled) onVerified(""); // کپچا خاموش → فرم بدون مانع ارسال شود
      })
      .catch(() => {
        if (alive) setEnabled(false);
      });
    return () => {
      alive = false;
    };
  }, [onVerified]);

  useEffect(() => {
    const el = ref.current;
    if (!el) return;
    const onStateChange = (e) => {
      if (e.detail?.state === "verified" && e.detail.payload) {
        onVerified(e.detail.payload);
      }
    };
    el.addEventListener("statechange", onStateChange);
    return () => el.removeEventListener("statechange", onStateChange);
  }, [onVerified, enabled]);

  if (enabled !== true) return null;

  return (
    <altcha-widget
      ref={ref}
      challengeurl={`${API}/api/v1/altcha/challenge`}
      auto="onload"
      strings={FA_STRINGS}
      style={{ display: "block", marginTop: 12 }}
    />
  );
}