Come posso estrarre l'elenco dei tag dell'argomento attualmente aperto?

Sviluppatore
1

Ciao!

Sto cercando di creare un componente tematico che aggiunga un pulsante personalizzato agli argomenti taggati. Ad esempio: gli argomenti taggati con event-tag avranno un pulsante accanto alla categoria chiamato Evento che rimanderà alla pagina degli eventi.

Ho capito dove vorrei aggiungere il pulsante (tramite il plugin-outlet topic-category) attraverso questa guida: Developing Discourse Themes & Theme Components

e attualmente ho questo:

<script type="text/x-handlebars" data-template-name="/connectors/topic-category/foobar2">
    <div style="height: 25px; width: 25px;background: red">
      <a href="<evens_URL>" target="_blank">Link</a>
    </div>
  </script>

Quindi la mia domanda è: come posso controllare l’elenco dei tag dell’argomento per vedere se lo script sopra dovrebbe aggiungere un pulsante o meno?

2

Va bene, un po’ di progresso:

Ho scoperto che se uso modifyClass in questo modo:

<script type="text/discourse-plugin" version="0.8">
    api.modifyClass("component:topic-category", {
      didInsertElement: function() {
        this._super();
        console.log("Welcome to the topics page!")
      }
    });
</script>

Posso accedere alla pagina dell’argomento e ottenere una risposta che dice “welcome”, ma non sono ancora sicuro di come recuperare i tag della pagina corrente per vedere se devo popolare il pulsante o meno..

3

Ah, ho trovato la soluzione.

Ho continuato a rileggere questo: Developing Discourse Themes & Theme Components

e ho scoperto che se faccio semplicemente console.log(this) è stato in grado di stampare tutti i dati sulla pagina, incluse le etichette. Penso di poter procedere da qui estraendo i dati delle etichette sulla pagina e verificando se sono presenti nelle impostazioni o meno. Una volta che avrò rifinito questo e penserò che sia pronto per il pubblico, lo pubblicherò nella categoria dei componenti del tema. Pensavo solo di condividere le mie scoperte nel caso qualcun altro stesse imparando a creare componenti del tema!

4

Solo per informazione, il codice per ottenere l’elenco dei tag in questo contesto sarebbe:

<script type="text/discourse-plugin" version="1.4.0">
    api.modifyClass("component:topic-category", {
      pluginId: "returnTags",
      didInsertElement: function() {
        this._super();
        console.log(this.topic.tags)
      }
    });
</script>

Restituisce:

image
image210×102 1.7 KB

:information_source: (pluginId è richiesto per evitare un avviso)