/* ============================================================
   Devonew — membro · Bíblia (leitor)
   Tradução Almeida (domínio público) via getbible.net v2.
   Cada capítulo lido é cacheado em localStorage → leitura offline.
   ============================================================ */
const { useState: useStateB, useEffect: useEffectB, useRef: useRefB } = React;

/* 66 livros · nome PT-BR + nº de capítulos (número do livro = índice + 1) */
const BIBLE = (function () {
  const AT = [
    ['Gênesis', 50], ['Êxodo', 40], ['Levítico', 27], ['Números', 36], ['Deuteronômio', 34],
    ['Josué', 24], ['Juízes', 21], ['Rute', 4], ['1 Samuel', 31], ['2 Samuel', 24],
    ['1 Reis', 22], ['2 Reis', 25], ['1 Crônicas', 29], ['2 Crônicas', 36], ['Esdras', 10],
    ['Neemias', 13], ['Ester', 10], ['Jó', 42], ['Salmos', 150], ['Provérbios', 31],
    ['Eclesiastes', 12], ['Cânticos', 8], ['Isaías', 66], ['Jeremias', 52], ['Lamentações', 5],
    ['Ezequiel', 48], ['Daniel', 12], ['Oséias', 14], ['Joel', 3], ['Amós', 9],
    ['Obadias', 1], ['Jonas', 4], ['Miquéias', 7], ['Naum', 3], ['Habacuque', 3],
    ['Sofonias', 3], ['Ageu', 2], ['Zacarias', 14], ['Malaquias', 4],
  ];
  const NT = [
    ['Mateus', 28], ['Marcos', 16], ['Lucas', 24], ['João', 21], ['Atos', 28],
    ['Romanos', 16], ['1 Coríntios', 16], ['2 Coríntios', 13], ['Gálatas', 6], ['Efésios', 6],
    ['Filipenses', 4], ['Colossenses', 4], ['1 Tessalonicenses', 5], ['2 Tessalonicenses', 3],
    ['1 Timóteo', 6], ['2 Timóteo', 4], ['Tito', 3], ['Filemom', 1], ['Hebreus', 13],
    ['Tiago', 5], ['1 Pedro', 5], ['2 Pedro', 3], ['1 João', 5], ['2 João', 1],
    ['3 João', 1], ['Judas', 1], ['Apocalipse', 22],
  ];
  let nr = 0;
  const mk = (arr, testament) => arr.map(([name, chapters]) => ({ nr: ++nr, name, chapters, testament }));
  const books = [...mk(AT, 'AT'), ...mk(NT, 'NT')];
  const byNr = (n) => books.find((b) => b.nr === n);

  /* traduções livres (domínio público). ARA/ACF/NVI são licenciadas —
     ver provedor licenciado em window.BIBLE.LICENSED para plugar depois. */
  const TRANSLATIONS = [
    { key: 'almeida', label: 'Almeida Atualizada', short: 'AA' },
    { key: 'livre', label: 'Bíblia Livre', short: 'BL' },
    { key: 'livretr', label: 'Bíblia Livre · Textus Receptus', short: 'BL-TR' },
  ];
  const TKEY = 'devonew_bible_trans';
  const getTrans = () => { try { return localStorage.getItem(TKEY) || 'almeida'; } catch (e) { return 'almeida'; } };
  const setTrans = (t) => { try { localStorage.setItem(TKEY, t); } catch (e) {} };
  const transLabel = (k) => (TRANSLATIONS.find((t) => t.key === k) || TRANSLATIONS[0]).label;
  const chKey = (trans, b, c) => `devonew_bible_${trans}_${b}_${c}`;

  async function chapter(trans, bookNr, ch) {
    const key = chKey(trans, bookNr, ch);
    try { const cached = localStorage.getItem(key); if (cached) return { verses: JSON.parse(cached), cached: true }; } catch (e) {}
    const url = `https://api.getbible.net/v2/${trans}/${bookNr}/${ch}.json`;
    const r = await fetch(url);
    if (!r.ok) throw new Error('HTTP ' + r.status);
    const j = await r.json();
    const verses = (j.verses || []).map((v) => ({ n: v.verse, t: String(v.text || '').replace(/\s+/g, ' ').trim() }));
    try { localStorage.setItem(key, JSON.stringify(verses)); } catch (e) {}
    return { verses, cached: false };
  }

  function adjacent(bookNr, ch, dir) {
    const b = byNr(bookNr); if (!b) return null;
    let nc = ch + dir;
    if (nc >= 1 && nc <= b.chapters) return { b: bookNr, c: nc };
    if (dir > 0) { const nb = byNr(bookNr + 1); return nb ? { b: nb.nr, c: 1 } : null; }
    const pb = byNr(bookNr - 1); return pb ? { b: pb.nr, c: pb.chapters } : null;
  }

  /* progresso é POR MEMBRO (igreja real): usa o mesmo namespace m_<membro>_
     do app.jsx, lido na hora (o login pode acontecer depois deste módulo
     carregar). A demo continua com as chaves globais de sempre. */
  const _tnt = (window.DEVO_TENANT || '').toLowerCase();
  const _demoTenant = !_tnt || _tnt === 'comunidadevida';
  const mpref = () => {
    if (_demoTenant) return '';
    try { const m = JSON.parse(localStorage.getItem('devonew_current_member') || 'null'); return 'm_' + ((m && m.key) || 'convidado') + '_'; }
    catch (e) { return 'm_convidado_'; }
  };
  const sync = (key, value) => { if (window.DEVO_SYNC) window.DEVO_SYNC(key, value); };

  const LAST = () => 'devonew_' + mpref() + 'bible_last';
  const lastRead = () => { try { return JSON.parse(localStorage.getItem(LAST())) || null; } catch (e) { return null; } };
  const setLast = (v) => { try { localStorage.setItem(LAST(), JSON.stringify(v)); } catch (e) {} sync('bible_last', v); };

  /* registro de leitura (liga à Trilha de Crescimento) */
  const READ = () => 'devonew_' + mpref() + 'bible_read';
  const readLog = () => { try { return JSON.parse(localStorage.getItem(READ())) || {}; } catch (e) { return {}; } };
  const isRead = (b, c) => !!readLog()[b + '_' + c];
  const markRead = (b, c) => {
    const log = readLog(); const k = b + '_' + c;
    if (log[k]) return false;
    log[k] = Date.now();
    try { localStorage.setItem(READ(), JSON.stringify(log)); } catch (e) {}
    sync('bible_read', log);
    return true;
  };
  const readCount = () => Object.keys(readLog()).length;

  /* progresso de leitura → alimenta a Trilha de Crescimento (XP, painel e medalhas) */
  const totalChapters = books.reduce((s, b) => s + b.chapters, 0);
  function progress() {
    const log = readLog();
    const perBook = {};
    let read = 0, booksDone = 0, gospelsDone = 0;
    const at = { read: 0, total: 0 }, nt = { read: 0, total: 0 };
    books.forEach((b) => {
      let n = 0;
      for (let c = 1; c <= b.chapters; c++) if (log[b.nr + '_' + c]) n++;
      perBook[b.nr] = n;
      read += n;
      const t = b.testament === 'AT' ? at : nt;
      t.read += n; t.total += b.chapters;
      if (n >= b.chapters) { booksDone++; if (b.nr >= 40 && b.nr <= 43) gospelsDone++; } // 40-43 = Evangelhos
    });
    return { read, total: at.total + nt.total, at, nt, booksDone, gospelsDone, perBook };
  }
  const bookDone = (nr) => { const b = byNr(nr); return !!b && progress().perBook[nr] >= b.chapters; };
  const ntComplete = () => { const p = progress(); return p.nt.read >= p.nt.total; };
  const bibleComplete = () => { const p = progress(); return p.read >= p.total; };

  return { books, byNr, chapter, adjacent, lastRead, setLast, isRead, markRead, readCount, totalChapters, progress, bookDone, ntComplete, bibleComplete, TRANSLATIONS, getTrans, setTrans, transLabel };
})();

