Is there an event that fires when topic-lists are reloaded?

Dev
7

This is a lot more than the images gallery (love that too, though, btw) This is an alternative for the topic list feed, no? Is there a public repository for what’s shown here?

I think the key thing here is that TLP uses a table, just like vanilla discourse, … so looks like I just have to modify topic-list-item and topic-list :slight_smile: :

<tbody>
  {{#each filteredTopics as |topic|}}
    {{topic-list-item topic=topic
<SNIP>
                      tagsForUser=tagsForUser}}
    {{raw "list/visited-line" lastVisitedTopic=lastVisitedTopic topic=topic}}
  {{/each}}
</tbody>

etc.

masonry uses css grid presumably, which uses div tags … so I’m going with the assumption these were altered to use div tags … having a go myself but all pointers appreciated! (but I did find this guide which is very handy!)

OK I’ve reached a bit of an impasse:

I’ve edited both

  • topic-list.hbs: (added to TLP plug-in so I can change tbody to div)
{{#if socialStyle}}
<div class='grid'>
  {{#each filteredTopics as |topic|}}
    {{topic-list-item topic=topic
                      bulkSelectEnabled=bulkSelectEnabled

and:

  • topic-list-item.raw.hbs (taken from TLP plug-in but edited)
{{#if socialStyle}}
<div class='grid-item'>
    {{raw "list/topic-list-title" topic=topic socialStyle=socialStyle showTopicPostBadges=showTopicPostBadges}}
    {{#if showThumbnail}}
      {{raw "list/topic-thumbnail" topic=topic thumbnails=thumbnails category=category}}
      {{/if}}

But I still end up with a <tr> tag being added between them and can’t see where it’s being generated?:

image
image1106×321 21.9 KB

Could this be being added by the javascript in topic-list-item.js.es6? Most definitely.

Attempting to overwrite with this in the initialiser:

api.modifyClass('component:topic-list-item', {
  tagName: 'div'
});

So I now have this working …