luigi icon indicating copy to clipboard operation
luigi copied to clipboard

No navigation nodes rendered, if children are empty of one node

Open felix9607 opened this issue 9 months ago • 0 comments

Description If the children of a navigation node are empty, no further nodes are rendered. Reason behind this is, that a user might visit the page but has no access to any of these nodes, therefore they are not delivered by the backend. But there should be a button in the top navigation that brings him back to an overall preselection so he can select an other customer where he might have permissions.

Expected result Other nodes to be rendered anyways

Actual result Not rendered

Steps to reproduce

Use this config e.g. in the playground. The "Some Action" is not displayed.

Luigi.setConfig({
    navigation: { 
            validWebcomponentUrls:['.*?'],
            nodes: [{ 
                pathSegment: 'home', 
                label: 'h', 
                hideFromNav: true, 
                children: [] 
            },{ 
                pathSegment: 'foo', 
                label: 'Some Action',
                icon: 'favorite-list',
                viewUrl: '/examples/microfrontends/multipurpose.html',
                hideSideNav: true,
                context: {
                    title: 'Left navigation hidden',
                    content: 'for pages needing more space or wanting to handle navigation internally'  
                }
            },{ 
                pathSegment: 'help', 
                label: 'Help',
                icon: 'sys-help',
                viewUrl: '/examples/microfrontends/multipurpose.html',
                context: {
                    title: 'Help Section',
                    content: 'Find some useful links on the left'  
                },
                children: [{
                    label: 'Back',
                    link: '/',
                    icon: 'nav-back'
                },{
                    label: 'Luigi Github Page',
                    externalLink : { 
                        url: 'https://github.com/SAP/luigi'
                    }
                },{
                    label: 'Fundamental Library',
                    externalLink : { 
                        url: 'https://sap.github.io/fundamental-styles'
                    }
                },{
                    label: 'Fundamental Icons',
                    externalLink : { 
                        url: 'https://sap.github.io/fundamental-styles/components/icon.html'
                    }
                }]
            }],
            productSwitcher: {
                items: [{
                    icon: 'https://raw.githubusercontent.com/SAP/luigi/main/website/landingpage/public/assets/img/logos/sap.svg',
                    label: 'SAP homepage',
                    externalLink: {
                      url: 'https://www.sap.com',
                      sameWindow: false
                    }
                },{
                    icon: 'https://svelte.technology/favicon.ico',
                    label: 'Svelte',
                    externalLink: {
                      url: 'https://svelte.technology',
                      sameWindow: false
                    }
                }]
            } 
        }, 
        
        // uncomment if you want to use our mock oidc idp
        /**
        auth: {
            // We have registered the following provider at the window object:
            // OAuth2 Implicit Grant: window.LuigiAuthOAuth2 - Docs: https://docs.luigi-project.io/docs/authorization-configuration?section=oauth2-implicit-grant-configuration
            // OIDC Implicit Grant: window.LuigiAuthOIDC - Docs: https://docs.luigi-project.io/docs/authorization-configuration/?section=openid-connect-configuration
 
            use: 'myOAuth2',
            myOAuth2: {
                idpProvider: window.LuigiAuthOAuth2,
                authorizeUrl: '/auth/idpmock/implicit.html',
                logoutUrl: '/auth/idpmock/logout.html',
                post_logout_redirect_uri: '/auth/logout.html',
                authorizeMethod: 'GET',
                oAuthData: {
                  client_id: 'egDuozijY5SVr0NSIowUP1dT6RVqHnlp',
                  redirect_uri: '/auth/callback.html'
                }
            }
        },
        */
        routing: { 
            useHashRouting: true 
        }, 
        lifecycleHooks: {
            luigiAfterInit: () => {
                console.log('Luigi initialized.');
            }
        },
        settings: { 
            responsiveNavigation: 'semiCollapsible',
            header: { 
                logo: 'img/luigi.svg', 
                title: 'Luigi Fiddle'
            },
            burgerTooltip: {
                navExpanded: 'Collapse navigation',
                navCollapsed: 'Expand navigation'
            }
        }
    });    

Troubleshooting

None

felix9607 avatar May 14 '24 07:05 felix9607