89984: Add themable menu section

src/app/admin/admin-sidebar/admin-sidebar.component.ts

@@ -22,6 +22,7 @@ import { CSSVariableService } from '../../shared/sass-helper/sass-helper.service
 import { AuthorizationDataService } from '../../core/data/feature-authorization/authorization-data.service';
 import { FeatureID } from '../../core/data/feature-authorization/feature-id';
 import { Router, ActivatedRoute } from '@angular/router';
+import { ThemeService } from '../../shared/theme-support/theme.service';
 
 /**
  * Component representing the admin sidebar
@@ -70,9 +71,10 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit {
     private modalService: NgbModal,
     public authorizationService: AuthorizationDataService,
     private scriptDataService: ScriptDataService,
-    public route: ActivatedRoute
+    public route: ActivatedRoute,
+    protected themeService: ThemeService
   ) {
-    super(menuService, injector, authorizationService, route);
+    super(menuService, injector, authorizationService, route, themeService);
     this.inFocus$ = new BehaviorSubject(false);
   }
 

src/app/navbar/navbar.component.ts

@@ -13,6 +13,7 @@ import { BrowseDefinition } from '../core/shared/browse-definition.model';
 import { RemoteData } from '../core/data/remote-data';
 import { ActivatedRoute } from '@angular/router';
 import { AuthorizationDataService } from '../core/data/feature-authorization/authorization-data.service';
+import { ThemeService } from '../shared/theme-support/theme.service';
 
 /**
  * Component representing the public navbar
@@ -35,9 +36,10 @@ export class NavbarComponent extends MenuComponent {
               public windowService: HostWindowService,
               public browseService: BrowseService,
               public authorizationService: AuthorizationDataService,
-              public route: ActivatedRoute
+              public route: ActivatedRoute,
+              protected themeService: ThemeService
   ) {
-    super(menuService, injector, authorizationService, route);
+    super(menuService, injector, authorizationService, route, themeService);
   }
 
   ngOnInit(): void {

src/app/shared/menu/menu-section.decorator.ts

@@ -1,4 +1,6 @@
+import { DEFAULT_THEME } from '../object-collection/shared/listable-object/listable-object.decorator';
 import { MenuID } from './initial-menus-state';
+import { hasNoValue } from '../empty.util';
 
 const menuComponentMap = new Map();
 
@@ -8,7 +10,7 @@ const menuComponentMap = new Map();
  * @param {boolean} expandable True when the section should be expandable, false when if should not
  * @returns {(menuSectionWrapperComponent: GenericConstructor) => void}
  */
-export function rendersSectionForMenu(menuID: MenuID, expandable: boolean) {
+export function rendersSectionForMenu(menuID: MenuID, expandable: boolean, theme = DEFAULT_THEME) {
   return function decorator(menuSectionWrapperComponent: any) {
     if (!menuSectionWrapperComponent) {
       return;
@@ -16,7 +18,10 @@ export function rendersSectionForMenu(menuID: MenuID, expandable: boolean) {
     if (!menuComponentMap.get(menuID)) {
       menuComponentMap.set(menuID, new Map());
     }
-    menuComponentMap.get(menuID).set(expandable, menuSectionWrapperComponent);
+    if (!menuComponentMap.get(menuID).get(expandable)) {
+        menuComponentMap.get(menuID).set(expandable, new Map());
+    }
+    menuComponentMap.get(menuID).get(expandable).set(theme, menuSectionWrapperComponent);
   };
 }
 
@@ -26,6 +31,9 @@ export function rendersSectionForMenu(menuID: MenuID, expandable: boolean) {
  * @param {boolean} expandable True when the section should be expandable, false when if should not
  * @returns {GenericConstructor} The constructor of the matching Component
  */
-export function getComponentForMenu(menuID: MenuID, expandable: boolean) {
+export function getComponentForMenu(menuID: MenuID, expandable: boolean, theme: string) {
-  return menuComponentMap.get(menuID).get(expandable);
+  const comp = menuComponentMap.get(menuID).get(expandable).get(theme);
+  if (hasNoValue(comp)) {
+    return menuComponentMap.get(menuID).get(expandable).get(DEFAULT_THEME);
+  }
 }

src/app/shared/menu/menu.component.ts

@@ -12,6 +12,7 @@ import { compareArraysUsingIds } from '../../item-page/simple/item-types/shared/
 import { ActivatedRoute } from '@angular/router';
 import { AuthorizationDataService } from '../../core/data/feature-authorization/authorization-data.service';
 import { FeatureID } from '../../core/data/feature-authorization/feature-id';
+import { ThemeService } from '../theme-support/theme.service';
 
 /**
  * A basic implementation of a MenuComponent
@@ -72,7 +73,9 @@ export class MenuComponent implements OnInit, OnDestroy {
 
   private activatedRouteLastChild: ActivatedRoute;
 
-  constructor(protected menuService: MenuService, protected injector: Injector, public authorizationService: AuthorizationDataService, public route: ActivatedRoute) {
+  constructor(protected menuService: MenuService, protected injector: Injector, public authorizationService: AuthorizationDataService,
+              public route: ActivatedRoute, protected themeService: ThemeService
+  ) {
   }
 
   /**
@@ -215,7 +218,7 @@ export class MenuComponent implements OnInit, OnDestroy {
   private getSectionComponent(section: MenuSection): Observable<GenericConstructor<MenuSectionComponent>> {
     return this.menuService.hasSubSections(this.menuID, section.id).pipe(
       map((expandable: boolean) => {
-        return getComponentForMenu(this.menuID, expandable);
+        return getComponentForMenu(this.menuID, expandable, this.themeService.getThemeName());
       }
       ),
     );