Your integrated help experience is nice. But I’m not able to both use the help docs + use the page. This would be fine if it persisted which article I was looking at when I closed and reopened or if it has something like an “articles you recently viewed” section. Or would be good if I could explicitly “minimize” vs. “close” the sidebar.
I think the easiest would be to retain the current state when you close and open the drawer again from the Nav Bar icon.
I think the easiest would be to retain the current state when you close and open the drawer again from the Nav Bar icon.
Thus a technical guide:
Navbar icon would open “Help homepage” only if it’s the first time help drawer was opened. This would reset on page reload since the iframe url cannot be retrieved and saved (CORS restriction).
In any other scenarios where navbar icon is clicked, it opens the previous state of the drawer (iframe url unaltered).
When a non-navbar icon is clicked, it should trample the previous state (sets new iframe url).
A technical difficulty is that currently each HelpTrigger has a Drawer associated with it, mounted when trigger clicked and destroyed when closed.
But in order to save the iframe state, it must remain intact after drawer close and also available to all triggers. Most sensible way to do that is to render only one Drawer in the top component (<app-view>) and allow any HelpTrigger to interact with it.
But I’m not sure how to create such an api between independent React components where one component changes props of another, without ludicrous nesting. @levko@gabrieldutra Help me out here.
I think could be a service (instead of component), with a single method - showHelp(url = null). That service will render drawer (using ReactDOM directly - similar to dialog helper). showHelp() will load provided URL, or open drawer with last URL if parameter omitted.
I ran a few tests here and my suggestion to it is to remove the destroyOnClose property from the Drawer and just load the URL once (leaving the trigger behavior just to change the visible state). Whenever you open the HelpTrigger you will be the exactly place where you were before.
This was the easiest I could think, the resulting behavior would be: each HelpTrigger will be independent and remain the previous iframe state, this would be reset when page is changed/reloaded.
LMK if I missed sth, this was the result from my tests:
The issue I see with it is that the iframe must always exist in the DOM (so it needs to be mounted in the top component anyway).
If it is really important that HelpTriggers are not that independent (e.g: the navbar help trigger holds the last opened trigger and not only its previous state), perhaps it’s time to introduce global state to do so.
IMO it’s enough that all HelpTriggers hold only their previous state as I mentioned above.
IMO it’s enough that all HelpTriggers hold only their previous state as I mentioned above.
@gabrieldutra I tried that before and it’s confusing. For instance, you click on the dashboard trigger, navigate in it, close, then open the navbar trigger and you’re back to home. It’s not consistent.
I think global state is the only viable solution here.
where one component changes props of another, without ludicrous nesting.
