Obter Nome da Categoria usando JS

Dev
1

Olá, talvez alguém possa ajudar.
Preciso obter o nome da categoria da página atual.
Preciso disso em um script JS que possa adicionar ao rodapé ou ao corpo.
Já tentei algumas soluções, mas não consigo que funcione de forma estável, considerando as transições de página do usuário.
Planejo passar o nome da categoria resultante como um Evento no Google Analytics para contar as visitas de cada categoria.

2

Pode haver uma maneira de fazer isso de forma consistente tanto nas páginas de tópicos quanto nas de categorias, mas obtive o ID da categoria de duas maneiras diferentes… uma para páginas de categoria:

<script type="text/discourse-plugin" version="0.8">
const container = Discourse.__container__;
const controller = container.lookup('controller:navigation/category');

api.onPageChange((url, title) => {
  console.log(controller.get("category.id"));
});
</script>

e uma forma semelhante para páginas de tópicos:

<script type="text/discourse-plugin" version="0.8">
const container = Discourse.__container__;
const controller = container.lookup('controller:topic');

api.onPageChange((url, title) => {
  console.log(controller.get("model.category_id"));
});
</script>

No exemplo da página de categoria, você pode usar alternativamente category.name ou category.slug, mas no modelo de tópico apenas o category_id está disponível, então você precisaria fazer um pouco mais de trabalho para obter o nome. O ID pode ser um caminho melhor de qualquer forma, pois é consistente mesmo que o nome ou o slug da categoria mudem.

4

Consegui obter o ID da Categoria para as páginas de Categoria e Tópico,
mas quando vou para a FAQ ou outra página, o ID da Categoria também é exibido, da página anterior.
Como posso excluir isso?

Aqui está meu código, ele funciona, mas não conheço JS em geral.

<script type="text/discourse-plugin" version="0.8">
const container = Discourse.__container__;

api.onPageChange((url, title) => {
    const topic = container.lookup('controller:topic');
    const topic_cat_id = topic.get("model.category_id");
    if(typeof topic_cat_id !== "undefined")
    {
        gtag('event', 'Categories Views Analytics', {
            'event_category': 'Topic Page',
            'event_label': topic_cat_id,
        });
        console.log("Topic " + topic_cat_id);
    } else {
        const category = container.lookup('controller:navigation/category');
        const category_cat_id = category.get("category.id");  
        
        if(typeof category_cat_id !== "undefined") 
        {
            gtag('event', 'Categories Views Analytics', {
                'event_category': 'Category Page',
                'event_label': category_cat_id,
            });  
            console.log("Category " + category_cat_id);
        } else {
            gtag('event', 'Categories Views Analytics', {
                'event_category': 'Other Page',
                'event_label': 'Other Page'
            });              
            console.log("Other");
        }
    }
});
</script>

Devo ter errado algo nas variáveis ou preciso obter um controlador de um tipo diferente de página.