Plugins - modifying category titles in the category list


#1

I am trying to write a plugin that will modify category titles in the category list.

(in particular, I’m trying to flag categories that have no subscribed users, but that’s probably beside the point… I’ve got all the ActiveRecord stuff figured out on the back end, I’m think I’m just struggling understanding how to tie in all the Ember stuff).



This is the desired effect:

(PS: I made this screenshot by temporarily overriding Discourse’s categories.hbs by temporarily copying it into my plugin’s assets/javascripts/discourse/templates/discovery/categories.hbs and registering it, with modifications:

// -- The line below is the modified one --
<img src="/images/emoji/emoji_one/warning.png?v=1" title="This category has no subscribers" class="emoji" alt=":warning:">
// -- end modification --

{{category-title-link category=c}}
{{category-unread category=c}}
{{#if c.logo_url}}
  {{category-logo-link category=c}}
{{/if}}

just to prove that I could do something like this. /end PS)



Anyways, I thought a good place to start would be to override the default category-title-link component by copying the existing code into my plugin’s assets/javascripts/discourse/components/category-title-link.js.es6.

import { iconHTML } from 'discourse/helpers/fa-icon';

console.log("Component standing by!");

export default Ember.Component.extend({
  tagName: 'h3',

  render(buffer) {
    const category = this.get('category');
    const categoryUrl = Discourse.getURL('/c/') + Discourse.Category.slugFor(category);
    const categoryName = Handlebars.Utils.escapeExpression(category.get('name'));

    if (category.get('read_restricted')) { buffer.push(iconHTML('lock')); }

    buffer.push(`<a href='${categoryUrl}'>`);
    buffer.push(`<span class='category-name'>${categoryName}   !!!!!!!!!!!!   </span>`);
    buffer.push(`</a>`);
  }
});

I was hoping that this would cause all of the category names in the discovery list to be followed by a bunch of exclamation marks, but that didn’t work. I’ve tried a bunch of other things, too, but none of those worked either.

I’ve read through the beginner plugin guide, installed and tried to reverse engineer other plugins, and all that good stuff, but I seem to be stuck.

Any ideas? Thanks for the guidance.