PanelMenu Multiple property not working after 7.0.2 Update

Radzen.Blazor Components
1

Hi

After Updating to 7.0.2 the PanelMenu i use in the NavMenu.Razor seams to not work and auto collaps even though it is set to false.

It seams to work some times but only after 10-15 Minutes witch is not ideal
all other functunality on the site works fine and fells snappy it is only this PanelMenu

plus it seams like it does it in the backend, but does not update the UI
as in if i click on one of the allready opende PanelMenuItems to close them it registers the click like it opens it once agin and then i can click it a 2. time to close it

NavMenu.razor:

<RadzenPanelMenu Multiple=false>

    <RadzenPanelMenuItem Text="Home" Path="/" Icon="home" />

    <AuthorizeView Roles="Administrator, Operators, Support-Technicians">
        <RadzenPanelMenuItem Text="Production Floor" Icon="donut_large" class="df-text-bold">
            <RadzenPanelMenuItem Text="My Station" Icon="person_pin" Path="mystation" />
            <RadzenPanelMenuItem Text="Start PCBA Order" Icon="forward" Path="startorder" />
            <RadzenPanelMenuItem Text="Unloader" Icon="outpatient" Path="unloader" />
        </RadzenPanelMenuItem>
    </AuthorizeView>

    <AuthorizeView Roles="Administrator, Production-Technicians,Operators, Support-Technicians">
        <RadzenPanelMenuItem Text="Information" Icon="info" class="df-text-bold">
            <RadzenPanelMenuItem Text="Sfc Information" Icon="device_unknown" Path="sfcinformation" />
            <RadzenPanelMenuItem Text="Lane Point Overview" Icon="automation" Path="lanepointoverview" />
            <RadzenPanelMenuItem Text="Sfc Queue" Icon="format_list_numbered" Path="sfcqueue" />
        </RadzenPanelMenuItem>
    </AuthorizeView>

    <AuthorizeView Roles="Administrator">
        <RadzenPanelMenuItem Text="Equipment" Icon="construction" class="df-text-bold">
            <RadzenPanelMenuItem Text="Robotool" Icon="precision_manufacturing" Path="robotool" />
        </RadzenPanelMenuItem>
    </AuthorizeView>

    <AuthorizeView Roles="Administrator, SuperUser">
        <RadzenPanelMenuItem Text="Support" Icon="build" class="df-text-bold">
            <RadzenPanelMenuItem Text="All Manual Workstations" Icon="transfer_within_a_station" Path="allmanualworkstations" />
            <RadzenPanelMenuItem Text="Sfc Management" Icon="manage_search" Path="sfcmanagement" />
        </RadzenPanelMenuItem>
    </AuthorizeView>

    <AuthorizeView Roles="Administrator, Production-Technicians">
        <RadzenPanelMenuItem Text="Configurations" Icon="tune" class="df-text-bold">
            <RadzenPanelMenuItem Text="Capability" Icon="format_list_bulleted" Path="capabilityconfiguration" />
            <RadzenPanelMenuItem Text="Label Print" Icon="label" Path="labelprintconfiguration" />
            <RadzenPanelMenuItem Text="Manual Tester" Icon="table_restaurant" Path="manualtesterconfiguration" />
            <RadzenPanelMenuItem Text="Manual Workstation" Icon="table_restaurant" Path="manualworkstationconfiguration" />
            <RadzenPanelMenuItem Text="Pick2Light" Icon="wb_incandescent" Path="pick2light" />
            <RadzenPanelMenuItem Text="Process Lot" Icon="input" Path="processlotconfiguration" />
            <RadzenPanelMenuItem Text="Roboception" Icon="precision_manufacturing" Path="roboceptionconfiguration" />
            <RadzenPanelMenuItem Text="Torque Tool" Icon="build_circle" Path="torquetoolconfiguration" />
            <RadzenPanelMenuItem Text="PcWorkStation Management" Icon="account_circle" Path="pcworkstationmanagement" />
            <RadzenPanelMenuItem Text="Viking Assembly Cells" Icon="precision_manufacturing" Path="vikingcellcomponents" />
        </RadzenPanelMenuItem>
    </AuthorizeView>

    <RadzenPanelMenuItem Text="Help" Icon="help" class="df-text-bold">
        <RadzenPanelMenuItem Text="Help" Icon="contact_support" Path="help" />
        <AuthorizeView Roles="Administrator">
            <RadzenPanelMenuItem Text="User Profile" Icon="account_circle" Path="profile" />
        </AuthorizeView>
    </RadzenPanelMenuItem>
