Some PRO module management pages don't show the correct breadcrumb in Blazor (MudBlazor) #10907

2 Answer(s)

• 

  0

  AI-Bot created 13 hours ago

  Support Team ABP Agent

  • In ABP Blazor (MudBlazor), breadcrumbs are not automatically derived from the menu hierarchy. They are rendered from PageLayout.BreadcrumbItems / <PageHeader BreadcrumbItems=... />.
    So if a PRO module page only sets the current page title (or sets breadcrumbs late / inconsistently), you will see only Languages (or even nothing), instead of Administration > ....

  • Fix/workaround (applies to all the pages you listed: Language Management, AI Management, Text Templates, Audit Logs):

    1. Set breadcrumbs explicitly in those pages (or in a shared base component they inherit from), using PageLayout.BreadcrumbItems.
    2. If you observe that breadcrumbs appear only after a refresh / navigation, then set them in OnAfterRenderAsync(firstRender), not only in OnInitialized*. This is a known pattern in ABP Blazor to avoid the “missing title/breadcrumb until refresh” behavior.

  Example (MudBlazor)

  Add/override in the relevant .razor.cs (or @code block):

  using MudBlazor;
  using Volo.Abp.AspNetCore.Components.Web.Theming.PageToolbars; // if needed for PageLayout injection
  using Volo.Abp.AspNetCore.Components.Web.Theming.Layout;
  
  public partial class Languages // example page/component
  {
      [Inject] private PageLayout PageLayout { get; set; } = default!;
  
      protected override async Task OnAfterRenderAsync(bool firstRender)
      {
          await base.OnAfterRenderAsync(firstRender);
  
          if (!firstRender)
          {
              return;
          }
  
          PageLayout.BreadcrumbItems.Clear();
  
          PageLayout.BreadcrumbItems.Add(new BreadcrumbItem("Administration", "/administration"));
          PageLayout.BreadcrumbItems.Add(new BreadcrumbItem("Language Management", null, disabled: true));
          PageLayout.BreadcrumbItems.Add(new BreadcrumbItem("Languages", null, disabled: true));
  
          await InvokeAsync(StateHasChanged);
      }
  }
  

  Notes:

  • Use real URLs for clickable nodes if you want (e.g., link “Language Management” to its main route if you have one).
  • If you’re using <PageHeader ... /> directly in the page, you can also pass a local List<BreadcrumbItem> via BreadcrumbItems=... instead of PageLayout.

  For “Chat Playground - WorkspaceName” and “Data Sources”

  • These screens typically need dynamic breadcrumbs (workspace name, etc.). The same mechanism applies:
    • Clear existing items
    • Add Administration > AI Management > Workspaces > {WorkspaceName} > Playground
    • For “Data Sources”, if there is no breadcrumb at all, it’s simply not being set (or it’s being set too early). Setting it in OnAfterRenderAsync(firstRender) resolves the “not rendered” scenario.

  ---

  Sources

  • https://abp.io/docs/10.7/framework/ui/blazor/page-header?BlazorUI=MudBlazor
  • https://abp.io/docs/10.7/framework/ui/blazor/page-layout?BlazorUI=MudBlazor
  • https://abp.io/support/questions/6631
  • https://abp.io/docs/10.7/framework/ui/blazor/navigation-menu

  ---

  This response was generated by AI. If it didn’t solve your problem, feel free to post a new answer — our support team will jump in to help you soon.

  Markdown supported.

  Copy, paste, or drag & drop images and files (max 100 MB per file, 100 MB total per post)

  Save Cancel
• 

  0

  filipe.carneiro created 13 hours ago

  Could a member of the support team please review this ticket?

  Can we expect this to be fixed in an upcoming release, or should we try the suggested workaround in the meantime?

  Markdown supported.

  Copy, paste, or drag & drop images and files (max 100 MB per file, 100 MB total per post)

  Save Cancel