[LM-46] change menu-item type to external menu item and with no parent

Author: alisaismailati

src/app/admin/admin-sidebar/admin-sidebar-section/admin-sidebar-section.component.html

@@ -4,7 +4,7 @@
        [attr.aria-disabled]="isDisabled"
        [attr.aria-labelledby]="'sidebarName-' + section.id"
        [title]="('menu.section.icon.' + section.id) | translate"
-       [routerLink]="itemModel.link"
+       [routerLink]="itemModel.link ?? itemModel.href"
        (keyup.space)="navigate($event)"
        (keyup.enter)="navigate($event)"
        href="javascript:void(0);"
@@ -21,3 +21,4 @@
       </div>
     </a>
 </div>
+

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

@@ -10,23 +10,31 @@ import { AdminSidebarSectionComponent } from './admin-sidebar-section.component'
 import { RouterTestingModule } from '@angular/router/testing';
 import { By } from '@angular/platform-browser';
 import { TranslateModule } from '@ngx-translate/core';
+import { of } from 'rxjs';
+import { HardRedirectService } from '../../../core/services/hard-redirect.service';
 
 describe('AdminSidebarSectionComponent', () => {
   let component: AdminSidebarSectionComponent;
   let fixture: ComponentFixture<AdminSidebarSectionComponent>;
   const menuService = new MenuServiceStub();
   const iconString = 'test';
 
+  const hardRedirectService = jasmine.createSpyObj('HardRedirectService', {
+    redirect: of({})
+  });
+
   describe('when not disabled', () => {
 
     beforeEach(waitForAsync(() => {
+
       TestBed.configureTestingModule({
         imports: [NoopAnimationsModule, RouterTestingModule, TranslateModule.forRoot()],
         declarations: [AdminSidebarSectionComponent, TestComponent],
         providers: [
           {provide: 'sectionDataProvider', useValue: {model: {link: 'google.com'}, icon: iconString}},
           {provide: MenuService, useValue: menuService},
           {provide: CSSVariableService, useClass: CSSVariableServiceStub},
+          {provide: HardRedirectService, useValue: hardRedirectService},
         ]
       }).overrideComponent(AdminSidebarSectionComponent, {
         set: {
@@ -67,6 +75,7 @@ describe('AdminSidebarSectionComponent', () => {
           {provide: 'sectionDataProvider', useValue: {model: {link: 'google.com', disabled: true}, icon: iconString}},
           {provide: MenuService, useValue: menuService},
           {provide: CSSVariableService, useClass: CSSVariableServiceStub},
+          {provide: HardRedirectService, useValue: hardRedirectService},
         ]
       }).overrideComponent(AdminSidebarSectionComponent, {
         set: {

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

@@ -1,4 +1,4 @@
-import { Component, Inject, Injector, OnInit } from '@angular/core';
+import { Component, Inject, Injector, OnInit, Optional } from '@angular/core';
 import { MenuSectionComponent } from '../../../shared/menu/menu-section/menu-section.component';
 import { MenuService } from '../../../shared/menu/menu.service';
 import { rendersSectionForMenu } from '../../../shared/menu/menu-section.decorator';
@@ -7,6 +7,8 @@ import { MenuSection } from '../../../shared/menu/menu-section.model';
 import { MenuID } from '../../../shared/menu/menu-id.model';
 import { isEmpty } from '../../../shared/empty.util';
 import { Router } from '@angular/router';
+import { ExternalLinkMenuItemModel } from '../../../shared/menu/menu-item/models/external-link.model';
+import { HardRedirectService } from '../../../core/services/hard-redirect.service';
 
 /**
  * Represents a non-expandable section in the admin sidebar
@@ -36,20 +38,33 @@ export class AdminSidebarSectionComponent extends MenuSectionComponent implement
     protected menuService: MenuService,
     protected injector: Injector,
     protected router: Router,
+    protected hardRedirectService: HardRedirectService,
   ) {
     super(menuSection, menuService, injector);
-    this.itemModel = menuSection.model as LinkMenuItemModel;
+    this.itemModel = menuSection.model as LinkMenuItemModel | ExternalLinkMenuItemModel;
   }
 
   ngOnInit(): void {
-    this.isDisabled = this.itemModel?.disabled || isEmpty(this.itemModel?.link);
+    if (this.itemModel instanceof LinkMenuItemModel) {
+      this.isDisabled = this.itemModel?.disabled || isEmpty(this.itemModel?.link);
+    } else if (this.itemModel instanceof ExternalLinkMenuItemModel) {
+      this.isDisabled = this.itemModel?.disabled || isEmpty(this.itemModel?.href);
+    } else {
+      this.isDisabled = true;
+    }
+
     super.ngOnInit();
   }
 
   navigate(event: any): void {
     event.preventDefault();
     if (!this.isDisabled) {
-      this.router.navigate(this.itemModel.link);
+
+      if (this.itemModel instanceof LinkMenuItemModel) {
+        this.router.navigate([this.itemModel.link]);
+      } else if (this.itemModel instanceof ExternalLinkMenuItemModel) {
+        this.hardRedirectService.redirect(this.itemModel.href);
+      }
     }
   }
 }

src/app/admin/admin-sidebar/expandable-admin-sidebar-section/expandable-admin-sidebar-section.component.spec.ts

@@ -5,19 +5,24 @@ import { MenuService } from '../../../shared/menu/menu.service';
 import { MenuServiceStub } from '../../../shared/testing/menu-service.stub';
 import { CSSVariableService } from '../../../shared/sass-helper/css-variable.service';
 import { CSSVariableServiceStub } from '../../../shared/testing/css-variable-service.stub';
-import { of as observableOf } from 'rxjs';
+import { of as observableOf, of } from 'rxjs';
 import { Component } from '@angular/core';
 import { NoopAnimationsModule } from '@angular/platform-browser/animations';
 import { By } from '@angular/platform-browser';
 import { TranslateModule } from '@ngx-translate/core';
 import { Router } from '@angular/router';
 import { RouterStub } from '../../../shared/testing/router.stub';
+import { HardRedirectService } from '../../../core/services/hard-redirect.service';
 
 describe('ExpandableAdminSidebarSectionComponent', () => {
   let component: ExpandableAdminSidebarSectionComponent;
   let fixture: ComponentFixture<ExpandableAdminSidebarSectionComponent>;
   const menuService = new MenuServiceStub();
   const iconString = 'test';
+  const hardRedirectService = jasmine.createSpyObj('HardRedirectService', {
+    redirect: of({})
+  });
+
   beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       imports: [NoopAnimationsModule, TranslateModule.forRoot()],
@@ -27,6 +32,7 @@ describe('ExpandableAdminSidebarSectionComponent', () => {
         { provide: MenuService, useValue: menuService },
         { provide: CSSVariableService, useClass: CSSVariableServiceStub },
         { provide: Router, useValue: new RouterStub() },
+        {provide: HardRedirectService, useValue: hardRedirectService},
       ]
     }).overrideComponent(ExpandableAdminSidebarSectionComponent, {
       set: {

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

@@ -10,6 +10,7 @@ import { map } from 'rxjs/operators';
 import { rendersSectionForMenu } from '../../../shared/menu/menu-section.decorator';
 import { MenuID } from '../../../shared/menu/menu-id.model';
 import { Router } from '@angular/router';
+import { HardRedirectService } from '../../../core/services/hard-redirect.service';
 
 /**
  * Represents a expandable section in the sidebar
@@ -55,8 +56,9 @@ export class ExpandableAdminSidebarSectionComponent extends AdminSidebarSectionC
     private variableService: CSSVariableService,
     protected injector: Injector,
     protected router: Router,
+    protected hardRedirectService: HardRedirectService,
   ) {
-    super(menuSection, menuService, injector, router);
+    super(menuSection, menuService, injector, router, hardRedirectService);
   }
 
   /**

src/app/menu.resolver.spec.ts

@@ -20,7 +20,6 @@ import { createPaginatedList } from './shared/testing/utils.test';
 import { SectionDataService } from './core/layout/section-data.service';
 import createSpy = jasmine.createSpy;
 import { ConfigurationDataService } from './core/data/configuration-data.service';
-import { HardRedirectService } from './core/services/hard-redirect.service';
 
 const BOOLEAN = { t: true, f: false };
 const MENU_STATE = {
@@ -71,7 +70,6 @@ describe('MenuResolver', () => {
   let authorizationService;
   let scriptService;
   let configService;
-  let hardRedirectService;
 
   beforeEach(waitForAsync(() => {
     menuService = new MenuServiceStub();
@@ -91,10 +89,6 @@ describe('MenuResolver', () => {
       findByPropertyName: observableOf({})
     });
 
-    hardRedirectService = jasmine.createSpyObj('HardRedirectService', {
-      redirect: observableOf({})
-    });
-
     TestBed.configureTestingModule({
       imports: [TranslateModule.forRoot(), NoopAnimationsModule, RouterTestingModule],
       declarations: [AdminSidebarComponent],
@@ -104,7 +98,6 @@ describe('MenuResolver', () => {
         { provide: AuthorizationDataService, useValue: authorizationService },
         { provide: ScriptDataService, useValue: scriptService },
         { provide: ConfigurationDataService, useValue: configService },
-        { provide: HardRedirectService, useValue: hardRedirectService },
         {
           provide: NgbModal, useValue: {
             open: () => {/*comment*/

src/app/menu.resolver.ts

@@ -54,7 +54,7 @@ import { Section } from './core/layout/models/section.model';
 import { NOTIFICATIONS_RECITER_SUGGESTION_PATH } from './admin/admin-notifications/admin-notifications-routing-paths';
 import { ConfigurationDataService } from './core/data/configuration-data.service';
 import { ConfigurationProperty } from './core/shared/configuration-property.model';
-import { HardRedirectService } from './core/services/hard-redirect.service';
+import { ExternalLinkMenuItemModel } from './shared/menu/menu-item/models/external-link.model';
 
 /**
  * Creates all of the app's menus
@@ -74,7 +74,6 @@ export class MenuResolver implements Resolve<boolean> {
     protected scriptDataService: ScriptDataService,
     protected sectionDataService: SectionDataService,
     protected configService: ConfigurationDataService,
-    private hardRedirectService: HardRedirectService,
   ) {
   }
 
@@ -625,17 +624,16 @@ export class MenuResolver implements Resolve<boolean> {
     ]).subscribe(([authorized, url]) => {
       this.menuService.addSection(MenuID.ADMIN, {
         id: 'loginmiur_dlexporter_url',
-        parentID: 'export',
+        index: 15,
         active: false,
         visible: authorized && (hasValue(url) && url.length > 0),
         model: {
-          type: MenuItemType.ONCLICK,
+          type: MenuItemType.EXTERNAL,
           text: 'menu.section.loginmiur_dlexporter_url',
-          function: () => {
-            // redirect to external URL
-            this.hardRedirectService.redirect(url);
-          }
-        } as OnClickMenuItemModel,
+          disabled: false,
+          href: url
+        } as ExternalLinkMenuItemModel,
+        icon: 'fa-solid fa-arrows-spin',
         shouldPersistOnRouteChange: true
       });
     });