Não posso dizer que encontrei uma solução ideal, mas descobri qual era o problema para mim.
O problema pode ser encontrado aqui
https://github.com/discourse/Discourse-nav-links-component/blob/main/desktop/head_tag.html
Especificamente, esta parte:
api.modifyClass("component:navigation-item", {
pluginId: "discourse-nav-links-component",
active: Ember.computed("contentFilterMode", "filterMode", function() {
let contentFilterMode = this.get("content").get("filterMode");
if (window.location.pathname === location) {
return contentFilterMode === filter;
} else {
return this._super(contentFilterMode, this.get("filterMode"));
}
})
});
Parece que isso define o “ativo” em cada link de navegação. Francamente, a lógica de como ele decide e o que todas essas variáveis são é bastante opaca para mim. Mas o problema está aqui:
if (window.location.pathname === location) {
return contentFilterMode === filter;
} else {
return this._super(contentFilterMode, this.get("filterMode"));
}
Para mim, isso verifica se a URL da página é a mesma que a localização da URL da barra de navegação e, se for, retorna o resultado de contentFilterMode === filter, sendo ambas as variáveis um pouco obscuras para mim. Se a condição falhar, parece que ele apenas executa a lógica regular de se algo deve ser marcado como ativo (que é por que meus links não personalizados parecem funcionar bem). O problema é que, embora este código seja executado corretamente uma vez por link de navegação, a variável location parece ser sempre “categories”, então a instrução if é sempre falsa para links personalizados. Além disso, mesmo que eu corrija a variável “location” substituindo-a por this.get("content").href, o valor de retorno também é sempre falso porque a variável filter também é sempre definida como “categories”.
Normalmente, eu faria um PR para corrigir isso, mas o problema raiz real ainda me escapa. Eu criei uma solução alternativa que funciona para mim, mas altera ligeiramente a funcionalidade documentada deste componente, então prefiro não fazer um PR. Acho que haverá casos extremos em que não funcionará também, como se sua página inicial estivesse definida como /latest
api.modifyClass("component:navigation-item", {
pluginId: "discourse-nav-links-component",
active: Ember.computed("contentFilterMode", "filterMode", function() {
return window.location.pathname.includes(this.get("content").href);
})
});
Basicamente, ele apenas verifica se a URL atual inclui a URL da barra de navegação como uma substring. Se sim, ele a destaca.
Hospedado por nós? Componentes de tema estão disponíveis para uso em nossos planos Standard, Business e Enterprise.
