Hello,
We implement the mobile version for our portal and could not find the way how to customise the eThemeLeptonXComponents.NavbarMobile rather than replacing it completely with a customs one. So we have this navbar Is there a way to:
Thank you!
We have a route.provider
@Injectable({
providedIn: 'root',
})
export class RouteManagerService implements OnDestroy {
private destroyed$ = new Subject<void>();
constructor(
private routes: RoutesService,
private cubeSelectedService: CubeSelectedService,
) {}
configureRoutes() {
const initialRoutes: ABP.Route[] = [
{
path: '/overview',
iconClass: 'fa-solid fa-grid-2',
name: '::Menu:CustomerDashboard:Overview',
group: 'Dashboard',
layout: eLayoutType.application,
requiredPolicy: 'Portal.CustomerDashboard',
order: 0,
invisible: true,
},
];
this.routes.add(initialRoutes);
this.cubeSelectedService
.getObservable()
.pipe(
takeUntil(this.destroyed$),
map((cubeSelected) => {
this.updateRouteVisibility(
'::Menu:CustomerDashboard:Overview',
cubeSelected === null,
);
}),
)
.subscribe();
}
updateRouteVisibility(name: string, invisible: boolean) {
const route = this.routes.find((route) => route.name === name);
if (route) {
this.routes.patch(name, {
iconClass: invisible ? 'fas fa-home' : 'fas fa-heart',
invisible,
} as Partial<ABP.Route>);
}
}
ngOnDestroy() {
this.destroyed$.next();
this.destroyed$.complete();
}
}
export const ROUTE_PROVIDER = [
{
provide: APP_INITIALIZER,
useFactory: configureRoutes,
deps: [RouteManagerService],
multi: true,
},
];
function configureRoutes(routeManager: RouteManagerService) {
return () => routeManager.configureRoutes();
}
We need to hide and show a menu item "::Menu:CustomerDashboard:Overview" in the observable depending on the value coming. Setting invisible attribute in a patch from true->false works, from false-> true doesn't. Though the iconClass works in both ways.
Could you please help us to solve it? If this is an ABP issue or do we do something wrong? Thank you.