UI permissions with deep component tree


(Herby) #1

I had a similar issue. We reuse a lot of components employing the technique of injecting frames with the desired UI elements into various screens. Sometimes the nesting can be more than one level deep. I was trying to use the UI permissions with a combination of roles + groups to hide an element but couldn’t get it to work for elements in frames that are embedded in screens. The documentation says that in order to do this we select the screen and then specify the path to the element like so: [frameId].[componentId]

Unfortunately this doesn’t work for me. I’m wondering if it is because of how we are using these screens? The UI in questions is a custom sidebar menu that has some links to parts of the system.

Here is screenshot of my setup

We have built our own standalone (non-tabbed) screen infrastructure for this project and each one of these screens in the project inherits from the base StandAloneMainWindow screen (examples below)

Below is the xml for the parent StandAloneMainWindow screen that includes the sideBar

<window xmlns="http://schemas.haulmont.com/cuba/window.xsd"
        class="com.yieldmo.ymcuba.web.common.standalone.StandAloneMainWindow"
        xmlns:main="http://schemas.haulmont.com/cuba/mainwindow.xsd">
    <dialogMode height="600"
                width="800"/>
    <layout stylename="ym-standalone-container">
        <main:workArea id="workArea"
                       width="100%">
            <main:initialLayout stylename="ym-standalone-window">
                <cssLayout id="header"
                           stylename="ym-cms-top-nav">
                    <embedded id="burgerMenu"
                              src="theme://com.yieldmo.ymcuba/images/menu-icon.svg"
                              stylename="ym-top-nav-burger-menu"
                              type="IMAGE"/>
                    <embedded id="logo"
                              align="TOP_RIGHT"
                              src="theme://com.yieldmo.ymcuba/images/logo-black.png"
                              stylename="ym-top-nav-logo"
                              type="IMAGE"/>
                    <label id="currentPageTitle"
                           stylename="h3 ym-current-page"/>
                </cssLayout>
                <vbox id="mainFrame"
                       stylename="ym-standalone-content"/>
                <frame id="footer"
                       screen="footerFrame"/>
                <frame id="sideBar"
                       screen="standAloneSideBar"/>
            </main:initialLayout>
        </main:workArea>
    </layout>
</window>

Example screens extending StandAloneMainWindow

<window xmlns="http://schemas.haulmont.com/cuba/window.xsd"
        caption="msg://cmsMain.caption"
        class="com.yieldmo.ymcuba.web.creativeManagerForAdvertisers.cms.CmsMainWindow"
        extends="/com/yieldmo/ymcuba/web/common/standalone/standAloneMainWindow.xml"
        messagesPack="com.yieldmo.ymcuba.web.creativeManagerForAdvertisers.cms">
    <layout/>
</window>


<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<window xmlns="http://schemas.haulmont.com/cuba/window.xsd"
        caption="msg://standAloneEmpCreativeManager"
        class="com.yieldmo.ymcuba.web.creativeManagerForAdvertisers.cms.StandAloneEmpCreativeManager"
        extends="com/yieldmo/ymcuba/web/creativeManagerForAdvertisers/cms/cmsMainWindow.xml">
    <layout/>
</window>