</RadzenPanelMenu>

MainLayout.Razor:

<PageTitle>MCC</PageTitle>

<RadzenComponents @rendermode="InteractiveServer" />
<BlazoredToasts Position="ToastPosition.BottomLeft"
                Timeout="10"
                IconType="IconType.FontAwesome"
                ErrorIcon="fa-regular fa-xmark"
                InfoIcon="fa-light fa-square-info"
                SuccessIcon="check"
                WarningIcon="fa-regular fa-triangle-exclamation"
                MaxToastCount="3"
                ShowProgressBar="true" />

<RadzenLayout Style="grid-template-areas: 'rz-sidebar rz-header' 'rz-sidebar rz-body'">
    <RadzenHeader>
        <div class="row">
            <RadzenStack Orientation="Orientation.Horizontal" AlignItems="AlignItems.Center" Gap="0" class="col-md-8">
                <RadzenSidebarToggle Click="@(() => sidebar2Expanded = !sidebar2Expanded)" />
                <PageHeader />
            </RadzenStack>
            <RadzenStack Orientation="Orientation.Horizontal" JustifyContent="JustifyContent.End" Gap="0" class="col-md-4 rz-my-1">
                <RadzenButton Icon="settings" Click="OpenSettings" Size="ButtonSize.Large" Class="rz-border-radius-10 TrasparentBG rz-shadow-0" MouseEnter="@(args => ShowTooltip(args, new TooltipOptions(){ Position = TooltipPosition.Left}))" />
                <div class="rz-mx-2">
                    <LoginDisplay />
                </div>
            </RadzenStack>
        </div>
    </RadzenHeader>
    <RadzenSidebar @bind-Expanded="@sidebar2Expanded">
        <NavMenu />
    </RadzenSidebar>
    <RadzenBody>
        <div class="rz-p-4">
            @Body
        </div>
    </RadzenBody>
</RadzenLayout>

@code {
    public async Task OpenSettings()
    {
        var options = new SideDialogOptions { CloseDialogOnOverlayClick = true, Position = DialogPosition.Right, Width = "20%", Height = "20%", ShowMask = false };
        await DialogService.OpenSideAsync<PageSettings>("Settings", null, options);
    }

    private void ShowTooltip(ElementReference elementReference, TooltipOptions? options = null)
    {
        tooltipService.Open(elementReference, "Settings", options);
    }
}

image
image310×830 19.5 KB

2

PanelMenu Multiple is used for our demos navigation and works as expected.

3

What theme are you using? Make sure the theme CSS file is not cached. If using a premium theme you have to update it from Radzen Blazor Studio.

4

using material theme all updated and nothing is chashed

It seams like the problem is that the backend updates but it does not update the frontend

becasue when adding a Click="@RefreshUI"
and StateHasChanged

<RadzenPanelMenu <RadzenPanelMenu Multiple="false"> Multiple="false">
... menu items
</RadzenPanelMenu>



@* @code {
    private async Task RefreshUI()
    {
        await InvokeAsync(StateHasChanged);
    }
} *@

it works like i should. But this seams like a workaround as it should just work out of the box

like it did before updateing

5

Can you reproduce the problem it in our online demo (you can edit it)? This configuration should work out of the box and we are not sure why it may not work. You can also provide a minimal app reproducing the problem. Also does it work without Multiple=false?

UPDATE: I think I've reproduced something. Our online demo handles the Click event. Expanding is erratic without handling the Click event and with Multiple=false. We will investigate what is causing it. Meanwhile you can add an empty event handler for the Click event (there should be no need to call StateHasChanged).

6

Super Thanks

otherwise i have also created a Mini-project of the code where it fails too :slight_smile: