HOWTO: override raw templates programatically via plugins/theme-components?

Let’s take topic-list-item template as an example.

The template for it is a raw template. Raw templates require explicit code to render them.

https://github.com/discourse/discourse/blob/c84652eb8b2bb9dd616056621ee7c7b91fcf64a2/app/assets/javascripts/discourse/components/topic-list-item.js.es6#L46

If you look at the above snippet, a path(relative to templates/) is being passed here.

Add your custom template to the templates/ folder in your theme/plugin and preferably name it something different to the actual template.

Just override that computed property and replace the actual template name with your new template name and you’re good to go.

You can also override the template conditionally, or switch between them conditionally according to the requirement.

Great discovery @fzngagan! Very useful to have inline control instead of ‘carpet bombing’ with a file.

There’s a catch here. If you have a raw partial displayed with {{raw ...}} in a regular component/controller template, then it can’t be overriden conditionally. I think discourse needs to build an api for that.