Showing the admin menu navigation as tree menu
Created 4 years ago by radic

So one of the biggest annoyances with PyroCMS 3 for us was the navigation. For example, wanting to manage user roles, you'd go trough:

  • Click on Users
  • [page reload]
  • Click on Roles
  • [page reload]

Sure.. that's no biggie. But it becomes quite annoying if you have stuff to do in multiple sections of multiple modules. Also the slide-in/slide out makes it that much more mouse-click's you have to do before getting somewhere. It was something for us that HAD to be improved.

The result

So currently the navigation is build by BuildControlPanel.

        $this->dispatch(new BuildNavigation($this->builder));
        $this->dispatch(new SetActiveNavigationLink($this->builder));
        $this->dispatch(new SetMainNavigationLinks($this->builder));

        $this->dispatch(new BuildSections($this->builder));
        $this->dispatch(new SetActiveSection($this->builder));

Using that, i created the command BuildFullControlPanelNavigation

But running that actually almost doubled the application loading time! Not really knowing how to improve the command, i went ahead and implemented some sort of caching. This can be viewed in the ControlPanelServiceProvider

All in all, this was quite painful to achieve and this implementation is most likely far from ideal.

  • What is the cause of the doubled application loading time? What can be done to improve the loading time?
  • Is there a better way to build the admin menu completely? Currently the code needs to do some awkward things (module and link activation/deactivation to get the sections for example)
  • I would like to remove the whole caching stuff. I merely have it as temporary workaround.
william  —  4 years ago

I agree this is one problem i also have with Pyro. The mass amount of clicks necessary to navigate. Your suggested solution to have sublinks easier accessed is what i think we need.

On another note, the slide in and slide out of the navigation i fixed with my own theme if interesting:

ryanthompson  —  4 years ago

Very good! I dig it 😊

The idea with nav was indeed to keep things very simple but allow faster navigation for more adept users. So there are, for example, hot keys:

Ctrl + Space # Jumps to search - Enter to select as you type
Cmd + Enter # When searching as above opens in new window

I want to add the sections to search but some addons have a dependency on a URI segment for example I need would need to investigate. Any run-ins with that? Navigation module is a good example (jumping to links section). I suppose since the markup is all there it might still be able to just toggle modal.. Never thought of that before..

The builders in general are a little heavy for something like this I think. Basically you are building the entire control panel for each addon all the time. We'll need a simpler way of pulling the sections out to make this happen OR.. some kinda registry can be used (something I have been working on here and there) to allow the addon to register it's navigation as it's service provider is passed over. That way we don't have to build the entire UI for it to get this. This method will also make it much easier for addons like the Streams module to register top level navigation for it's namespaces for example. Which is gonna be pretty rad.

Anyways.. this is definitely something where I am aware of the pain some of you guys have expressed. Just not put a ton of time into it. I personally have not felt it too painful as is truth be told, but I have also not tasted the sweetness of having it all in my sidebar either!

ryanthompson  —  4 years ago

I have a 3.5 PyroCMS release I am getting ready for and will make it a point to figure this out shortly thereafter. It'll be BC so I won't need a minor bump for it in the main package.

radic  —  4 years ago

The idea of a registry seems appealing to me. If i understand you correctly, with such an implementation i could (for example) just get the registry from the container / some other place during the boot of my own service provider which is already filled with the complete admin navigation tree?

Also being able to add/modify such registry before it get used in the actual view would allow an extremely easy way to customize navigation, which i assume you meant with saying "to register top level navigation for it's namespaces"?

Something like that would simply be awesome.

ryanthompson  —  4 years ago

Thats exactly right! Much like some of the other UI component registries:

This would be the same gist basically a singleton collection of items for use in the view (probably {{ template.navigation }}) or something. But the system would default things and then you can take control wherever during the boot process and push items in / remove them / rename them / whatever you want! As well as add complimentary information (maybe you want an alert symbol next to one denoting attention needed).

Won't take much I'll make sure it happens sooner than later!

radic  —  4 years ago

That's just awesome Ryan, thanks!

radic  —  4 years ago

It would be cool to do something with the hotkeys then as well. For example, i think it might be usefull if you could do

- [Ctrl + Space]
- [Typ in: set] (that will select settings)
- [Typ in: .]
- [Shows section names] 
- [Typ in: e] (that will select extensions)
- [Press enter] Load settings -> extensions page
ryanthompson  —  4 years ago

Ya hotkeys was always kind of an experiment that just stuck - I really like them. So definitely wanna add them to the search up top (which will also go into searching EVERYTHING when I finish the search module - so you can jump to a page/edit or whatever) which would mirror the sidebar.