Add Unsolved button to top menu using custom HTML

開発
1

Hi Folks
I found discourse solved plugin quite useful in my forum. Then I tried to add an Unsolved button to top menu. Since it was not straight forward I adopted this solution and altered it a bit.

Check out my changed code

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

  I18n.translations.en.js.filters.unresolved = { title: "Unresolved", help: "Unresolved Topics" };

  Discourse.NavItem.reopenClass({
    buildList : function(category, args) {
      var list = this._super(category, args);
      if(!category) {
        list.push(Discourse.ExternalNavItem.create({href: '/latest?solved=no', name: 'unresolved'}));
      } else {
         list.push(Discourse.ExternalNavItem.create({href: '/c/'+category.slug+'?solved=no', name: 'unresolved'}));
      }
      return list;
    }
  });
</script>

I am a newbie here; I hope this will be useful to ppl like me.

Cheers

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>
3

This is a useful solution I can use. Thanks

4

I encountered that this is not working if sub categories are added. Try the following block if you add sub categories.

if(!category) {
        list.push(Discourse.ExternalNavItem.create({href: '/latest?solved=no', name: 'unresolved'}));
      } else { 
          if(!category.parentCategory) {
            list.push(Discourse.ExternalNavItem.create({href: '/c/'+category.slug+'?solved=no', name: 'unresolved'}));
        } else {
            list.push(Discourse.ExternalNavItem.create({href: '/c/'+category.parentCategory.slug+'/'+category.slug+'?solved=no', name: 'unresolved'}));
        }
        
      }

Cheers

5

I’m having a little issue with combining those two. What should I have if I want both only a certain particular category and subcategory to show Solved/Unsolved?

6

It would be great if someone were to post a generic version (without the specific categories) of this as a theme component.

7

A generic version could be made, but for category-specific stuff it needs a small amount of work to be done on the solved plugin first:

8

こんにちは、これがテーマコンポーネントとして実装されたかどうかを確認していますが見つけられませんでした。明示的な記載は見ていませんが、上記の指示は、最新のテストでパスしているサブカテゴリを尊重しつつ、トップメニューボタンを追加するためのものとして適切に見えます。ありがとうございます！