How to dynamically control what menu items are shown

user_7175794 0
Viewed 30

In my Skyve application, I have a situation where - whether users see an application menu item in the responsive mode needs to be determined dynamically - based on some combination of preference settings etc - rather than merely what module role they have been assigned.

How can I dynamically add or remove items from the menu they access and where do I locate this code?

skyve
1 Answers

(NOTE: The usual Skyve no-code approach relies on access to menu items being controlled by the roles declared in the module, and so overriding the menu class is not usually required - this is definitely an advanced activity.)

The responsive mode in Skyve (which is using PrimeFaces) uses a the "Menu" session scoped faces view bean to generate what is seen by users, and this is referenced from the various template.xhtml page templates. You can extend this class to control what elements of the menu are see by users.

Your project includes the template.xhtml pages for whichever theme you have chosen to use in your project - for example if you are using the editorial (free) theme, then the corresponding template will be at: src/main/webapp/WEB-INF/pages/editorial/template.xhtml

You'll find the reference to the Menu bean around line 155 (depending on your particular Skyve version) and it will be similar for other themes.

<p:panelMenu id="leftMenu" model="#{menu.menu}" />

Extend org.skyve.impl.web.faces.beans.Menu to customise the behaviour of the menu. Probably the simplest approach is to define all potential menus in the usual way - by declaring these in the "module.xml" file - and then adding or removing the items that are not applicable in your Menu class override.

For example, if your module has the following menu items declared:

    <menu>
        <edit document="MyDetail" name="My Details">
            <role name="StaffUser"/>
        </edit>
        <edit document="OrganisationDashboard" name="Organisation Dashboard">
            <role name="Manager"/>
            <role name="Administrator"/>
        </edit>
        <list query="qAllStaff" name="All Staff">
            <role name="Manager"/>
            <role name="Administrator"/>
        </list>
...

To conditionally hide the "Organisation Dashboard" menu item - then you can create your own Menu override class as follows:

package com.myOrg.faces;

import java.util.Iterator;
import java.util.List;

import javax.faces.bean.ManagedBean;

import org.primefaces.model.menu.DefaultMenuItem;
import org.primefaces.model.menu.DefaultMenuModel;
import org.primefaces.model.menu.DefaultSubMenu;
import org.primefaces.model.menu.MenuElement;
import org.primefaces.model.menu.MenuModel;
import org.skyve.impl.web.faces.beans.Menu;

@ManagedBean(name = "myCustomMenu")
public class MyCustomMenu extends Menu {
    @Override
    public MenuModel getMenu() {
        DefaultMenuModel result = (DefaultMenuModel) super.getMenu(); // do the usual steps Skyve will do according to the no-code module declaration
        List<MenuElement> subMenus = result.getElements();
        if (! subMenus.isEmpty()) {
            DefaultSubMenu mainMenu = (DefaultSubMenu) subMenus.get(0);
            mainMenu.getElements().removeIf(e -> {
                return ((e instanceof MenuItem) &&
                            "Organisation Dashboard".equals((MenuItem) e).getValue());
            });
        }
        return result;
    }
}

Then you can provide this bean name in the template.xhtml as follows:

<p:panelMenu id="leftMenu" model="#{myCustomMenu.menu}" />
user_71758580
Related