Is this the correct way to create a theme component?

Although this way of doing things is technically possible, it’s not the ideal approach.

Instead of using script tags and jQuery $(document).ready it would be better to work with Ember’s rendering system correctly.

To start, it would be good to create a theme component repository with a proper folder structure for your theme-component. Have a look at the discourse_theme CLI as this will scaffold out that structure for you, and make it easy for you to develop the component. (Alternatively, there’s also the theme skeleton if you only need the structure and not any of the other goodies of the theme CLI).

From here, I would use tools Discourse has in place for extensibility such as apiInitializers, the pluginAPI, plugin outlets, etc. to achieve what you’re trying to do.

The best way to learn about these things is to peruse the Developer Guides here on Meta (specifically the theme/theme-component) sections. Additionally, I would go through the Theme component category and find their GitHub repositories. Looking through their code and how they achieve things will help you as well.

I hope this helps!

5 Likes