xng-breadcrumb icon indicating copy to clipboard operation
xng-breadcrumb copied to clipboard

Breadcrumb temporarily disappears during resolver data loading

Open l-Legacy-l opened this issue 10 months ago • 1 comments

🐞 Bug report

Description

When using the breadcrumb component in conjunction with resolver data loading, there is a noticeable flicker or disappearance of part of the breadcrumb during navigation back or when clicking on the breadcrumb link to a component loaded with a resolver.

Breadcrumb become a single label considering I'm having a two-level navigation, like just Component 1 to Component 2 navigation.

🔬 Minimal Reproduction

  1. Navigate to a component with breadcrumb integrated.
  2. Use the breadcrumb to navigate to a the previous component or navigate back (Component should be loaded with data from resolver).

💻Your Environment

Angular Version: 17.1.0

breadcrumb:

<div class="container-breadcrumb">
    <xng-breadcrumb class="link-breadcrumb" separator=">">
      <ng-container *xngBreadcrumbItem="let breadcrumb">
        <ng-container>{{ breadcrumb | translate }}</ng-container>
      </ng-container>
    </xng-breadcrumb>
  </div>

Resolver:


export const getThemesResolver: ResolveFn = (): Observable => {
  const themeService = getThemeService();
  const errorService = getErrorService();
  return themeService.getThemes().pipe(
    tap(themes => {
      // Breadcrumb started to become a single label
    }),
    catchError(error => {
      errorService.handleResolverError(error);
      return of(null);
    })
  );
};

Breadcrumb load:


private buildBreadCrumb(): void {
  this.breadcrumbService.set(this.contextService.getContextForUrl() + '/:procedureId', this.decodeProcedure());
}
private decodeProcedure(): string {
  return this.theme?.getLabel(this.languageService.currentLanguageUpperCase);
}

Thank you for your attention to this matter. Please let me know if you require any further information or assistance in addressing this issue.

l-Legacy-l avatar Mar 29 '24 12:03 l-Legacy-l

Hello 👋 @l-Legacy-l
Thank you for raising an issue. We will investigate into the issue and get back to you as soon as possible. Please make sure you have given us as much context as possible.
Feel free to raise a PR if you can fix the issue. Check the local development guide

github-actions[bot] avatar Mar 29 '24 12:03 github-actions[bot]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

github-actions[bot] avatar May 29 '24 05:05 github-actions[bot]

I have the same problem

Angular Version: 17.3.12 xng-breadcrumb: 11.0.0

JhonatanMedeiros avatar Sep 02 '24 16:09 JhonatanMedeiros