Adding a mixin to a class in a plugin?

Development

AI-generated summary

The discussion revolves around adding a mixin to a class in a Discourse plugin. shoshber is trying to modify the create-account controller by adding a mixin called FooValidation but is unsure of the best approach. Osama suggests using PluginApi.modifyClass with the mixin as an argument, which shoshber confirms works. For a sample code reference, merefield shares an example from the Topic List Previews plugin where they use modifyClass to add a mixin to a component, demonstrating how to break out shared code and avoid repetition.

1

I need to modify a javascript controller (create-account). If I were writing it from scratch, I’d add a mixin called something like (FooValidation), the same way the mixins PasswordValidation and UsernameValidation are applied (discourse/app/assets/javascripts/discourse/controllers/create-account.js.es6 at f03b6bd8c925163b41b9e33b39484d102dbaee44 · discourse/discourse · GitHub). I can’t figure out how, though.

I could just add the relevant properties/methods to the create account controller using PluginApi.modifyClass, but that doesn’t feel right, especially seeing as I’ll want to reuse the mixin.

What’s the best way to achieve this?

2

I believe the modifyClass method accepts a mixin as an argument, so I’d try something like this:

api.modifyClass("controller:create-account", FooValidation);
3

Ah you’re right, modifyClass calls Ember’s reopen, which can take mixins as an argument. I couldn’t get it to work at first but I got it! Thanks!

4

can you share some sample code?

5

I do it in Topic List Previews: https://github.com/paviliondev/discourse-topic-previews/blob/master/assets/javascripts/discourse/initializers/preview-edits.js.es6

Specific example: api.modifyClass('component:topic-list', Settings);

I did this to break out shared code that would otherwise have been repeated and almost a cut and paste.