Add Unsolved button to top menu using custom HTML

Dev
2

That works great, if you want to only display the buttons on certain categories then you can do some fairly simple logic to check the category name. I also filter out “closed” topics for my “unsolved” button.

This is what I use:

<script>
  Discourse.ExternalNavItem = Discourse.NavItem.extend({
    href : function() {
      return this.get('href');
    }.property('href'),
  });

  I18n.translations.en.js.filters.Completed = { title: "Completed", help: "Topics that have been marked as solved" };
  I18n.translations.en.js.filters.Outstanding = { title: "Outstanding", help: "Topics that are not yet marked as solved" };

  Discourse.NavItem.reopenClass({
    buildList : function(category, args) {
     var list = this._super(category, args);
     if(!category) {
          //Don't display anything
     }else if(category.slug==='support') {
        list.push(Discourse.NavItem.create({href: '/c/support?solved=yes', name: "Completed"}));
        list.push(Discourse.NavItem.create({href: '/c/support?solved=no&status=open', name: "Outstanding"}));
      }else if(category.slug==='jobs') {
        list.push(Discourse.NavItem.create({href: '/c/jobs?solved=yes', name: "Completed"}));
        list.push(Discourse.NavItem.create({href: '/c/jobs?solved=no&status=open', name: "Outstanding"}));
      }
      return list;
    }
  });
</script>
11 Likes