/* seletor de tradução */
function TransSelect({ value, onChange }) {
  return (
    <div className="bib-trans">
      <select value={value} onChange={(e) => onChange(e.target.value)} aria-label="Tradução">
        {BIBLE.TRANSLATIONS.map((t) => <option key={t.key} value={t.key}>{t.label}</option>)}
      </select>
      <Icon name="chevronDown" size={15}/>
    </div>
  );
}

/* ---------- leitura de um capítulo ---------- */
function BibleReader({ trans, onTrans, bookNr, ch, onNav, onClose, toast, onMarkRead, readXp = 3 }) {
  const book = BIBLE.byNr(bookNr);
  const [state, setState] = useStateB({ loading: true, error: false, verses: [] });
  const [read, setRead] = useStateB(() => BIBLE.isRead(bookNr, ch));
  const scrollTopRef = useRefB(null);

  useEffectB(() => {
    let cancelled = false;
    setRead(BIBLE.isRead(bookNr, ch));
    setState({ loading: true, error: false, verses: [] });
    BIBLE.chapter(trans, bookNr, ch)
      .then((res) => { if (!cancelled) { setState({ loading: false, error: false, verses: res.verses }); BIBLE.setLast({ b: bookNr, c: ch }); } })
      .catch(() => { if (!cancelled) setState({ loading: false, error: true, verses: [] }); });
    if (scrollTopRef.current) scrollTopRef.current.scrollIntoView();
    return () => { cancelled = true; };
  }, [trans, bookNr, ch]);

  const prev = BIBLE.adjacent(bookNr, ch, -1);
  const next = BIBLE.adjacent(bookNr, ch, +1);

  const copyVerse = (v) => {
    const txt = `“${v.t}” — ${book.name} ${ch}:${v.n}`;
    try { navigator.clipboard.writeText(txt); } catch (e) {}
    toast && toast('Versículo copiado');
  };
  const markRead = () => { if (!read && onMarkRead) onMarkRead(bookNr, ch); setRead(true); };

  return (
    <div className="col fade-up" ref={scrollTopRef}>
      <button className="btn btn-quiet" style={{ marginLeft: -8, marginBottom: 6, alignSelf: 'flex-start' }} onClick={onClose}>
        <Icon name="chevronL" size={18}/>Bíblia
      </button>

      <div className="bib-read-head">
        <div className="row between gap-10" style={{ alignItems: 'flex-start' }}>
          <span className="eyebrow">Capítulo {ch}</span>
          <TransSelect value={trans} onChange={onTrans} />
        </div>
        <h1 className="read-title" style={{ fontSize: 'clamp(26px, 6vw, 34px)', margin: '6px 0 0' }}>{book.name} {ch}</h1>
      </div>

      {state.loading && (
        <div className="bib-state"><span className="bib-spin"/>Carregando o texto…</div>
      )}
      {state.error && (
        <div className="bib-state error">
          <Icon name="warning" size={20}/>
          <div>Não foi possível carregar agora. Verifique sua conexão e tente de novo.</div>
          <button className="btn btn-ghost btn-sm" onClick={() => onNav({ b: bookNr, c: ch })}>Tentar de novo</button>
        </div>
      )}

      {!state.loading && !state.error && (
        <>
          <div className="bib-prose">
            {state.verses.map((v) => (
              <div key={v.n} className="bib-vrow" onClick={() => copyVerse(v)} title="Toque para copiar">
                <span className="bib-vnum">{v.n}</span>
                <span className="bib-vtext">{v.t}</span>
              </div>
            ))}
          </div>

          <div className="bib-done">
            {read ? (
              <span className="chip chip-accent"><Icon name="check" size={16}/>Capítulo lido</span>
            ) : (
              <button className="btn btn-primary" onClick={markRead}><Icon name="check" size={17}/>Marcar como lido · +{readXp} XP</button>
            )}
          </div>

          <div className="bib-nav">
            <button className="btn btn-ghost" disabled={!prev} onClick={() => prev && onNav(prev)}>
              <Icon name="chevronL" size={17}/>Anterior
            </button>
            <span className="bib-nav-mid">{book.name} {ch}</span>
            <button className="btn btn-ghost" disabled={!next} onClick={() => next && onNav(next)}>
              Próximo<Icon name="chevron" size={17}/>
            </button>
          </div>
        </>
      )}
    </div>
  );
}

