second-factor.gjsコンポーネントおよびsecond-factor-add-totp.gjsコンポーネントのPluginOutletが見つかりません

開発
1

Hi
I recently started to work with Discourse and from my 1 week experience I can definitely can say that the entry level is quite high for developer who actually needs to modify Core things, this is due to lack of real documentation/information, especially if we are talking about fresh latest options, as I can only find something that is not working anymore for version 3.6.0 rather then the new approach and even if I found some, the level of details in those is low, no real life example or more detailed explanations of how to use things.
Nevertheless, I need to modify the second-factor-add-totp.gjs component and I just couldn’t do it as there no information on how this can be done properly in my custom theme.
I found that there something called PluginOutlet that is designed to work as an hook which you can use to inject you custom code or even modify the output if the element wrapped in PluginOutlet (not sure, there something like api.renderInOutlet, but I didn’t found any normal information on how to use it). Looking at those Ember components, I don’t see there PluginOutlet that possibly could’ve help to do at least some manipulations with the structure using at least pure JS.

Can you clarify if its something that can be added there and if I could use it in order to modify the modal window structure or at least use pure JS to move some elements in places.
Also maybe I couldn’t find, but is there an documentation with examples for new approaches?

「いいね！」 1
2

Can you share more details about what is your end goal so we can provide better advice ?

3

Of course.
So according to the “modified“ version that I have, I need to update the design a bit for the MFA Modal (when the User should setup an authenticator app for MFA).
By update I mean for example moving the QR Code in the HTML structure, to be more specific “js.user.second_factor.enable_description“ site text, the QR Code should be somewhere between the provided new text (HTML markup).
Another example is make sure the that “Enter manually“ instead shows the actual code that can be copied while clicked on it (manually through JS trigger the click so it appear and just move it).

All this can be achieved using regular JS manipulations, without an actual structure rebuild of the original component, but the main challenge for me is to figure out an place where this JS can be placed so it will be fired while the modal is opened, which I couldn’t figure out yet.

Additional clarification: I’m using an custom theme that is stored using GIT option.

Let me know if something is unclear.