v2 replace perfect scrollbar with ngx-scrollbar

[Bykiev]

Hi, I know v2 in not supported, but with angular 16 we can't use viewEngine libraries. That's why we need to replace it with ngx-scrollbar. I've only one issue: when the menu is collapsed, it's not possible to expand child menu items. I've tried to fix it with no luck. Can you please help to make it working?

<app-sidebar #appSidebar [fixed]="true" [display]="'lg'" [minimized]="sidebarMinimized" (minimizedChange)="toggleMinimize($event)">
    <ng-scrollbar>
        <app-sidebar-nav [navItems]="menuItems$ | async"></app-sidebar-nav>
    </ng-scrollbar>
    <app-sidebar-minimizer></app-sidebar-minimizer>
</app-sidebar>

[xidedix]

@Bykiev with Angular 16, make sure you've got installed:

• "ngx-scrollbar": "^13.0.3", (not v14)
• "@coreui/angular": "~2.16.0",

For sidebar minimized, you'll have to disable the scrollbar. Try sth like:

<app-sidebar #appSidebar [fixed]="true" [display]="'lg'" [minimized]="sidebarMinimized (minimizedChange)="toggleMinimize($event)">
  <ng-scrollbar [disabled]="appSidebar.minimized">
    <app-sidebar-nav [navItems]="menuItems$ | async" />
  </ng-scrollbar>
  <app-sidebar-minimizer />
</app-sidebar>

[Bykiev]

Thank you, unfortunately it doesn't working as expected. With the disabled ng-scrollbar the native scrollbar appears, but still it's not possible to expand children items. With perfect scrollbar it was achieved by setting suppressScrollX: true

[xidedix]

@Bykiev you're right. In this case, for minimised sidebar, we'll have to remove ng-scrollbar completely. What about:

<app-sidebar #appSidebar [fixed]="true" [display]="'lg'" [minimized]="sidebarMinimized (minimizedChange)="toggleMinimize($event)">
  <ng-scrollbar [disabled]="appSidebar.minimized" *ngIf="!appSidebar.minimized; else sidebarNav">
    <ng-container *ngTemplateOutlet="sidebarNav" />
  </ng-scrollbar>
  <ng-template #sidebarNav>
    <app-sidebar-nav [navItems]="navItems" />
  </ng-template>
  <app-sidebar-minimizer />
</app-sidebar>

[Bykiev]

Thank you, looks much better, but after minimization the scrollbar is not working. I'd like to make it working even the sidebar is minimized

[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]]

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