Reações específicas de tópicos e postagens por categoria?

Suporte
1

É possível ter reações de tópicos e posts específicas por categoria?

Não estou encontrando nada nativo e nenhum componente existente.

Se não for possível atualmente, quais seriam os passos para alcançar algo assim?

2

Olá Noah,

Você está correto, não há como mostrar reações diferentes para posts/tópicos com base em uma determinada categoria no momento.

Sua melhor opção é perguntar em Marketplace

1 curtida
3

Perfeito :slight_smile:

Tenho alguma experiência com desenvolvimento em outros ambientes, mas estou explorando se é possível via um componente de tema.

Com um pouco de ajuda da IA :sweat_smile: parece que consegui fazer funcionar, mas não tenho 100% de certeza se esta é a maneira correta de se fazer no Discourse:

<script type="text/discourse-plugin" version="0.1">
  api.onPageChange(() => {
    try {
      const isTopicPage = /^\/t\//.test(window.location.pathname);

      // Executa apenas em páginas de tópico
      if (!isTopicPage) return;

      const allowedCategories = ['ask-a-question']; // Usa slugs de categoria diretamente

      // Acessa os detalhes do tópico para obter o slug da categoria
      const topic = Discourse.__container__.lookup("controller:topic");
      const categorySlug = topic && topic.get("model.category.slug");
      const isAllowedCategory = categorySlug && allowedCategories.includes(categorySlug);

      // Função para ocultar ou mostrar o emoji específico
      const toggleReactionEmoji = () => {
        const emoji = document.querySelector("[data-reaction='frog']");

        if (emoji) {
          emoji.style.display = isAllowedCategory ? '' : 'none';
          console.log(`Emoji com data-reaction='frog' ${isAllowedCategory ? 'exibido' : 'ocultado'}.`);
        }
      };

      // Verificação inicial caso o elemento já esteja no DOM
      toggleReactionEmoji();

      // Configura um observador de mutação para ocultar/mostrar emoji com base nas mudanças de categoria
      const observer = new MutationObserver(mutations => {
        mutations.forEach(mutation => {
          mutation.addedNodes.forEach(node => {
            if (node.nodeType === 1) { // Verifica se é um nó de elemento
              const emoji = node.querySelector("[data-reaction='frog']");
              if (emoji) {
                emoji.style.display = isAllowedCategory ? '' : 'none';
                console.log(`Emoji com data-reaction='frog' encontrado na mutação e ${isAllowedCategory ? 'exibido' : 'ocultado'}.`);
              }
            }
          });
        });
      });

      // Observa o body por mudanças na lista de filhos (por exemplo, reações sendo adicionadas)
      observer.observe(document.body, { childList: true, subtree: true });

      // Limpa o observador ao navegar para longe
      api.cleanupStream(() => observer.disconnect());

    } catch (error) {
      console.error("Ocorreu um erro no script de alternância de emoji:", error);
    }
  });
</script>
1 curtida