Esto se puede hacer con bastante facilidad.
Puedes mirar el código de este componente y adaptarlo para ocultar elementos con CSS (apuntando a .similar-topics) en la configuración de preferencias de los usuarios. Eso es exactamente lo que he hecho en https://unicyclist.com/, donde los usuarios tienen una opción para ocultar el icono de donación en la parte superior derecha del encabezado.
Básicamente, el único cambio que hice al plugin original es que almaceno la configuración en una cookie (quiero recordar a mi usuario que done cada año para las tarifas de los servidores).
Aquí está el código de mi propio componente de tema:
// establece la duración de la cookie a 1 año
function setHideDonationCookie(value=null) {
var now = new Date();
var time = now.getTime();
var expireTime = time + 1000*60*60*24*365;
now.setTime(expireTime);
document.cookie = 'donationButton=' + value + ';expires='+now.toUTCString()+';path=/';
}
// devuelve el valor de la cookie
function getCookie(name) {
var dc = document.cookie;
var prefix = name + "=";
var begin = dc.indexOf("; " + prefix);
if (begin == -1) {
begin = dc.indexOf(prefix);
if (begin != 0) return null;
}
else
{
begin += 2;
var end = document.cookie.indexOf(";", begin);
if (end == -1) {
end = dc.length;
}
}
return decodeURI(dc.substring(begin + prefix.length, end));
}
function getToggleDonationIcon() {
let pref = getCookie('donationButton');
let result = settings.default_enabled;
if (pref !== null) {
result = pref === "true";
}
return result;
}
// Añadimos la regla CSS en el código HTML
if (getToggleDonationIcon()) {
let style = document.createElement('style');
style.innerHTML = ".header-icon-help-fund-servers-fees{ display: none; }";
document.head.appendChild(style);
}
// técnicamente solo queremos modificar al usuario actual
api.modifyClass("model:user", {
toggleDonationIcon: function() {
return getToggleDonationIcon();
}.property()
});
api.modifyClass("controller:preferences/interface", {
actions: {
save() {
this._super();
// establece el valor de la cookie como el valor de la configuración
if(this.get("model.toggleDonationIcon") != getToggleDonationIcon()) {
setHideDonationCookie(this.get("model.toggleDonationIcon").toString());
if(this.get("model.toggleDonationIcon") == false) {
document.getElementsByClassName("header-icon-help-fund-servers-fees")[0].style.display = "";
}
else {
document.getElementsByClassName("header-icon-help-fund-servers-fees")[0].style.display = "none";
}
}
}
}
});