Here is the xml for the StandAloneSideBar frame that has the components I wish to hide (e.g. campaignsWrapper, insightsWrapper, etc)

     <window xmlns="http://schemas.haulmont.com/cuba/window.xsd"
        class="com.yieldmo.ymcuba.web.common.standalone.StandAloneSideBar"
        messagesPack="com.yieldmo.ymcuba.web.common.standalone">
    <actions>
        <action id="closeSideMenu"
                invoke="closeSideMenu"/>
        <action id="openSideMenu"
                invoke="openSideMenu"/>
        <action id="logout"
                invoke="logout"/>
        <action id="manageCreatives"
                invoke="manageCreatives"/>
        <action id="viewInsights"
                invoke="viewInsights"/>
        <action id="openAdbuilder"
                invoke="openAdbuilder"/>
        <action id="manageAccount"
                invoke="manageAccount"/>
    </actions>
    <dialogMode height="600"
                width="800"/>
    <layout>
        <vbox id="sideMenu"
              stylename="ym-side-menubar closed"
              width="375px">
            <vbox id="sideMenuCloseWrapper"
                  stylename="ym-sidebar-close-wrapper">
                <linkButton id="sideMenuCloseButton"
                            action="closeSideMenu"
                            align="TOP_RIGHT"
                            stylename="ym-side-menu-close"/>
            </vbox>
            <scrollBox id="menuSectionWrapper"
                       stylename="ym-menu-items-panel">
                <vbox id="userDetailBox"
                      stylename="ym-sidebar-menu-bottom-lined">
                    <label id="userName"
                           stylename="ym-side-bar-user-name"
                           value="Account Name"/>
                    <label id="loginEmail"
                           value="(user@mail.com)"/>
                    <linkButton id="logout"
                                caption="Logout"
                                invoke="onLogoutClick"
                                stylename="ym-side-bar-logout"/>
                </vbox>
                <vbox id="menuOptionsBox"
                      stylename="plain-bottom-border">
                    <vbox id="menuIntroWrapper"
                          stylename="ym-menu-intro-wrapper"
                          width="AUTO">
                        <label id="menuIntro"
                               stylename="ym-menu-intro"
                               value="What do you want to do?"/>
                    </vbox>
                    <vbox id="homeWrapper"
                          stylename="ym-menu-item-wrapper"
                          width="AUTO">
                        <linkButton id="home"
                                    caption="Home"
                                    invoke="goHome"
                                    stylename="ym-side-menu-item ym-compact"/>
                    </vbox>
                    <vbox id="adBuilderWrapper"
                          stylename="ym-menu-item-wrapper"
                          width="AUTO">
                        <linkButton id="openAdbuilder"
                                    action="openAdbuilder"
                                    caption="Build an Ad"
                                    stylename="ym-side-menu-item  ym-compact"/>
                    </vbox>
                    <vbox id="creativesWrapper"
                          stylename="ym-menu-item-wrapper"
                          width="AUTO">
                        <linkButton id="manageCreatives"
                                    action="manageCreatives"
                                    caption="Manage &amp; Report on Ads"
                                    stylename="ym-side-menu-item ym-compact"/>
                    </vbox>
                    <vbox id="campaignsWrapper"
                          stylename="ym-menu-item-wrapper"
                          width="AUTO">
                        <linkButton id="manageCampaigns"
                                    caption="Manage Campaigns"
                                    invoke="manageCampaigns"
                                    stylename="ym-side-menu-item ym-compact"/>
                    </vbox>
                    <vbox id="insightsWrapper"
                          stylename="ym-menu-item-wrapper "
                          width="AUTO">
                        <linkButton id="viewInsights"
                                    action="viewInsights"
                                    caption="Get Insights"
                                    stylename="ym-side-menu-item ym-compact"/>
                    </vbox>
                    <vbox id="accountWrapper"
                          stylename="ym-menu-item-wrapper "
                          width="AUTO">
                        <linkButton id="manageAccount"
                                    action="manageAccount"
                                    caption="Manage Account Settings"
                                    stylename="ym-side-menu-item ym-compact"/>
                    </vbox>
                </vbox>
                <vbox id="menuFooter"
                      spacing="true"
                      stylename="ym-side-menu-footer">
                    <vbox id="supportBox"
                          stylename="ym-sidebar-menu-bottom-lined ym-sidebar-support">
                        <label stylename="ym-editorial-text bold"
                               value="Need Help?"/>
                        <label stylename="ym-editorial-text"
                               value="Feel free to contact us for assistance"/>
                        <link caption="support@yieldmo.com"
                              stylename="ym-link-plain ym-thin"
                              target="_blank"
                              url="mailto:support@yieldmo.com"/>
                    </vbox>
                    <vbox id="mainSiteLinks">
                        <link caption="Yieldmo"
                              stylename="ym-link-plain  ym-sidebar"/>
                        <link caption="Contacts"
                              stylename=" ym-link-plain  ym-sidebar"
                              url="Contacts"/>
                        <link caption="Privacy"
                              stylename="ym-link-plain ym-sidebar"
                              url="Privacy"/>
                    </vbox>
                </vbox>
            </scrollBox>
        </vbox>
        <cssLayout id="sideMenuOverlay"
                   stylename="ym-menu-overlay hidden"/>
    </layout>
</window>

Any help would be appreciated. Ideally I’d like to do this via configuration versus coding it would make the system more flexible and require less developer intervention.


Hiding UI element for all roles except ones which I allow
(Yuriy Artamonov) #2

Hi,

Could you please build a small demo project that illustrates your issue and tell us how to reproduce it?

Also, please keep in mind that UI permissions are not meant to be used in design time. It is more like deployment option when you cannot change code of the system. In case you need to design your security system I recommend that you introduce permissions with permission config:

In this case you will be able to check your permissions in services and screens as follows:

@Inject
private Security security;

private void calculateBalance() {
    if (!security.isSpecificPermitted("myapp.calculateBalance"))
        return;
    ...
}

It is a reliable way to introduce named permissions in your system.