content.js

class NMBlipIA {
    constructor() {
        // text area do blip
      this.seletorTextarea = 'textarea#text-input, textarea[placeholder="Escreva uma mensagem..."]';

      this.containerSugestoes = null;

      this.textareaAtual = null;
      this.estaProcessando = false;
      this.timerInput = null;
      this.configuracoes = {
        sugestaoAutomatica: true,
        atrasoSugestao: 1000
      };

      this.iniciar();
    }

    async iniciar() {
      console.log('NM Blip IA iniciado para o Blip Desk.');

      const configuracoesArmazenadas = await chrome.runtime.sendMessage({ acao: 'obterConfiguracoes' });
      if (configuracoesArmazenadas.sucesso) {
        this.configuracoes = configuracoesArmazenadas.configuracoes;
      }

      // observador de mudancas (responsividade, etc) no textarea
      const observador = new MutationObserver(() => this.encontrarEConfigurarInterface());
      observador.observe(document.body, { childList: true, subtree: true });

      chrome.runtime.onMessage.addListener((requisicao) => {
        if (requisicao.acao === 'configuracoesAlteradas') {
          this.configuracoes = requisicao.alteracoes;
        }
      });
    }

    // configuracao de interface 
    encontrarEConfigurarInterface() {
      const textarea = document.querySelector(this.seletorTextarea);
      if (textarea && !textarea.dataset.assistenteIaConfigurado) {
        textarea.dataset.assistenteIaConfigurado = 'true';
        console.log('textarea do blip encontrada com sucesso!', textarea);

        const wrapper = textarea.closest('.input-wrapper');
        if (wrapper && !wrapper.querySelector('.ai-container-sugestoes')) {
          this.containerSugestoes = document.createElement('div');
          this.containerSugestoes.className = 'ai-container-sugestoes';
          wrapper.prepend(this.containerSugestoes);
          console.log('conteiner de sugestões fixo injetado com sucesso.');
        }

        this.textareaAtual = textarea;
        
        this.gerarSugestoes(textarea); 
        
        textarea.addEventListener('input', () => this.aoDigitarTextarea(textarea));
      }
    }

    // sugestoes aparecendo ao digitar
    aoDigitarTextarea(textarea) {
      if (!this.configuracoes.sugestaoAutomatica) return;

      clearTimeout(this.timerInput);
      this.timerInput = setTimeout(() => {
        if (textarea.value.length > 3) {
          this.gerarSugestoes(textarea);
        } else {
          this.gerarSugestoes(textarea);
        }
      }, this.configuracoes.atrasoSugestao || 1000);
    }

    // ler contexto do cliente
    capturarContextoConversa() {
        // ler div bubble-left do blip
      const elementosMensagem = document.querySelectorAll('.bubble.left');
      const historico = Array.from(elementosMensagem).map(el => el.textContent?.trim()).filter(Boolean);
      const historicoRecente = historico.slice(-10);
      console.log(`contexto capturado: ${historicoRecente.length} mensagens do cliente.`);
      return historicoRecente;
    }

    async gerarSugestoes(textarea) {
      if (this.estaProcessando || !this.containerSugestoes) return;
      this.estaProcessando = true;
      this.mostrarCarregamento();

      try {
        const contexto = {
          mensagemAtual: textarea.value,
          historicoConversa: this.capturarContextoConversa()
        };

        const resposta = await chrome.runtime.sendMessage({
          acao: 'gerarSugestoes',
          dados: contexto
        });

        if (resposta.sucesso && resposta.sugestoes && resposta.sugestoes.length > 0) {
          this.mostrarSugestoes(resposta.sugestoes, textarea);
          chrome.runtime.sendMessage({ acao: 'salvarFeedback', dados: { usado: false } });
        } else {
          this.mostrarCarregamento("Sem sugestões no momento."); 
          if (resposta.erro) console.error('falha ao gerar sugestões:', resposta.erro);
        }
      } catch (erro) {
        this.mostrarCarregamento("Erro ao buscar sugestões.");
        console.error('erro ao comunicar com o script de fundo:', erro);
      } finally {
        this.estaProcessando = false;
      }
    }

    // carregamento no conteiner atual
    mostrarCarregamento(mensagem = "Gerando sugestões...") {
        if (!this.containerSugestoes) return;
        this.containerSugestoes.innerHTML = `
            <div class="ai-sugestao-carregando">
            <div class="ai-spinner"></div>
            <span>${mensagem}</span>
            </div>`;
        this.containerSugestoes.style.display = 'flex'; 
    }

    // sugestoes
    mostrarSugestoes(sugestoes, textarea) {
      if (!this.containerSugestoes) return;
      this.containerSugestoes.innerHTML = sugestoes.map(sugestao => `
        <div class="ai-item-sugestao" title="Usar esta sugestão">
          <span class="ai-fonte">Gerado por NM BLiP IA</span>
          <span class="texto-sugestao">${sugestao}</span>
        </div>
      `).join('');

      this.containerSugestoes.style.display = 'flex'; 
      this.configurarOuvintesSugestao(textarea);
    }

    // ouvintes de sugestao no container
    configurarOuvintesSugestao(textarea) {
      if (!this.containerSugestoes) return;

      this.containerSugestoes.querySelectorAll('.ai-item-sugestao').forEach(item => {
        item.addEventListener('click', () => {
          const textoSugestao = item.querySelector('.texto-sugestao').textContent;
          textarea.value = textoSugestao;
          textarea.focus();
          textarea.dispatchEvent(new Event('input', { bubbles: true }));

          chrome.runtime.sendMessage({
              acao: 'salvarFeedback',
              dados: { sugestao: textoSugestao, usado: true }
          });

          this.limparSugestoes(); 
        });
      });
    }

    // clean
    limparSugestoes() {
      if (this.containerSugestoes) {
        this.containerSugestoes.innerHTML = '';
        this.containerSugestoes.style.display = 'none'; 
      }
    }
  }

  // init
  new NMBlipIA();