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?
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.
Hi @Yan_Rudenko, the best docs to start with are probably this tutorial:
As you mentioned, Plugin Outlets are the best way to customize the UI. But these are not available everywhere. Only certain parts of the UI are designed to be customized.
Manipulating the DOM using regular JS will cause errors, because our rendering framework will lose control of the elements it rendered to the screen. It’s best to stick to the supported plugin outlets and other Discourse JS APIs (also covered in the tutorial).
Hi @david , thank you for the tutorial link, but I already checked this and didn’t found any answers I’ve been searching for, the examples themself are basic and don’t cover for example on how to get specific category (instead of doing ajax call) or how to use the Discourse API in the code all (mentioned https://docs.discourse.org/), which is present from what I know and see, that’s why I wrote here in order to get more details from the people who works with Discourse on everyday bases and knows many things that are not preset in the documentation.
I fully understand that using pure JS can cause issues, but its the only thing that I came up with for now, maybe in future I would be able to modify some in more appropriate way if there will be such.
So if I understand this correctly, in current version of Discourse that I’m using, which is 3.6.0.beta2-latest, the changes I mentioned won’t be able to be done with Discourse builtin tools? Due to missing PluginOutlets in those components?
Does the DEV team consider adding those to mentioned components in future releases, as I assume there is no technical issues with that, but an matter of decision from some people who are working on this?
@david , thanks you for the proposition, I will consider it while having an actual time to do it, but you need to understand that for an person who is just got into Discourse, this might take some time, as I need to sort out on how to prepare one with the right changes + as you mentioned the approval stage + time before it get into the next release itself.
I hoped that DEV team, who is much more qualified can prepare in 1 hour if its only adding PluginOutlet wrapper and an few within the components if different places (I might be wrong), which will reduce the time it will take to deliver this into the new release.
Nevertheless, as I mentioned above I will consider your proposition.
Still, I haven’t recieved an answer regarding my question, if it possible to do the things I mentioned within the current version of Discourse or the changes I mentioned needs to be added/contributed firstly (adding the PluginOutlet in those components)?
The reason why I’m asking this, is because I have an scope of work that is required to be done, but I cannot do it and I need to provide an explanation why I cannot do it to the team, so either the scope of work will be changed to do things we can or I will have to contribute into this with an hope that it will be added to the core and released in the upcoming release. So I need an confirmation from the Discourse DEV Team whether this is possible to be done or not.
Broken things go in Bug, missing features in Feature (or in case of e.g. plugin outlets Dev)
Do you use the stable branch? Then there is quite some time until the next stable release, but otherwise you don’t need to wait for commits being added to the latest branch after the PR is merged.
I use Docker setup for Discourse and you raised a good suggestion regarding the branch, yes, I might be able to change it while the PR is merged and not wait till the actual release.
Looking into the app.yml I can see that it use tests-passed version (branch), which looking at GIT I assume not the best one to use for stability. Which one is preferred to use main or switch on latest tag? Is it possible to switch on tag at all for docker setup?