/* ---------- grade de capítulos de um livro ---------- */
function ChapterGrid({ book, onPick, onBack }) {
  return (
    <div className="col fade-up">
      <button className="btn btn-quiet" style={{ marginLeft: -8, marginBottom: 6, alignSelf: 'flex-start' }} onClick={onBack}>
        <Icon name="chevronL" size={18}/>Livros
      </button>
      <PageHead title={book.name} sub={`${book.chapters} ${book.chapters === 1 ? 'capítulo' : 'capítulos'} · ${book.testament === 'AT' ? 'Antigo' : 'Novo'} Testamento`} />
      <div className="bib-chapters">
        {Array.from({ length: book.chapters }, (_, i) => i + 1).map((c) => (
          <button key={c} className="bib-chip" onClick={() => onPick({ b: book.nr, c })}>{c}</button>
        ))}
      </div>
    </div>
  );
}

/* ---------- tela principal ---------- */
function BibliaScreen({ go, toast, onMarkRead, readXp }) {
  const [pickBook, setPickBook] = useStateB(null);   // índice de livro p/ grade
  const [reading, setReading] = useStateB(null);     // { b, c }
  const [query, setQuery] = useStateB('');
  const [trans, setTransState] = useStateB(() => BIBLE.getTrans());
  const changeTrans = (t) => { BIBLE.setTrans(t); setTransState(t); };
  const last = BIBLE.lastRead();

  if (reading) {
    return <BibleReader trans={trans} onTrans={changeTrans} bookNr={reading.b} ch={reading.c} toast={toast}
      onMarkRead={onMarkRead} readXp={readXp}
      onNav={(nav) => setReading(nav)} onClose={() => { setReading(null); }} />;
  }
  if (pickBook != null) {
    return <ChapterGrid book={BIBLE.books[pickBook]} onBack={() => setPickBook(null)}
      onPick={(nav) => { setReading(nav); setPickBook(null); }} />;
  }

  const q = query.trim().toLowerCase();
  const match = (b) => !q || b.name.toLowerCase().includes(q);
  const at = BIBLE.books.filter((b) => b.testament === 'AT' && match(b));
  const nt = BIBLE.books.filter((b) => b.testament === 'NT' && match(b));
  const openBook = (b) => setPickBook(BIBLE.books.findIndex((x) => x.nr === b.nr));

  const Section = ({ label, list }) => list.length > 0 && (
    <>
      <div className="sec-title"><h3>{label}</h3></div>
      <div className="bib-books">
        {list.map((b) => (
          <button key={b.nr} className="bib-book" onClick={() => openBook(b)}>
            <span className="bib-book-name">{b.name}</span>
            <span className="bib-book-ch">{b.chapters}</span>
          </button>
        ))}
      </div>
    </>
  );

  return (
    <div className="col stagger">
      <button className="btn btn-quiet show-mobile" style={{ marginLeft: -8, marginBottom: 4 }} onClick={() => go('hoje')}>
        <Icon name="chevronL" size={18}/>Hoje
      </button>
      <PageHead title="Bíblia Sagrada" sub="Leia, medite e guarde no coração."
        right={<TransSelect value={trans} onChange={changeTrans} />} />
      <div className="show-mobile" style={{ marginBottom: 14 }}>
        <h2 className="greet" style={{ fontSize: 26 }}>Bíblia</h2>
        <div style={{ marginTop: 8 }}><TransSelect value={trans} onChange={changeTrans} /></div>
      </div>

      {last && BIBLE.byNr(last.b) && (
        <button className="bib-continue" onClick={() => setReading({ b: last.b, c: last.c })}>
          <div className="bib-cont-ico"><Icon name="bible" size={22}/></div>
          <div className="bib-cont-body">
            <span className="eyebrow">Continuar lendo</span>
            <div className="bib-cont-ref">{BIBLE.byNr(last.b).name} {last.c}</div>
          </div>
          <Icon name="chevron" size={18}/>
        </button>
      )}

      <div className="bib-search">
        <Icon name="search" size={17}/>
        <input value={query} onChange={(e) => setQuery(e.target.value)} placeholder="Buscar livro…" />
      </div>

      <Section label="Antigo Testamento" list={at} />
      <Section label="Novo Testamento" list={nt} />
      {at.length === 0 && nt.length === 0 && (
        <div className="card pad" style={{ textAlign: 'center', color: 'var(--muted)' }}>Nenhum livro encontrado.</div>
      )}

      <p className="pray-sub" style={{ marginTop: 16, textAlign: 'center' }}>
        Os capítulos que você abre ficam salvos no aparelho para leitura offline.<br/>
        <span style={{ fontSize: 11.5 }}>Traduções de domínio público. ARA, ACF e NVI são licenciadas — disponíveis mediante contrato.</span>
      </p>
    </div>
  );
}

window.BIBLE = BIBLE;
window.BibliaScreen = BibliaScreen;