Pular para o conteúdo principal

Modal de Pré-visualização — pré-visualização do bloco na modal

PreviewModal — uma modal comum para todas as telas de configurações do Wave-2, que mostra o resultado do bloco em tempo real. É aberta pelo botão “Abrir na modal” nas telas de configurações.

Por que isso é necessário

Quando você está configurando um bloco (estratégia, filtros, audiência) — é importante entender imediatamente quais produtos aparecerão na exibição com essas configurações. A PreviewModal permite verificar isso sem publicar o bloco no site e sem alternar entre o painel de administração e o front-end.

Aba Básica — lista de produtos

A primeira aba — Básica. Mostra uma tabela de produtos que a API retornará com as configurações atuais do bloco:

  • O carregamento é feito por infinite scroll através do componente NewBlockPreviewTable.
  • Na tabela — pré-visualização dos cartões (nome, imagem, marcador, metadados resumidos).
  • A lista é atualizada automaticamente ao alterar as configurações do bloco na tela pai.

Aba Investigar — diagnóstico

A segunda aba — Investigar — é necessária para depuração. Aqui você pode ver o que aconteceu "por trás das câmeras" ao formar a exibição:

CampoO que significa
appliedAudienceRuleQual regra de audiência foi acionada para a solicitação atual. Veja Filtro de Audiência.
warningsDiagnóstico — por exemplo, "conjunto de atributos vazio", "fallback selecionou produtos que não estão na categoria escolhida".
fallbackUsedFlag: se o caminho de fallback (exibição de produtos em tendência) foi acionado.
contextEchoEco do contexto da solicitação — o que o sistema realmente recebeu (ID do usuário, carrinho, categorias selecionadas, etc.).
ℹ️Degradação graciosa

Se o backend não retornou algum campo — a seção correspondente do Investigar simplesmente é ocultada, sem erros. Isso é feito para um desenvolvimento sem problemas da API.

ID de usuário simulado — pré-visualização "em nome" do usuário

Abaixo do campo de Pré-visualização há um input ID de usuário simulado. Insira o ID de qualquer usuário — a pré-visualização construirá o resultado como se a solicitação tivesse vindo dele. Útil para:

  • Verificar recomendações pessoais (Recomendações pessoais, Compra repetida) para um cliente específico;
  • Reproduzir uma reclamação do tipo "não tenho os produtos certos no bloco" — insira o ID dele e veja o que ele verá.

Sem a indicação do ID de usuário simulado, a pré-visualização usará seu próprio contexto de administrador, e para blocos personalizados a exibição pode estar vazia ou ser irrelevante.

Direito de acesso blocks.preview

O acesso ao endpoint de administração da pré-visualização do bloco é controlado por um direito separado blocks.preview no árvore de direitos.

Isso permite:

  • Dar um papel que edita blocos, sem acesso à pré-visualização (por exemplo, para gerentes de conteúdo "somente formulário").
  • Ocultar de parte dos administradores dados sensíveis que podem ser revelados através do Investigar (contexto da solicitação, eco dos parâmetros).
💡Dica sobre direitos

Para desenvolvedores e QA — sempre conceda blocks.preview. Para gerentes de conteúdo — apenas se eles precisarem ver a exibição real do bloco antes da publicação.