# Unable to replace topic-list-item.raw.hbs / topic-list-item.hbr on mobile

**URL:** https://meta.discourse.org/t/unable-to-replace-topic-list-item-raw-hbs-topic-list-item-hbr-on-mobile/141395
**Category:** Development
**Created:** [12 בפברואר,‏ 2020,‏ 2:53pm UTC](https://meta.discourse.org/t/unable-to-replace-topic-list-item-raw-hbs-topic-list-item-hbr-on-mobile/141395 "2020-02-12T14:53:10Z")
**Posts on this page:** 11
**Page:** 1

<div class="post-metadata">

### Author: ![duranmla](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/duranmla/32/109295_2.png) [@duranmla](https://meta.discourse.org/u/duranmla)
#### Post date: [12 בפברואר,‏ 2020,‏ 2:53pm UTC](https://meta.discourse.org/t/unable-to-replace-topic-list-item-raw-hbs-topic-list-item-hbr-on-mobile/141395/1 "2020-02-12T14:53:10Z")

</div>

Hello everyone,

I am doing a theme to customise several aspects from the default Discourse, with that in mind, one of the things I need to customise is the `topic-list-item` which seems to be fairly simple, I add on my theme a file under the path of `javascripts/discourse/templates/components/topic-list-item.hbs` and I can put my code there. Nevertheless, here is where the questions start to emerge.

There is a method on the component for that template called `renderTopicListItem ` which is the one that set a property `topicListItemContents ` which is the one rendered by default. Check:

[https://github.com/discourse/discourse/blob/master/app/assets/javascripts/discourse/templates/components/topic-list-item.hbs](https://github.com/discourse/discourse/blob/master/app/assets/javascripts/discourse/templates/components/topic-list-item.hbs)

> <https://github.com/discourse/discourse/blob/fc94b6cb9ee709a6744dc0da477f4a37e43d37e4/app/assets/javascripts/discourse/components/topic-list-item.js.es6#L50>

**The first question is WHY?** Why we need to do that? Why not just to have the handlebars code as usual?

In order to not interfere too much with the core code I decide to let `topic-list-item` like that and replace the `topic-list-item.raw.hbs` in my theme and that works without problem.

Nevertheless, I expect that adding a file like `javascripts/discourse/templates/mobile/list/topic-list-item.raw.hbs` in my theme will replace the mobile view but it doesn’t.

The method `findRawTemplate` still returning the default mobile template from discourse which contains:

 ![image](https://global.discourse-cdn.com/meta/original/3X/4/f/4f5e3c5641811325c9291b3d5fba42ecdd5e50c8.png)

Even by doing manual edition within my local Discourse project I am not able to get the mobile version to update with the changes.

Hopefully makes sense the explanation and someone has any knowledge about it, it looks really broken by now and maybe we want to fix it IF it is really broken _(I can do so if I understand a bit more what’s going on)_

Mean time I will continue looking for an answer myself and update any news. Below a small gif of what I have in my local.

[http://g.recordit.co/AtOJlltJ8o](http://g.recordit.co/AtOJlltJ8o.gif)

**UPDATE:** I have also update the `raw` to be `.hbr` as a recent commit changes the files but still not able to make it work.

---

<div class="post-metadata">

### Author: ![awesomerobot](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/awesomerobot/32/142900_2.png) [@awesomerobot](https://meta.discourse.org/u/awesomerobot)
#### Post date: [12 בפברואר,‏ 2020,‏ 4:00pm UTC](https://meta.discourse.org/t/unable-to-replace-topic-list-item-raw-hbs-topic-list-item-hbr-on-mobile/141395/2 "2020-02-12T16:00:05Z")

</div>

I just tested it and I’m seeing the same issue… I can’t override that template at all. Seems to have happened over the past day or two. Could this be related to switching things to `hbr` @markvanlan?

---

<div class="post-metadata">

### Author: ![duranmla](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/duranmla/32/109295_2.png) [@duranmla](https://meta.discourse.org/u/duranmla)
#### Post date: [12 בפברואר,‏ 2020,‏ 4:03pm UTC](https://meta.discourse.org/t/unable-to-replace-topic-list-item-raw-hbs-topic-list-item-hbr-on-mobile/141395/3 "2020-02-12T16:03:31Z")

</div>

When I create this topic my local discourse was from January 17 if I don’t recall wrong, with that being said, I had the issue with that version and after update with latest changes and rename from `raw.hbs` to `hbr` I still have the same issues.

By now what I have done is to customise from `javascripts/discourse/templates/components/topic-list-item.hbs` but ideally the raw templates should behave as the others templates _(in terms of substitution and customisation)_

---

<div class="post-metadata">

### Author: ![markvanlan](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/markvanlan/32/160087_2.png) [@markvanlan](https://meta.discourse.org/u/markvanlan)
#### Post date: [12 בפברואר,‏ 2020,‏ 4:06pm UTC](https://meta.discourse.org/t/unable-to-replace-topic-list-item-raw-hbs-topic-list-item-hbr-on-mobile/141395/4 "2020-02-12T16:06:49Z")

</div>

@awesomerobot if you checkout the commit right before the `hbr` change, does it work?

---

<div class="post-metadata">

### Author: ![awesomerobot](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/awesomerobot/32/142900_2.png) [@awesomerobot](https://meta.discourse.org/u/awesomerobot)
#### Post date: [12 בפברואר,‏ 2020,‏ 4:11pm UTC](https://meta.discourse.org/t/unable-to-replace-topic-list-item-raw-hbs-topic-list-item-hbr-on-mobile/141395/5 "2020-02-12T16:11:36Z")

</div>

ah yeah thanks for the date @duranmla… it is a bit of an older problem @markvanlan, tracking it down now

---

<div class="post-metadata">

### Author: ![merefield](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/merefield/32/176214_2.png) [@merefield](https://meta.discourse.org/u/merefield)
#### Post date: [12 בפברואר,‏ 2020,‏ 4:13pm UTC](https://meta.discourse.org/t/unable-to-replace-topic-list-item-raw-hbs-topic-list-item-hbr-on-mobile/141395/6 "2020-02-12T16:13:39Z")

</div>

FYI not seen this issue impact [Topic List Previews (legacy)](https://meta.discourse.org/t/topic-list-previews/101646) which does override the mobile Topic List Item raw. [https://github.com/paviliondev/discourse-topic-previews/tree/master/assets/javascripts/discourse/templates/mobile/list](https://github.com/paviliondev/discourse-topic-previews/tree/master/assets/javascripts/discourse/templates/mobile/list) Only tested this on tests-passed though.

---

<div class="post-metadata">

### Author: ![awesomerobot](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/awesomerobot/32/142900_2.png) [@awesomerobot](https://meta.discourse.org/u/awesomerobot)
#### Post date: [12 בפברואר,‏ 2020,‏ 5:18pm UTC](https://meta.discourse.org/t/unable-to-replace-topic-list-item-raw-hbs-topic-list-item-hbr-on-mobile/141395/7 "2020-02-12T17:18:56Z")

</div>

ok, so I was having a little trouble tracking it down because after reverting I had to remove then re-apply the customization to reproduce the problem.

I think it is actually the hbr commit @markvanlan ([DEV: Use .hbr for raw template file extension (#8883) · discourse/discourse@3e89774 · GitHub](https://github.com/discourse/discourse/commit/3e897749084faeb29eb9a524d3f3b3f1d46a8738)), sorry for waffling on that.

To test I added this to the current theme’s `</head>` via the customize section on the admin panel:

```hbs
<script type='text/x-handlebars' data-template-name='mobile/list/topic-list-item.raw'>
  test
</script>

```

On the commit before this works fine, once I apply that commit and then re-apply the customization the template is ignored.

---

<div class="post-metadata">

### Author: ![duranmla](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/duranmla/32/109295_2.png) [@duranmla](https://meta.discourse.org/u/duranmla)
#### Post date: [12 בפברואר,‏ 2020,‏ 5:49pm UTC](https://meta.discourse.org/t/unable-to-replace-topic-list-item-raw-hbs-topic-list-item-hbr-on-mobile/141395/8 "2020-02-12T17:49:22Z")

</div>

Maybe I was confused after all, I though it was older than that.  
I will keep in eye on this thread in any case. Thanks for quick reply into track this down @awesomerobot

---

<div class="post-metadata">

### Author: ![awesomerobot](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/awesomerobot/32/142900_2.png) [@awesomerobot](https://meta.discourse.org/u/awesomerobot)
#### Post date: [12 בפברואר,‏ 2020,‏ 7:19pm UTC](https://meta.discourse.org/t/unable-to-replace-topic-list-item-raw-hbs-topic-list-item-hbr-on-mobile/141395/9 "2020-02-12T19:19:51Z")

</div>

There’s a fix in now if you pull latest

[https://github.com/discourse/discourse/commit/c0ccfdb45e4b1350d37bbf7c56d598f7c3011abb](https://github.com/discourse/discourse/commit/c0ccfdb45e4b1350d37bbf7c56d598f7c3011abb)

Mark’s going to be doing some additional work to figure out why the tests were passing despite this being broken.

---

<div class="post-metadata">

### Author: ![duranmla](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/duranmla/32/109295_2.png) [@duranmla](https://meta.discourse.org/u/duranmla)
#### Post date: [13 בפברואר,‏ 2020,‏ 11:51am UTC](https://meta.discourse.org/t/unable-to-replace-topic-list-item-raw-hbs-topic-list-item-hbr-on-mobile/141395/10 "2020-02-13T11:51:05Z")

</div>

Nevertheless, I have updated and the error remains **when working with theme project structure** _(which probably is the most used for medium and large projects)_ I will drop this video here of me showing the error [https://www.loom.com/share/d3f437347c8f4d5aa4dd1c7ce08e1bf9](https://www.loom.com/share/d3f437347c8f4d5aa4dd1c7ce08e1bf9)

_PD: I will leave the video for a while in case it is helpful for someone to understand the problem and reproduce it. I will need to delete the video after few weeks_ 😬

**NOTE: I also tried with renaming back to topic-list-item.raw.hbs instead topic-list-item.hbr and the issue is the same.**

---

<div class="post-metadata">

### Author: ![awesomerobot](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/awesomerobot/32/142900_2.png) [@awesomerobot](https://meta.discourse.org/u/awesomerobot)
#### Post date: [13 בפברואר,‏ 2020,‏ 2:05pm UTC](https://meta.discourse.org/t/unable-to-replace-topic-list-item-raw-hbs-topic-list-item-hbr-on-mobile/141395/11 "2020-02-13T14:05:28Z")

</div>

It’s working for me with the javascripts directory (with either the old or new extension).

 ![Screen Shot 2020-02-13 at 9.01.46 AM](https://global.discourse-cdn.com/meta/original/3X/e/4/e41a781b4959c6168356ff4fbba7acbb3182b13a.png) ![Screen Shot 2020-02-13 at 9.02.03 AM](https://global.discourse-cdn.com/meta/original/3X/f/8/f85f6a5b42c4f12d64287accedf4e75ade24e880.png)

One thing I did run into last night is that you may need to edit the file and save it, or remove the file and re-add it (the templates are compiled on save, so it’s possible you’re temporarily stuck in the buggy state.).
