/* ============================================================
   EDUCARE — Configurações › Assinatura

   O que a conta tem contratado, em português, sem contador de IA e sem
   nenhum dado de paciente: daqui só passa o número agregado de ativos.

   Uma limitação que fica à vista de propósito: a tabela subscriptions
   NÃO tem policy de escrita para o cliente, e isso é intencional (ver
   20260803000000). Trocar de plano, mudar ciclo e cancelar não são
   coisas que este app consegue executar sozinho hoje: quem muda
   assinatura é o gateway, pelo aviso de pagamento, ou a administradora.

   Diante disso, a escolha foi dizer a verdade em vez de desenhar botão
   que finge funcionar. Trocar plano e mudar ciclo levam para a vitrine,
   que é onde a decisão acontece de fato; cancelar explica o que vai
   acontecer e aponta para o contato. Botão que não faz nada é pior do
   que a ausência dele, ainda mais quando o assunto é dinheiro.
   ============================================================ */
(function () {
  const { useState } = React;
  const Icon = window.Icon;

  const dia = (d) => (d ? new Date(d).toLocaleDateString("pt-BR") : null);

  const NOME_DO_CICLO = { mensal: "Mensal", anual: "Anual" };

  /* Uma linha de "campo e valor" do resumo. */
  function Linha({ rotulo, valor, detalhe }) {
    return (
      <div className="as-linha">
        <span className="as-rot">{rotulo}</span>
        <span className="as-val">
          {valor}
          {detalhe && <em>{detalhe}</em>}
        </span>
      </div>
    );
  }

  /* ---------------- textos derivados do estado ---------------- */

  /* Os ramos de 'trialing' saíram daqui junto com o teste grátis. Conta
     sem plano agora é conta que ainda não pagou, e "Sem assinatura" já
     diz isso melhor do que "Teste grátis" diria. */
  function planoAtual(a) {
    if (!a.plano) return { valor: "Sem assinatura", detalhe: "sua conta está em modo leitura" };
    return { valor: a.planoNome || a.plano, detalhe: null };
  }

  function proximaCobranca(a) {
    if (!a.periodoTerminaEm) return { valor: "Sem data registrada", detalhe: null };

    const quando = dia(a.periodoTerminaEm);
    if (a.cancelaNoFim) {
      return { valor: "Não vai renovar", detalhe: `seu acesso vale até ${quando}` };
    }
    if (a.status === "past_due") {
      return { valor: "Pagamento pendente", detalhe: `vencimento em ${quando}` };
    }
    if (!a.podeEscrever) return { valor: "Venceu", detalhe: `em ${quando}` };
    return { valor: quando, detalhe: null };
  }

  function usoDePacientes(a) {
    if (a.limitePacientes == null) {
      return { valor: "Sem limite", detalhe: `${a.pacientesAtivos} ativos hoje` };
    }
    return {
      valor: `${a.pacientesAtivos} de ${a.limitePacientes} pacientes ativos`,
      detalhe: "arquivar libera vaga e não apaga nada",
    };
  }

  /* ---------------- cancelamento ---------------- */

  function ModalCancelar({ onFechar }) {
    const contato = window.EducareCheckout.contato();
    return (
      <div className="modal-scrim" onClick={onFechar}>
        <div className="modal" onClick={(e) => e.stopPropagation()} style={{ maxWidth: 500 }}>
          <div className="modal-head">
            <div>
              <h3>Cancelar assinatura</h3>
              <p>O que acontece quando você cancela</p>
            </div>
            <button className="x" onClick={onFechar} aria-label="Fechar"><Icon name="x" size={18} /></button>
          </div>
          <div className="modal-body" style={{ fontSize: 13.5, lineHeight: 1.65, color: "var(--text-2)" }}>
            <p style={{ marginTop: 0 }}>
              O que você já pagou continua valendo até o fim do período. Depois disso a conta
              entra em modo leitura: você continua consultando prontuário, laudos, avaliações,
              agenda e PDFs, e pode exportar tudo quando quiser.
            </p>
            <p>
              <b style={{ color: "var(--text)" }}>Nenhum dado é apagado por cancelamento.</b> Nem
              paciente, nem avaliação, nem histórico.
            </p>
            <p style={{ marginBottom: 0 }}>
              O cancelamento ainda é feito com a gente, e não por um botão nesta tela.
              {contato
                ? " Fale com a gente e resolvemos na hora."
                : " Escreva para o suporte e resolvemos."}
            </p>
          </div>
          <div className="modal-foot">
            <button className="btn btn-ghost btn-sm" onClick={onFechar}>Voltar</button>
            {contato && (
              <a className="btn btn-primary btn-sm" href={contato} target="_blank" rel="noreferrer">
                <Icon name="headset" size={16} /> Falar sobre o cancelamento
              </a>
            )}
          </div>
        </div>
      </div>
    );
  }

  /* ---------------- painel ---------------- */

  function PainelAssinatura({ onNavigate }) {
    const a = window.usarAssinatura();
    const [cancelando, setCancelando] = useState(false);

    const plano = planoAtual(a);
    const cobranca = proximaCobranca(a);
    const uso = usoDePacientes(a);
    const irParaPlanos = (ciclo) => onNavigate && onNavigate("planos", ciclo ? { ciclo } : null);

    return (
      <>
        <div className="form-card">
          <div className="sec-head"><span className="si"><Icon name="sparkles" size={18} /></span> Sua assinatura</div>

          <Linha rotulo="Plano" valor={plano.valor} detalhe={plano.detalhe} />
          <Linha
            rotulo="Ciclo"
            valor={a.ciclo ? NOME_DO_CICLO[a.ciclo] : "Não se aplica"}
            detalhe={a.ciclo === "anual" ? "cobrado uma vez por ano" : null}
          />
          <Linha rotulo="Próxima cobrança" valor={cobranca.valor} detalhe={cobranca.detalhe} />
          <Linha rotulo="Pacientes ativos" valor={uso.valor} detalhe={uso.detalhe} />

          <div className="as-acoes">
            <button className="btn btn-primary btn-sm" onClick={() => irParaPlanos()}>
              <Icon name="sparkles" size={16} /> {a.plano ? "Trocar de plano" : "Ver planos"}
            </button>
            {a.plano && (
              <button className="btn btn-ghost btn-sm" onClick={() => irParaPlanos(a.ciclo === "anual" ? "mensal" : "anual")}>
                {a.ciclo === "anual" ? "Mudar para mensal" : "Mudar para anual"}
              </button>
            )}
            {a.plano && (
              <button className="btn btn-ghost btn-sm" onClick={() => setCancelando(true)}>Cancelar assinatura</button>
            )}
          </div>
          {/* Trocar abre um checkout novo, e a recorrência antiga continua na
              Cakto: sem aviso, a pessoa pagava duas (auditoria 25/09/2026). */}
          {a.plano && (
            <p className="help-text" style={{ margin: "10px 0 0" }}>
              Ao trocar de plano ou de ciclo, a assinatura atual não é cancelada sozinha. Depois de assinar o novo, peça o cancelamento da anterior para não ser cobrada duas vezes.
            </p>
          )}
        </div>

        <div className="form-card">
          <div className="sec-head"><span className="si"><Icon name="wallet" size={18} /></span> Faturas</div>
          {/* O pagamento online existe (Cakto), mas as faturas ficam lá:
              aqui não há lista para mostrar (auditoria de 25/09/2026). */}
          <p className="help-text" style={{ marginBottom: 0 }}>
            O pagamento é feito pela Cakto, e as faturas e comprovantes ficam com ela.
            Se precisar de uma segunda via, fale com o suporte.
          </p>
        </div>

        <div className="form-card">
          <div className="sec-head"><span className="si"><Icon name="download" size={18} /></span> Seus dados</div>
          <p className="help-text">
            Tudo o que você registrou é seu e pode sair daqui quando você quiser, em qualquer
            situação da assinatura, inclusive em modo leitura.
          </p>
          <window.BotaoExportar className="btn btn-ghost btn-sm" />
        </div>

        {cancelando && <ModalCancelar onFechar={() => setCancelando(false)} />}
      </>
    );
  }

  window.PainelAssinatura = PainelAssinatura;
  /* Exposto para os testes: são as frases que a cliente lê sobre o
     próprio dinheiro, e elas precisam ser conferidas. */
  window.EducareAssinaturaTextos = { planoAtual, proximaCobranca, usoDePacientes };
})();