From e13d743e3250f99fe7ceecd2564da1cc802488e9 Mon Sep 17 00:00:00 2001 From: lotte Date: Tue, 11 Dec 2018 15:47:41 +0100 Subject: [PATCH] added type doc to menu related files --- .../admin-sidebar-section.component.ts | 10 +- .../admin-sidebar/admin-sidebar.component.ts | 191 +++++++++++------- ...andable-admin-sidebar-section.component.ts | 34 +++- src/app/app.component.html | 2 +- src/app/app.component.ts | 17 +- .../expandable-navbar-section.component.ts | 27 ++- .../navbar-section.component.ts | 9 +- src/app/navbar/navbar.component.ts | 36 ++-- src/app/navbar/navbar.effects.ts | 8 + src/app/shared/menu/initial-menus-state.ts | 11 +- src/app/shared/menu/menu-item.decorator.ts | 26 +++ .../link-menu-item.component.html} | 0 .../menu-item/link-menu-item.component.ts | 19 ++ .../menu/menu-item/models/altmetric.model.ts | 10 + .../menu/menu-item/models/link.model.ts | 11 + .../menu/menu-item/models/menu-item.model.ts | 8 + .../menu/menu-item/models/search.model.ts | 11 + .../menu/menu-item/models/text.model.ts | 10 + .../text-menu-item.component.html} | 0 .../menu-item/text-menu-item.component.ts | 19 ++ src/app/shared/menu/menu-section.decorator.ts | 31 ++- .../menu-section/menu-section.component.ts | 69 ++++++- src/app/shared/menu/menu.actions.ts | 54 ++++- src/app/shared/menu/menu.component.ts | 70 ++++++- src/app/shared/menu/menu.decorator.ts | 19 -- src/app/shared/menu/menu.module.ts | 14 +- src/app/shared/menu/menu.reducer.ts | 103 +++++++++- src/app/shared/menu/menu.service.ts | 110 ++++++++++ .../models/section-types/altmetric.model.ts | 7 - .../menu/models/section-types/link.model.ts | 8 - .../menu/models/section-types/search.model.ts | 8 - .../section-types/section-type.model.ts | 5 - .../menu/models/section-types/text.model.ts | 7 - .../type-components/link-type.component.ts | 16 -- .../type-components/text-type.component.ts | 16 -- 35 files changed, 765 insertions(+), 231 deletions(-) create mode 100644 src/app/shared/menu/menu-item.decorator.ts rename src/app/shared/menu/{type-components/link-type.component.html => menu-item/link-menu-item.component.html} (100%) create mode 100644 src/app/shared/menu/menu-item/link-menu-item.component.ts create mode 100644 src/app/shared/menu/menu-item/models/altmetric.model.ts create mode 100644 src/app/shared/menu/menu-item/models/link.model.ts create mode 100644 src/app/shared/menu/menu-item/models/menu-item.model.ts create mode 100644 src/app/shared/menu/menu-item/models/search.model.ts create mode 100644 src/app/shared/menu/menu-item/models/text.model.ts rename src/app/shared/menu/{type-components/text-type.component.html => menu-item/text-menu-item.component.html} (100%) create mode 100644 src/app/shared/menu/menu-item/text-menu-item.component.ts delete mode 100644 src/app/shared/menu/menu.decorator.ts delete mode 100644 src/app/shared/menu/models/section-types/altmetric.model.ts delete mode 100644 src/app/shared/menu/models/section-types/link.model.ts delete mode 100644 src/app/shared/menu/models/section-types/search.model.ts delete mode 100644 src/app/shared/menu/models/section-types/section-type.model.ts delete mode 100644 src/app/shared/menu/models/section-types/text.model.ts delete mode 100644 src/app/shared/menu/type-components/link-type.component.ts delete mode 100644 src/app/shared/menu/type-components/text-type.component.ts diff --git a/src/app/+admin/admin-sidebar/admin-sidebar-section/admin-sidebar-section.component.ts b/src/app/+admin/admin-sidebar/admin-sidebar-section/admin-sidebar-section.component.ts index d4b37c6677..90b9f694f6 100644 --- a/src/app/+admin/admin-sidebar/admin-sidebar-section/admin-sidebar-section.component.ts +++ b/src/app/+admin/admin-sidebar/admin-sidebar-section/admin-sidebar-section.component.ts @@ -1,9 +1,12 @@ -import { Component, Inject, Injector, Input, OnInit } from '@angular/core'; +import { Component, Inject, Injector, OnInit } from '@angular/core'; import { MenuSectionComponent } from '../../../shared/menu/menu-section/menu-section.component'; import { MenuID } from '../../../shared/menu/initial-menus-state'; -import { rendersSectionForMenu } from '../../../shared/menu/menu.decorator'; import { MenuService } from '../../../shared/menu/menu.service'; +import { rendersSectionForMenu } from '../../../shared/menu/menu-section.decorator'; +/** + * Represents a non-expandable section in the admin sidebar + */ @Component({ selector: 'ds-admin-sidebar-section', templateUrl: './admin-sidebar-section.component.html', @@ -12,6 +15,9 @@ import { MenuService } from '../../../shared/menu/menu.service'; }) @rendersSectionForMenu(MenuID.ADMIN, false) export class AdminSidebarSectionComponent extends MenuSectionComponent implements OnInit { + /** + * This section resides in the Admin Sidebar + */ menuID: MenuID = MenuID.ADMIN; constructor(@Inject('sectionDataProvider') menuSection, protected menuService: MenuService, protected injector: Injector,) { diff --git a/src/app/+admin/admin-sidebar/admin-sidebar.component.ts b/src/app/+admin/admin-sidebar/admin-sidebar.component.ts index 699898454f..aa31d8f6f2 100644 --- a/src/app/+admin/admin-sidebar/admin-sidebar.component.ts +++ b/src/app/+admin/admin-sidebar/admin-sidebar.component.ts @@ -3,14 +3,17 @@ import { Observable } from 'rxjs/internal/Observable'; import { slide, slideHorizontal, slideSidebar } from '../../shared/animations/slide'; import { CSSVariableService } from '../../shared/sass-helper/sass-helper.service'; import { MenuService } from '../../shared/menu/menu.service'; -import { MenuID, SectionType } from '../../shared/menu/initial-menus-state'; +import { MenuID, MenuItemType } from '../../shared/menu/initial-menus-state'; import { MenuComponent } from '../../shared/menu/menu.component'; -import { TextSectionTypeModel } from '../../shared/menu/models/section-types/text.model'; -import { LinkSectionTypeModel } from '../../shared/menu/models/section-types/link.model'; +import { TextMenuItemModel } from '../../shared/menu/menu-item/models/text.model'; +import { LinkMenuItemModel } from '../../shared/menu/menu-item/models/link.model'; import { AuthService } from '../../core/auth/auth.service'; import { first, map } from 'rxjs/operators'; import { combineLatest as combineLatestObservable } from 'rxjs'; +/** + * Component representing the admin sidebar + */ @Component({ selector: 'ds-admin-sidebar', templateUrl: './admin-sidebar.component.html', @@ -18,10 +21,32 @@ import { combineLatest as combineLatestObservable } from 'rxjs'; animations: [slideHorizontal, slideSidebar] }) export class AdminSidebarComponent extends MenuComponent implements OnInit { + /** + * The menu ID of the Navbar is PUBLIC + * @type {MenuID.ADMIN} + */ menuID = MenuID.ADMIN; + + /** + * Observable that emits the width of the collapsible menu sections + */ sidebarWidth: Observable; + + /** + * Is true when the sidebar is open, is false when the sidebar is animating or closed + * @type {boolean} + */ sidebarOpen = true; // Open in UI, animation finished + + /** + * Is true when the sidebar is closed, is false when the sidebar is animating or open + * @type {boolean} + */ sidebarClosed = !this.sidebarOpen; // Closed in UI, animation finished + + /** + * Emits true when either the menu OR the menu's preview is expanded, else emits false + */ sidebarExpanded: Observable; constructor(protected menuService: MenuService, @@ -32,6 +57,9 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit { super(menuService, injector); } + /** + * Set and calculate all initial values of the instance variables + */ ngOnInit(): void { this.createMenu(); super.ngOnInit(); @@ -53,6 +81,9 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit { ); } + /** + * Initialize all menu sections and items for this menu + */ createMenu() { const menuList = [ /* News */ @@ -61,10 +92,11 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit { active: false, visible: true, model: { - type: SectionType.TEXT, + type: MenuItemType.TEXT, text: 'admin.sidebar.section.new' - } as TextSectionTypeModel, - icon: 'plus-circle' + } as TextMenuItemModel, + icon: 'plus-circle', + index: 0 }, { id: 'new_community', @@ -72,10 +104,10 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit { active: false, visible: true, model: { - type: SectionType.LINK, + type: MenuItemType.LINK, text: 'admin.sidebar.section.new_community', link: '/communities/submission' - } as LinkSectionTypeModel, + } as LinkMenuItemModel, }, { id: 'new_collection', @@ -83,10 +115,10 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit { active: false, visible: true, model: { - type: SectionType.LINK, + type: MenuItemType.LINK, text: 'admin.sidebar.section.new_collection', link: '/collections/submission' - } as LinkSectionTypeModel, + } as LinkMenuItemModel, }, { id: 'new_item', @@ -94,10 +126,10 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit { active: false, visible: true, model: { - type: SectionType.LINK, + type: MenuItemType.LINK, text: 'admin.sidebar.section.new_item', link: '/items/submission' - } as LinkSectionTypeModel, + } as LinkMenuItemModel, }, { id: 'new_item_version', @@ -105,10 +137,10 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit { active: false, visible: true, model: { - type: SectionType.LINK, + type: MenuItemType.LINK, text: 'admin.sidebar.section.new_item_version', link: '#' - } as LinkSectionTypeModel, + } as LinkMenuItemModel, }, /* Edit */ @@ -117,10 +149,11 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit { active: false, visible: true, model: { - type: SectionType.TEXT, + type: MenuItemType.TEXT, text: 'admin.sidebar.section.edit' - } as TextSectionTypeModel, - icon: 'pencil-alt' + } as TextMenuItemModel, + icon: 'pencil-alt', + index: 1 }, { id: 'edit_community', @@ -128,10 +161,10 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit { active: false, visible: true, model: { - type: SectionType.LINK, + type: MenuItemType.LINK, text: 'admin.sidebar.section.edit_community', link: '#' - } as LinkSectionTypeModel, + } as LinkMenuItemModel, }, { id: 'edit_collection', @@ -139,10 +172,10 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit { active: false, visible: true, model: { - type: SectionType.LINK, + type: MenuItemType.LINK, text: 'admin.sidebar.section.edit_collection', link: '#' - } as LinkSectionTypeModel, + } as LinkMenuItemModel, }, { id: 'edit_item', @@ -150,10 +183,10 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit { active: false, visible: true, model: { - type: SectionType.LINK, + type: MenuItemType.LINK, text: 'admin.sidebar.section.edit_item', link: '#' - } as LinkSectionTypeModel, + } as LinkMenuItemModel, }, /* Import */ @@ -162,11 +195,11 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit { active: false, visible: true, model: { - type: SectionType.TEXT, + type: MenuItemType.TEXT, text: 'admin.sidebar.section.import' - } as TextSectionTypeModel, + } as TextMenuItemModel, icon: 'sign-in-alt', - index: -1 + index: 2 }, { id: 'import_metadata', @@ -174,11 +207,10 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit { active: false, visible: true, model: { - type: SectionType.LINK, + type: MenuItemType.LINK, text: 'admin.sidebar.section.import_metadata', link: '#' - } as LinkSectionTypeModel, - index: 1 + } as LinkMenuItemModel, }, { id: 'import_batch', @@ -186,10 +218,10 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit { active: false, visible: true, model: { - type: SectionType.LINK, + type: MenuItemType.LINK, text: 'admin.sidebar.section.import_batch', link: '#' - } as LinkSectionTypeModel, + } as LinkMenuItemModel, }, /* Export */ @@ -198,10 +230,11 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit { active: false, visible: true, model: { - type: SectionType.TEXT, + type: MenuItemType.TEXT, text: 'admin.sidebar.section.export' - } as TextSectionTypeModel, - icon: 'sign-out-alt' + } as TextMenuItemModel, + icon: 'sign-out-alt', + index: 3 }, { id: 'export_community', @@ -209,10 +242,10 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit { active: false, visible: true, model: { - type: SectionType.LINK, + type: MenuItemType.LINK, text: 'admin.sidebar.section.export_community', link: '#' - } as LinkSectionTypeModel, + } as LinkMenuItemModel, }, { id: 'export_collection', @@ -220,10 +253,10 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit { active: false, visible: true, model: { - type: SectionType.LINK, + type: MenuItemType.LINK, text: 'admin.sidebar.section.export_collection', link: '#' - } as LinkSectionTypeModel, + } as LinkMenuItemModel, }, { id: 'export_item', @@ -231,20 +264,20 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit { active: false, visible: true, model: { - type: SectionType.LINK, + type: MenuItemType.LINK, text: 'admin.sidebar.section.export_item', link: '#' - } as LinkSectionTypeModel, + } as LinkMenuItemModel, }, { id: 'export_metadata', parentID: 'export', active: false, visible: true, model: { - type: SectionType.LINK, + type: MenuItemType.LINK, text: 'admin.sidebar.section.export_metadata', link: '#' - } as LinkSectionTypeModel, + } as LinkMenuItemModel, }, /* Access Control */ @@ -253,10 +286,11 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit { active: false, visible: true, model: { - type: SectionType.TEXT, + type: MenuItemType.TEXT, text: 'admin.sidebar.section.access_control' - } as TextSectionTypeModel, - icon: 'key' + } as TextMenuItemModel, + icon: 'key', + index: 4 }, { id: 'access_control_people', @@ -264,10 +298,10 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit { active: false, visible: true, model: { - type: SectionType.LINK, + type: MenuItemType.LINK, text: 'admin.sidebar.section.access_control_people', link: '#' - } as LinkSectionTypeModel, + } as LinkMenuItemModel, }, { id: 'access_control_groups', @@ -275,10 +309,10 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit { active: false, visible: true, model: { - type: SectionType.LINK, + type: MenuItemType.LINK, text: 'admin.sidebar.section.access_control_groups', link: '#' - } as LinkSectionTypeModel, + } as LinkMenuItemModel, }, { id: 'access_control_authorizations', @@ -286,10 +320,10 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit { active: false, visible: true, model: { - type: SectionType.LINK, + type: MenuItemType.LINK, text: 'admin.sidebar.section.access_control_authorizations', link: '#' - } as LinkSectionTypeModel, + } as LinkMenuItemModel, }, /* Search */ @@ -298,10 +332,11 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit { active: false, visible: true, model: { - type: SectionType.TEXT, + type: MenuItemType.TEXT, text: 'admin.sidebar.section.find' - } as TextSectionTypeModel, - icon: 'search' + } as TextMenuItemModel, + icon: 'search', + index: 5 }, { id: 'find_items', @@ -309,10 +344,10 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit { active: false, visible: true, model: { - type: SectionType.LINK, + type: MenuItemType.LINK, text: 'admin.sidebar.section.find_items', link: '/search' - } as LinkSectionTypeModel, + } as LinkMenuItemModel, }, { id: 'find_withdrawn_items', @@ -320,10 +355,10 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit { active: false, visible: true, model: { - type: SectionType.LINK, + type: MenuItemType.LINK, text: 'admin.sidebar.section.find_withdrawn_items', link: '#' - } as LinkSectionTypeModel, + } as LinkMenuItemModel, }, { id: 'find_private_items', @@ -331,10 +366,10 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit { active: false, visible: true, model: { - type: SectionType.LINK, + type: MenuItemType.LINK, text: 'admin.sidebar.section.find_private_items', link: '/admin/items' - } as LinkSectionTypeModel, + } as LinkMenuItemModel, }, /* Registries */ @@ -343,10 +378,11 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit { active: false, visible: true, model: { - type: SectionType.TEXT, + type: MenuItemType.TEXT, text: 'admin.sidebar.section.registries' - } as TextSectionTypeModel, - icon: 'list' + } as TextMenuItemModel, + icon: 'list', + index: 6 }, { id: 'registries_metadata', @@ -354,10 +390,10 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit { active: false, visible: true, model: { - type: SectionType.LINK, + type: MenuItemType.LINK, text: 'admin.sidebar.section.registries_metadata', link: '/registries/metadata' - } as LinkSectionTypeModel, + } as LinkMenuItemModel, }, { id: 'registries_format', @@ -365,10 +401,10 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit { active: false, visible: true, model: { - type: SectionType.LINK, + type: MenuItemType.LINK, text: 'admin.sidebar.section.registries_format', link: '/registries/format' - } as LinkSectionTypeModel, + } as LinkMenuItemModel, }, /* Curation tasks */ @@ -377,11 +413,12 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit { active: false, visible: true, model: { - type: SectionType.LINK, + type: MenuItemType.LINK, text: 'admin.sidebar.section.curation_task', link: '/curation' - } as LinkSectionTypeModel, - icon: 'filter' + } as LinkMenuItemModel, + icon: 'filter', + index: 7 }, /* Statistics */ @@ -390,11 +427,12 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit { active: false, visible: true, model: { - type: SectionType.LINK, + type: MenuItemType.LINK, text: 'admin.sidebar.section.statistics_task', link: '#' - } as LinkSectionTypeModel, - icon: 'chart-bar' + } as LinkMenuItemModel, + icon: 'chart-bar', + index: 8 }, /* Control Panel */ @@ -403,11 +441,12 @@ export class AdminSidebarComponent extends MenuComponent implements OnInit { active: false, visible: true, model: { - type: SectionType.LINK, + type: MenuItemType.LINK, text: 'admin.sidebar.section.control_panel', link: '#' - } as LinkSectionTypeModel, - icon: 'cogs' + } as LinkMenuItemModel, + icon: 'cogs', + index: 9 }, ]; menuList.forEach((menuSection) => this.menuService.addSection(this.menuID, menuSection)); diff --git a/src/app/+admin/admin-sidebar/expandable-admin-sidebar-section/expandable-admin-sidebar-section.component.ts b/src/app/+admin/admin-sidebar/expandable-admin-sidebar-section/expandable-admin-sidebar-section.component.ts index af009a5dd6..6975bd59d3 100644 --- a/src/app/+admin/admin-sidebar/expandable-admin-sidebar-section/expandable-admin-sidebar-section.component.ts +++ b/src/app/+admin/admin-sidebar/expandable-admin-sidebar-section/expandable-admin-sidebar-section.component.ts @@ -5,13 +5,14 @@ import { slide } from '../../../shared/animations/slide'; import { CSSVariableService } from '../../../shared/sass-helper/sass-helper.service'; import { bgColor } from '../../../shared/animations/bgColor'; import { MenuID } from '../../../shared/menu/initial-menus-state'; -import { rendersSectionForMenu } from '../../../shared/menu/menu.decorator'; import { MenuService } from '../../../shared/menu/menu.service'; -import { MenuSection } from '../../../shared/menu/menu.reducer'; -import { Observable } from 'rxjs'; +import { combineLatest as combineLatestObservable, Observable } from 'rxjs'; import { map } from 'rxjs/operators'; -import { combineLatest as combineLatestObservable } from 'rxjs'; +import { rendersSectionForMenu } from '../../../shared/menu/menu-section.decorator'; +/** + * Represents a expandable section in the sidebar + */ @Component({ selector: 'ds-expandable-admin-sidebar-section', templateUrl: './expandable-admin-sidebar-section.component.html', @@ -21,19 +22,40 @@ import { combineLatest as combineLatestObservable } from 'rxjs'; }) @rendersSectionForMenu(MenuID.ADMIN, true) export class ExpandableAdminSidebarSectionComponent extends AdminSidebarSectionComponent implements OnInit { - subSections: Observable; + /** + * This section resides in the Admin Sidebar + */ menuID = MenuID.ADMIN; + + /** + * The background color of the section when it's active + */ sidebarActiveBg; + + /** + * Emits true when the sidebar is currently collapsed, true when it's expanded + */ sidebarCollapsed: Observable; + + /** + * Emits true when the sidebar's preview is currently collapsed, true when it's expanded + */ sidebarPreviewCollapsed: Observable; + + /** + * Emits true when the menu section is expanded, else emits false + * This is true when the section is active AND either the sidebar or it's preview is open + */ expanded: Observable; constructor(@Inject('sectionDataProvider') menuSection, protected menuService: MenuService, private variableService: CSSVariableService, protected injector: Injector) { super(menuSection, menuService, injector); - } + /** + * Set initial values for instance variables + */ ngOnInit(): void { super.ngOnInit(); this.subSections = this.menuService.getSubSectionsByParentID(this.menuID, this.section.id); diff --git a/src/app/app.component.html b/src/app/app.component.html index d69b6083c1..898208db80 100644 --- a/src/app/app.component.html +++ b/src/app/app.component.html @@ -1,7 +1,7 @@
diff --git a/src/app/app.component.ts b/src/app/app.component.ts index 3a99b4aceb..551a6d7b8a 100644 --- a/src/app/app.component.ts +++ b/src/app/app.component.ts @@ -1,4 +1,4 @@ -import { filter, first, take } from 'rxjs/operators'; +import { filter, first, map, take } from 'rxjs/operators'; import { AfterViewInit, ChangeDetectionStrategy, @@ -29,6 +29,8 @@ import { MenuService } from './shared/menu/menu.service'; import { MenuID } from './shared/menu/initial-menus-state'; import { Observable } from 'rxjs/internal/Observable'; import { slideSidebarPadding } from './shared/animations/slide'; +import { combineLatest as combineLatestObservable } from 'rxjs'; +import { HostWindowService } from './shared/host-window.service'; @Component({ selector: 'ds-app', @@ -41,7 +43,7 @@ import { slideSidebarPadding } from './shared/animations/slide'; export class AppComponent implements OnInit, AfterViewInit { isLoading = true; sidebarVisible: Observable; - sidebarCollapsed: Observable; + slideSidebarOver: Observable; collapsedSidebarWidth: Observable; totalSidebarWidth: Observable; @@ -55,7 +57,8 @@ export class AppComponent implements OnInit, AfterViewInit { private authService: AuthService, private router: Router, private cssService: CSSVariableService, - private menuService: MenuService + private menuService: MenuService, + private windowService: HostWindowService ) { // this language will be used as a fallback when a translation isn't found in the current language translate.setDefaultLang('en'); @@ -83,10 +86,16 @@ export class AppComponent implements OnInit, AfterViewInit { filter((authenticated) => !authenticated) ).subscribe((authenticated) => this.authService.checkAuthenticationToken()); this.sidebarVisible = this.menuService.isMenuVisible(MenuID.ADMIN); - this.sidebarCollapsed = this.menuService.isMenuCollapsed(MenuID.ADMIN); this.collapsedSidebarWidth = this.cssService.getVariable('collapsedSidebarWidth'); this.totalSidebarWidth = this.cssService.getVariable('totalSidebarWidth'); + + const sidebarCollapsed = this.menuService.isMenuCollapsed(MenuID.ADMIN); + //TODO FIX THIS: + this.slideSidebarOver = combineLatestObservable(sidebarCollapsed, this.windowService.isXsOrSm()) + .pipe( + map(([collapsed, mobile]) => collapsed || mobile) + ); } private storeCSSVariables() { diff --git a/src/app/navbar/expandable-navbar-section/expandable-navbar-section.component.ts b/src/app/navbar/expandable-navbar-section/expandable-navbar-section.component.ts index 2d0091399c..068854d6f8 100644 --- a/src/app/navbar/expandable-navbar-section/expandable-navbar-section.component.ts +++ b/src/app/navbar/expandable-navbar-section/expandable-navbar-section.component.ts @@ -2,15 +2,14 @@ import { Component, Inject, Injector, OnInit } from '@angular/core'; import { NavbarSectionComponent } from '../navbar-section/navbar-section.component'; import { MenuService } from '../../shared/menu/menu.service'; import { MenuID } from '../../shared/menu/initial-menus-state'; -import { rendersSectionForMenu } from '../../shared/menu/menu.decorator'; -import { Observable } from 'rxjs/internal/Observable'; -import { MenuSection } from '../../shared/menu/menu.reducer'; import { slide } from '../../shared/animations/slide'; import { first } from 'rxjs/operators'; import { HostWindowService } from '../../shared/host-window.service'; -import { GenericConstructor } from '../../core/shared/generic-constructor'; -import { MenuSectionComponent } from '../../shared/menu/menu-section/menu-section.component'; +import { rendersSectionForMenu } from '../../shared/menu/menu-section.decorator'; +/** + * Represents an expandable section in the navbar + */ @Component({ selector: 'ds-expandable-navbar-section', templateUrl: './expandable-navbar-section.component.html', @@ -19,6 +18,9 @@ import { MenuSectionComponent } from '../../shared/menu/menu-section/menu-sectio }) @rendersSectionForMenu(MenuID.PUBLIC, true) export class ExpandableNavbarSectionComponent extends NavbarSectionComponent implements OnInit { + /** + * This section resides in the Public Navbar + */ menuID = MenuID.PUBLIC; constructor(@Inject('sectionDataProvider') menuSection, @@ -33,6 +35,11 @@ export class ExpandableNavbarSectionComponent extends NavbarSectionComponent imp super.ngOnInit(); } + /** + * Overrides the super function that activates this section (triggered on hover) + * Has an extra check to make sure the section can only be activated on non-mobile devices + * @param {Event} event The user event that triggered this function + */ activateSection(event): void { this.windowService.isXsOrSm().pipe( first() @@ -43,6 +50,11 @@ export class ExpandableNavbarSectionComponent extends NavbarSectionComponent imp }); } + /** + * Overrides the super function that deactivates this section (triggered on hover) + * Has an extra check to make sure the section can only be deactivated on non-mobile devices + * @param {Event} event The user event that triggered this function + */ deactivateSection(event): void { this.windowService.isXsOrSm().pipe( first() @@ -53,6 +65,11 @@ export class ExpandableNavbarSectionComponent extends NavbarSectionComponent imp }); } + /** + * Overrides the super function that toggles this section (triggered on click) + * Has an extra check to make sure the section can only be toggled on mobile devices + * @param {Event} event The user event that triggered this function + */ toggleSection(event): void { event.preventDefault(); this.windowService.isXsOrSm().pipe( diff --git a/src/app/navbar/navbar-section/navbar-section.component.ts b/src/app/navbar/navbar-section/navbar-section.component.ts index 60f270745b..e1488de3d3 100644 --- a/src/app/navbar/navbar-section/navbar-section.component.ts +++ b/src/app/navbar/navbar-section/navbar-section.component.ts @@ -2,9 +2,11 @@ import { Component, Inject, Injector, OnInit } from '@angular/core'; import { MenuSectionComponent } from '../../shared/menu/menu-section/menu-section.component'; import { MenuService } from '../../shared/menu/menu.service'; import { MenuID } from '../../shared/menu/initial-menus-state'; -import { rendersSectionForMenu } from '../../shared/menu/menu.decorator'; -import { HostWindowService } from '../../shared/host-window.service'; +import { rendersSectionForMenu } from '../../shared/menu/menu-section.decorator'; +/** + * Represents a non-expandable section in the navbar + */ @Component({ selector: 'ds-navbar-section', templateUrl: './navbar-section.component.html', @@ -12,6 +14,9 @@ import { HostWindowService } from '../../shared/host-window.service'; }) @rendersSectionForMenu(MenuID.PUBLIC, false) export class NavbarSectionComponent extends MenuSectionComponent implements OnInit { + /** + * This section resides in the Public Navbar + */ menuID = MenuID.PUBLIC; constructor(@Inject('sectionDataProvider') menuSection, diff --git a/src/app/navbar/navbar.component.ts b/src/app/navbar/navbar.component.ts index 0b6b4fef5c..803882f0d9 100644 --- a/src/app/navbar/navbar.component.ts +++ b/src/app/navbar/navbar.component.ts @@ -2,11 +2,14 @@ import { Component, Injector, OnInit } from '@angular/core'; import { slideMobileNav } from '../shared/animations/slide'; import { MenuComponent } from '../shared/menu/menu.component'; import { MenuService } from '../shared/menu/menu.service'; -import { MenuID, SectionType } from '../shared/menu/initial-menus-state'; -import { TextSectionTypeModel } from '../shared/menu/models/section-types/text.model'; -import { LinkSectionTypeModel } from '../shared/menu/models/section-types/link.model'; +import { MenuID, MenuItemType } from '../shared/menu/initial-menus-state'; +import { TextMenuItemModel } from '../shared/menu/menu-item/models/text.model'; +import { LinkMenuItemModel } from '../shared/menu/menu-item/models/link.model'; import { HostWindowService } from '../shared/host-window.service'; +/** + * Component representing the public navbar + */ @Component({ selector: 'ds-navbar', styleUrls: ['navbar.component.scss'], @@ -14,6 +17,10 @@ import { HostWindowService } from '../shared/host-window.service'; animations: [slideMobileNav] }) export class NavbarComponent extends MenuComponent implements OnInit { + /** + * The menu ID of the Navbar is PUBLIC + * @type {MenuID.PUBLIC} + */ menuID = MenuID.PUBLIC; constructor(protected menuService: MenuService, @@ -28,6 +35,9 @@ export class NavbarComponent extends MenuComponent implements OnInit { super.ngOnInit(); } + /** + * Initialize all menu sections and items for this menu + */ createMenu() { const menuList = [ /* News */ @@ -36,9 +46,9 @@ export class NavbarComponent extends MenuComponent implements OnInit { active: false, visible: true, model: { - type: SectionType.TEXT, + type: MenuItemType.TEXT, text: 'admin.sidebar.section.browse_global' - } as TextSectionTypeModel, + } as TextMenuItemModel, }, { id: 'browse_global_communities_and_collections', @@ -46,10 +56,10 @@ export class NavbarComponent extends MenuComponent implements OnInit { active: false, visible: true, model: { - type: SectionType.LINK, + type: MenuItemType.LINK, text: 'admin.sidebar.section.browse_global_communities_and_collections', link: '#' - } as LinkSectionTypeModel, + } as LinkMenuItemModel, }, { id: 'browse_global_global_by_issue_date', @@ -57,10 +67,10 @@ export class NavbarComponent extends MenuComponent implements OnInit { active: false, visible: true, model: { - type: SectionType.LINK, + type: MenuItemType.LINK, text: 'admin.sidebar.section.browse_global_by_issue_date', link: '#' - } as LinkSectionTypeModel, + } as LinkMenuItemModel, }, { id: 'browse_global_by_author', @@ -68,10 +78,10 @@ export class NavbarComponent extends MenuComponent implements OnInit { active: false, visible: true, model: { - type: SectionType.LINK, + type: MenuItemType.LINK, text: 'admin.sidebar.section.browse_global_by_author', link: '#' - } as LinkSectionTypeModel, + } as LinkMenuItemModel, }, /* Statistics */ @@ -80,10 +90,10 @@ export class NavbarComponent extends MenuComponent implements OnInit { active: false, visible: true, model: { - type: SectionType.LINK, + type: MenuItemType.LINK, text: 'admin.sidebar.section.statistics', link: '#' - } as LinkSectionTypeModel, + } as LinkMenuItemModel, }, ]; menuList.forEach((menuSection) => this.menuService.addSection(this.menuID, menuSection)); diff --git a/src/app/navbar/navbar.effects.ts b/src/app/navbar/navbar.effects.ts index b06518980e..fea6406854 100644 --- a/src/app/navbar/navbar.effects.ts +++ b/src/app/navbar/navbar.effects.ts @@ -10,12 +10,20 @@ import { MenuID } from '../shared/menu/initial-menus-state'; @Injectable() export class NavbarEffects { menuID = MenuID.PUBLIC; + /** + * Effect that collapses the public menu on window resize + * @type {Observable} + */ @Effect() resize$ = this.actions$ .pipe( ofType(HostWindowActionTypes.RESIZE), map(() => new CollapseMenuAction(this.menuID)) ); + /** + * Effect that collapses the public menu on reroute + * @type {Observable} + */ @Effect() routeChange$ = this.actions$ .pipe( ofType(fromRouter.ROUTER_NAVIGATION), diff --git a/src/app/shared/menu/initial-menus-state.ts b/src/app/shared/menu/initial-menus-state.ts index 36319f375d..7f3482f41f 100644 --- a/src/app/shared/menu/initial-menus-state.ts +++ b/src/app/shared/menu/initial-menus-state.ts @@ -1,14 +1,23 @@ import { MenusState } from './menu.reducer'; +/** + * Availavle Menu IDs + */ export enum MenuID { ADMIN = 'admin-sidebar', PUBLIC = 'public' } -export enum SectionType { +/** + * List of possible MenuItemTypes + */ +export enum MenuItemType { TEXT, LINK, ALTMETRIC, SEARCH } +/** + * The initial state of the menus + */ export const initialMenusState: MenusState = { [MenuID.ADMIN]: { diff --git a/src/app/shared/menu/menu-item.decorator.ts b/src/app/shared/menu/menu-item.decorator.ts new file mode 100644 index 0000000000..3740a4eba4 --- /dev/null +++ b/src/app/shared/menu/menu-item.decorator.ts @@ -0,0 +1,26 @@ +import { MenuItemType } from './initial-menus-state'; + +const menuMenuItemComponentMap = new Map(); + +/** + * Decorator function to link a MenuItemType to a Component + * @param {MenuItemType} type The MenuItemType of the MenuSection's model + * @returns {(sectionComponent: GenericContructor) => void} + */ +export function rendersMenuItemForType(type: MenuItemType) { + return function decorator(sectionComponent: any) { + if (!sectionComponent) { + return; + } + menuMenuItemComponentMap.set(type, sectionComponent); + }; +} + +/** + * Retrieves the Component matching a given MenuItemType + * @param {MenuItemType} type The given MenuItemType + * @returns {GenericConstructor} The constructor of the Component that matches the MenuItemType + */ +export function getComponentForMenuItemType(type: MenuItemType) { + return menuMenuItemComponentMap.get(type); +} diff --git a/src/app/shared/menu/type-components/link-type.component.html b/src/app/shared/menu/menu-item/link-menu-item.component.html similarity index 100% rename from src/app/shared/menu/type-components/link-type.component.html rename to src/app/shared/menu/menu-item/link-menu-item.component.html diff --git a/src/app/shared/menu/menu-item/link-menu-item.component.ts b/src/app/shared/menu/menu-item/link-menu-item.component.ts new file mode 100644 index 0000000000..ce2e0558f0 --- /dev/null +++ b/src/app/shared/menu/menu-item/link-menu-item.component.ts @@ -0,0 +1,19 @@ +import { Component, Inject, Input } from '@angular/core'; +import { LinkMenuItemModel } from './models/link.model'; +import { MenuItemType } from '../initial-menus-state'; +import { rendersMenuItemForType } from '../menu-item.decorator'; + +/** + * Component that renders a menu section of type LINK + */ +@Component({ + selector: 'ds-link-menu-item', + templateUrl: './link-menu-item.component.html' +}) +@rendersMenuItemForType(MenuItemType.LINK) +export class LinkMenuItemComponent { + @Input() item: LinkMenuItemModel; + constructor(@Inject('itemModelProvider') item) { + this.item = item; + } +} diff --git a/src/app/shared/menu/menu-item/models/altmetric.model.ts b/src/app/shared/menu/menu-item/models/altmetric.model.ts new file mode 100644 index 0000000000..8dc3f01363 --- /dev/null +++ b/src/app/shared/menu/menu-item/models/altmetric.model.ts @@ -0,0 +1,10 @@ +import { MenuItemType } from '../../initial-menus-state'; +import { MenuItemModel } from './menu-item.model'; + +/** + * Model representing an Altmetric Menu Section + */ +export class AltmetricMenuItemModel implements MenuItemModel { + type = MenuItemType.ALTMETRIC; + url: string; +} diff --git a/src/app/shared/menu/menu-item/models/link.model.ts b/src/app/shared/menu/menu-item/models/link.model.ts new file mode 100644 index 0000000000..a5b3671f62 --- /dev/null +++ b/src/app/shared/menu/menu-item/models/link.model.ts @@ -0,0 +1,11 @@ +import { MenuItemModel } from './menu-item.model'; +import { MenuItemType } from '../../initial-menus-state'; + +/** + * Model representing an Link Menu Section + */ +export class LinkMenuItemModel implements MenuItemModel { + type = MenuItemType.LINK; + text: string; + link: string; +} diff --git a/src/app/shared/menu/menu-item/models/menu-item.model.ts b/src/app/shared/menu/menu-item/models/menu-item.model.ts new file mode 100644 index 0000000000..7bf5fca066 --- /dev/null +++ b/src/app/shared/menu/menu-item/models/menu-item.model.ts @@ -0,0 +1,8 @@ +import { MenuItemType } from '../../initial-menus-state'; + +/** + * Interface for models representing a Menu Section + */ +export interface MenuItemModel { + type: MenuItemType; +} diff --git a/src/app/shared/menu/menu-item/models/search.model.ts b/src/app/shared/menu/menu-item/models/search.model.ts new file mode 100644 index 0000000000..e8eeda5501 --- /dev/null +++ b/src/app/shared/menu/menu-item/models/search.model.ts @@ -0,0 +1,11 @@ +import { MenuItemType } from '../../initial-menus-state'; +import { MenuItemModel } from './menu-item.model'; + +/** + * Model representing an Search Bar Menu Section + */ +export class SearchMenuItemModel implements MenuItemModel { + type = MenuItemType.SEARCH; + placeholder: string; + action: string; +} diff --git a/src/app/shared/menu/menu-item/models/text.model.ts b/src/app/shared/menu/menu-item/models/text.model.ts new file mode 100644 index 0000000000..bbaf7804d9 --- /dev/null +++ b/src/app/shared/menu/menu-item/models/text.model.ts @@ -0,0 +1,10 @@ +import { MenuItemType } from '../../initial-menus-state'; +import { MenuItemModel } from './menu-item.model'; + +/** + * Model representing an Text Menu Section + */ +export class TextMenuItemModel implements MenuItemModel { + type = MenuItemType.TEXT; + text: string; +} diff --git a/src/app/shared/menu/type-components/text-type.component.html b/src/app/shared/menu/menu-item/text-menu-item.component.html similarity index 100% rename from src/app/shared/menu/type-components/text-type.component.html rename to src/app/shared/menu/menu-item/text-menu-item.component.html diff --git a/src/app/shared/menu/menu-item/text-menu-item.component.ts b/src/app/shared/menu/menu-item/text-menu-item.component.ts new file mode 100644 index 0000000000..00dd146171 --- /dev/null +++ b/src/app/shared/menu/menu-item/text-menu-item.component.ts @@ -0,0 +1,19 @@ +import { Component, Inject, Input } from '@angular/core'; +import { TextMenuItemModel } from './models/text.model'; +import { MenuItemType } from '../initial-menus-state'; +import { rendersMenuItemForType } from '../menu-item.decorator'; + +/** + * Component that renders a menu section of type TEXT + */ +@Component({ + selector: 'ds-text-menu-item', + templateUrl: './text-menu-item.component.html', +}) +@rendersMenuItemForType(MenuItemType.TEXT) +export class TextMenuItemComponent { + @Input() item: TextMenuItemModel; + constructor(@Inject('itemModelProvider') item) { + this.item = item; + } +} diff --git a/src/app/shared/menu/menu-section.decorator.ts b/src/app/shared/menu/menu-section.decorator.ts index 556e81d676..c27e870e13 100644 --- a/src/app/shared/menu/menu-section.decorator.ts +++ b/src/app/shared/menu/menu-section.decorator.ts @@ -1,16 +1,31 @@ -import { SectionType } from './initial-menus-state'; +import { MenuID } from './initial-menus-state'; -const menuSectionTypeComponentMap = new Map(); +const menuComponentMap = new Map(); -export function rendersSectionForType(type: SectionType) { - return function decorator(sectionComponent: any) { - if (!sectionComponent) { +/** + * Decorator function to render a MenuSection for a menu + * @param {MenuID} menuID The ID of the Menu in which the section is rendered + * @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) { + return function decorator(menuSectionWrapperComponent: any) { + if (!menuSectionWrapperComponent) { return; } - menuSectionTypeComponentMap.set(type, sectionComponent); + if (!menuComponentMap.get(menuID)) { + menuComponentMap.set(menuID, new Map()); + } + menuComponentMap.get(menuID).set(expandable, menuSectionWrapperComponent); }; } -export function getComponentForSectionType(type: SectionType) { - return menuSectionTypeComponentMap.get(type); +/** + * Retrieves the component matching the given MenuID and whether or not it should be expandable + * @param {MenuID} menuID The ID of the Menu in which the section is rendered + * @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) { + return menuComponentMap.get(menuID).get(expandable); } diff --git a/src/app/shared/menu/menu-section/menu-section.component.ts b/src/app/shared/menu/menu-section/menu-section.component.ts index 0c794ab9ce..fcd728a4db 100644 --- a/src/app/shared/menu/menu-section/menu-section.component.ts +++ b/src/app/shared/menu/menu-section/menu-section.component.ts @@ -1,48 +1,89 @@ -import { Component, Injector, Input } from '@angular/core'; +import { Component, Injector } from '@angular/core'; import { MenuService } from '../menu.service'; import { MenuSection } from '../menu.reducer'; -import { getComponentForSectionType } from '../menu-section.decorator'; -import { MenuID, SectionType } from '../initial-menus-state'; -import { hasNoValue, hasValue } from '../../empty.util'; +import { getComponentForMenuItemType } from '../menu-item.decorator'; +import { MenuID, MenuItemType } from '../initial-menus-state'; +import { hasNoValue } from '../../empty.util'; import { Observable } from 'rxjs/internal/Observable'; -import { SectionTypeModel } from '../models/section-types/section-type.model'; +import { MenuItemModel } from '../menu-item/models/menu-item.model'; import { distinctUntilChanged } from 'rxjs/operators'; import { GenericConstructor } from '../../../core/shared/generic-constructor'; +/** + * A basic implementation of a menu section's component + */ @Component({ selector: 'ds-menu-section', template: '' }) export class MenuSectionComponent { + + /** + * Observable that emits whether or not this section is currently active + */ active: Observable; + + /** + * The ID of the menu this section resides in + */ menuID: MenuID; + + /** + * List of Injectors for each dynamically rendered menu item of this section + */ itemInjectors: Map = new Map(); + + /** + * List of child Components for each dynamically rendered menu item of this section + */ itemComponents: Map> = new Map>(); + + /** + * List of available subsections in this section + */ subSections: Observable; constructor(public section: MenuSection, protected menuService: MenuService, protected injector: Injector) { } + /** + * Set initial values for instance variables + */ ngOnInit(): void { this.active = this.menuService.isSectionActive(this.menuID, this.section.id).pipe(distinctUntilChanged()); this.initializeInjectorData(); } + /** + * Activate this section if it's currently inactive, deactivate it when it's currently active + * @param {Event} event The user event that triggered this method + */ toggleSection(event: Event) { event.preventDefault(); this.menuService.toggleActiveSection(this.menuID, this.section.id); } + /** + * Activate this section + * @param {Event} event The user event that triggered this method + */ activateSection(event: Event) { event.preventDefault(); this.menuService.activateSection(this.menuID, this.section.id); } + /** + * Deactivate this section + * @param {Event} event The user event that triggered this method + */ deactivateSection(event: Event) { event.preventDefault(); this.menuService.deactivateSection(this.menuID, this.section.id); } + /** + * Method for initializing all injectors and component constructors for the menu items in this section + */ initializeInjectorData() { this.itemInjectors.set(this.section.id, this.getItemModelInjector(this.section.model)); this.itemComponents.set(this.section.id, this.getMenuItemComponent(this.section.model)); @@ -55,15 +96,25 @@ export class MenuSectionComponent { }) } - getMenuItemComponent(itemModel?: SectionTypeModel) { + /** + * Retrieve the component for a given MenuItemModel object + * @param {MenuItemModel} itemModel The given MenuItemModel + * @returns {GenericConstructor} Emits the constructor of the Component that should be used to render this menu item model + */ + getMenuItemComponent(itemModel?: MenuItemModel) { if (hasNoValue(itemModel)) { itemModel = this.section.model; } - const type: SectionType = itemModel.type; - return getComponentForSectionType(type); + const type: MenuItemType = itemModel.type; + return getComponentForMenuItemType(type); } - getItemModelInjector(itemModel?: SectionTypeModel) { + /** + * Retrieve the Injector for a given MenuItemModel object + * @param {MenuItemModel} itemModel The given MenuItemModel + * @returns {Injector} The Injector that injects the data for this menu item into the item's component + */ + getItemModelInjector(itemModel?: MenuItemModel) { if (hasNoValue(itemModel)) { itemModel = this.section.model; } diff --git a/src/app/shared/menu/menu.actions.ts b/src/app/shared/menu/menu.actions.ts index 74f89f8eb2..0c1533ed3b 100644 --- a/src/app/shared/menu/menu.actions.ts +++ b/src/app/shared/menu/menu.actions.ts @@ -3,6 +3,14 @@ import { MenuID } from './initial-menus-state'; import { type } from '../ngrx/type'; import { MenuSection } from './menu.reducer'; +/** + * For each action type in an action group, make a simple + * enum object for all of this group's action types. + * + * The 'type' utility function coerces strings into string + * literal types and runs a simple check to guarantee all + * action types in the application are unique. + */ export const MenuActionTypes = { COLLAPSE_MENU: type('dspace/menu/COLLAPSE_MENU'), TOGGLE_MENU: type('dspace/menu/TOGGLE_MENU'), @@ -23,6 +31,9 @@ export const MenuActionTypes = { /* tslint:disable:max-classes-per-file */ // MENU STATE ACTIONS +/** + * Action used to collapse a single menu + */ export class CollapseMenuAction implements Action { type = MenuActionTypes.COLLAPSE_MENU; menuID: MenuID; @@ -32,6 +43,9 @@ export class CollapseMenuAction implements Action { } } +/** + * Action used to expand a single menu + */ export class ExpandMenuAction implements Action { type = MenuActionTypes.EXPAND_MENU; menuID: MenuID; @@ -41,6 +55,9 @@ export class ExpandMenuAction implements Action { } } +/** + * Action used to collapse a single menu when it's expanded and expanded it when it's collapse + */ export class ToggleMenuAction implements Action { type = MenuActionTypes.TOGGLE_MENU; menuID: MenuID; @@ -50,6 +67,9 @@ export class ToggleMenuAction implements Action { } } +/** + * Action used to show a single menu + */ export class ShowMenuAction implements Action { type = MenuActionTypes.SHOW_MENU; menuID: MenuID; @@ -59,6 +79,9 @@ export class ShowMenuAction implements Action { } } +/** + * Action used to hide a single menu + */ export class HideMenuAction implements Action { type = MenuActionTypes.HIDE_MENU; menuID: MenuID; @@ -68,6 +91,9 @@ export class HideMenuAction implements Action { } } +/** + * Action used to collapse a single menu's preview + */ export class CollapseMenuPreviewAction implements Action { type = MenuActionTypes.COLLAPSE_MENU_PREVIEW; menuID: MenuID; @@ -77,6 +103,9 @@ export class CollapseMenuPreviewAction implements Action { } } +/** + * Action used to expand a single menu's preview + */ export class ExpandMenuPreviewAction implements Action { type = MenuActionTypes.EXPAND_MENU_PREVIEW; menuID: MenuID; @@ -86,8 +115,10 @@ export class ExpandMenuPreviewAction implements Action { } } - -// MENU STRUCTURING ACTIONS +// MENU SECTION ACTIONS +/** + * Action used to perform state changes for a section of a certain menu + */ export abstract class MenuSectionAction implements Action { type; menuID: MenuID; @@ -99,6 +130,9 @@ export abstract class MenuSectionAction implements Action { } } +/** + * Action used to add a section to a certain menu + */ export class AddMenuSectionAction extends MenuSectionAction { type = MenuActionTypes.ADD_SECTION; section: MenuSection; @@ -109,6 +143,9 @@ export class AddMenuSectionAction extends MenuSectionAction { } } +/** + * Action used to remove a section from a certain menu + */ export class RemoveMenuSectionAction extends MenuSectionAction { type = MenuActionTypes.REMOVE_SECTION; @@ -118,6 +155,9 @@ export class RemoveMenuSectionAction extends MenuSectionAction { } } +/** + * Action used to hide a section of a certain menu + */ export class HideMenuSectionAction extends MenuSectionAction { type = MenuActionTypes.HIDE_SECTION; @@ -127,7 +167,7 @@ export class HideMenuSectionAction extends MenuSectionAction { } /** - * Used to expand a section + * Action used to show a section of a certain menu */ export class ShowMenuSectionAction extends MenuSectionAction { type = MenuActionTypes.SHOW_SECTION; @@ -137,6 +177,9 @@ export class ShowMenuSectionAction extends MenuSectionAction { } } +/** + * Action used to make a section of a certain menu active + */ export class ActivateMenuSectionAction extends MenuSectionAction { type = MenuActionTypes.ACTIVATE_SECTION; @@ -146,7 +189,7 @@ export class ActivateMenuSectionAction extends MenuSectionAction { } /** - * Used to expand a section + * Action used to make a section of a certain menu inactive */ export class DeactivateMenuSectionAction extends MenuSectionAction { type = MenuActionTypes.DEACTIVATE_SECTION; @@ -156,6 +199,9 @@ export class DeactivateMenuSectionAction extends MenuSectionAction { } } +/** + * Action used to make an active section of a certain menu inactive or an inactive section of a certain menu active + */ export class ToggleActiveMenuSectionAction extends MenuSectionAction { type = MenuActionTypes.TOGGLE_ACTIVE_SECTION; diff --git a/src/app/shared/menu/menu.component.ts b/src/app/shared/menu/menu.component.ts index f673c1b610..16474a0df3 100644 --- a/src/app/shared/menu/menu.component.ts +++ b/src/app/shared/menu/menu.component.ts @@ -4,27 +4,64 @@ import { MenuService } from '../../shared/menu/menu.service'; import { MenuID } from '../../shared/menu/initial-menus-state'; import { MenuSection } from '../../shared/menu/menu.reducer'; import { first, map } from 'rxjs/operators'; -import { getComponentForMenu } from './menu.decorator'; import { GenericConstructor } from '../../core/shared/generic-constructor'; import { MenuSectionComponent } from './menu-section/menu-section.component'; +import { getComponentForMenu } from './menu-section.decorator'; +/** + * A basic implementation of a MenuComponent + */ @Component({ selector: 'ds-menu', template: '' }) export class MenuComponent implements OnInit { + /** + * The ID of the Menu (See MenuID) + */ menuID: MenuID; + + /** + * Observable that emits whether or not this menu is currently collapsed + */ menuCollapsed: Observable; + + /** + * Observable that emits whether or not this menu's preview is currently collapsed + */ menuPreviewCollapsed: Observable; + + /** + * Observable that emits whether or not this menu is currently visible + */ menuVisible: Observable; + + /** + * List of top level sections in this Menu + */ sections: Observable; + + /** + * List of Injectors for each dynamically rendered menu section + */ sectionInjectors: Map = new Map(); + + /** + * List of child Components for each dynamically rendered menu section + */ sectionComponents: Map> = new Map>(); + + /** + * Prevent unnecessary rerendering + */ changeDetection: ChangeDetectionStrategy.OnPush; constructor(protected menuService: MenuService, protected injector: Injector) { } + /** + * Sets all instance variables to their initial values + */ ngOnInit(): void { this.menuCollapsed = this.menuService.isMenuCollapsed(this.menuID); this.menuPreviewCollapsed = this.menuService.isMenuPreviewCollapsed(this.menuID); @@ -38,32 +75,56 @@ export class MenuComponent implements OnInit { }) } + /** + * Collapse this menu when it's currently expanded, expand it when its currently collapsed + * @param {Event} event The user event that triggered this method + */ toggle(event: Event) { event.preventDefault(); this.menuService.toggleMenu(this.menuID); } + /** + * Expand this menu + * @param {Event} event The user event that triggered this method + */ expand(event: Event) { event.preventDefault(); this.menuService.expandMenu(this.menuID); } + /** + * Collapse this menu + * @param {Event} event The user event that triggered this method + */ collapse(event: Event) { event.preventDefault(); this.menuService.collapseMenu(this.menuID); } + /** + * Expand this menu's preview + * @param {Event} event The user event that triggered this method + */ expandPreview(event: Event) { - console.log("HOI IK HOVER"); event.preventDefault(); this.menuService.expandMenuPreview(this.menuID); } + /** + * Collapse this menu's preview + * @param {Event} event The user event that triggered this method + */ collapsePreview(event: Event) { event.preventDefault(); this.menuService.collapseMenuPreview(this.menuID); } + /** + * Retrieve the component for a given MenuSection object + * @param {MenuSection} section The given MenuSection + * @returns {Observable>} Emits the constructor of the Component that should be used to render this object + */ getSectionComponent(section: MenuSection): Observable> { return this.menuService.hasSubSections(this.menuID, section.id).pipe( map((expandable: boolean) => { @@ -73,6 +134,11 @@ export class MenuComponent implements OnInit { ); } + /** + * Retrieve the Injector for a given MenuSection object + * @param {MenuSection} section The given MenuSection + * @returns {Injector} The Injector that injects the data for this menu section into the section's component + */ getSectionDataInjector(section: MenuSection) { return Injector.create({ providers: [{ provide: 'sectionDataProvider', useFactory: () => (section), deps: [] }], diff --git a/src/app/shared/menu/menu.decorator.ts b/src/app/shared/menu/menu.decorator.ts deleted file mode 100644 index 1aaa488bf6..0000000000 --- a/src/app/shared/menu/menu.decorator.ts +++ /dev/null @@ -1,19 +0,0 @@ -import { MenuID } from './initial-menus-state'; - -const menuComponentMap = new Map(); - -export function rendersSectionForMenu(menuID: MenuID, expandable: boolean) { - return function decorator(menuSectionWrapperComponent: any) { - if (!menuSectionWrapperComponent) { - return; - } - if (!menuComponentMap.get(menuID)) { - menuComponentMap.set(menuID, new Map()); - } - menuComponentMap.get(menuID).set(expandable, menuSectionWrapperComponent); - }; -} - -export function getComponentForMenu(menuID: MenuID, expandable: boolean) { - return menuComponentMap.get(menuID).get(expandable); -} diff --git a/src/app/shared/menu/menu.module.ts b/src/app/shared/menu/menu.module.ts index 9768fb946d..736da5c267 100644 --- a/src/app/shared/menu/menu.module.ts +++ b/src/app/shared/menu/menu.module.ts @@ -1,21 +1,21 @@ import { MenuSectionComponent } from './menu-section/menu-section.component'; import { MenuComponent } from './menu.component'; -import { LinkTypeMenuItemComponent } from './type-components/link-type.component'; -import { TextTypeMenuItemComponent } from './type-components/text-type.component'; import { NgModule } from '@angular/core'; import { TranslateModule } from '@ngx-translate/core'; import { RouterModule } from '@angular/router'; +import { LinkMenuItemComponent } from './menu-item/link-menu-item.component'; +import { TextMenuItemComponent } from './menu-item/text-menu-item.component'; const COMPONENTS = [ MenuSectionComponent, MenuComponent, - LinkTypeMenuItemComponent, - TextTypeMenuItemComponent + LinkMenuItemComponent, + TextMenuItemComponent ]; const ENTRY_COMPONENTS = [ - LinkTypeMenuItemComponent, - TextTypeMenuItemComponent + LinkMenuItemComponent, + TextMenuItemComponent ]; const MODULES = [ @@ -47,7 +47,7 @@ const PROVIDERS = [ }) /** - * This module handles all components and pipes that need to be shared among multiple other modules + * This module handles all components, providers and modules that are needed for the menu */ export class MenuModule { diff --git a/src/app/shared/menu/menu.reducer.ts b/src/app/shared/menu/menu.reducer.ts index 47716849e2..b5726b8f9a 100644 --- a/src/app/shared/menu/menu.reducer.ts +++ b/src/app/shared/menu/menu.reducer.ts @@ -1,21 +1,29 @@ import { ActivateMenuSectionAction, - AddMenuSectionAction, DeactivateMenuSectionAction, + AddMenuSectionAction, + DeactivateMenuSectionAction, HideMenuSectionAction, MenuAction, MenuActionTypes, MenuSectionAction, RemoveMenuSectionAction, - ShowMenuSectionAction, ToggleActiveMenuSectionAction + ShowMenuSectionAction, + ToggleActiveMenuSectionAction } from './menu.actions'; -import { initialMenusState, MenuID, SectionType } from './initial-menus-state'; +import { initialMenusState, MenuID } from './initial-menus-state'; import { hasValue } from '../empty.util'; -import { SectionTypeModel } from './models/section-types/section-type.model'; +import { MenuItemModel } from './menu-item/models/menu-item.model'; +/** + * Represents the state of all menus in the store + */ export type MenusState = { [id in MenuID]: MenuState; } +/** + * Represents the state of a single menu in the store + */ export interface MenuState { id: MenuID; collapsed: boolean @@ -25,24 +33,39 @@ export interface MenuState { sectionToSubsectionIndex: MenuSectionIndex; } +/** + * Represents the a mapping of all sections to their subsections for a menu in the store + */ export interface MenuSectionIndex { [id: string]: string[] } +/** + * Represents the state of all menu sections in the store + */ export interface MenuSections { [id: string]: MenuSection; } +/** + * Represents the state of a single menu section in the store + */ export class MenuSection { id: string; parentID?: string; visible: boolean; active: boolean; - model: SectionTypeModel; + model: MenuItemModel; index?: number; icon?: string; } +/** + * Reducer that handles MenuActions to update the MenusState + * @param {MenusState} state The initial MenusState + * @param {MenuAction} action The Action to be performed on the state + * @returns {MenusState} The new, reducer MenusState + */ export function menusReducer(state: MenusState = initialMenusState, action: MenuAction): MenusState { const menuState: MenuState = state[action.menuID]; switch (action.type) { @@ -102,16 +125,29 @@ export function menusReducer(state: MenusState = initialMenusState, action: Menu } } +/** + * Add a section the a certain menu + * @param {MenusState} state The initial state + * @param {AddMenuSectionAction} action Action containing the new section and the menu's ID + * @returns {MenusState} The new reduced state + */ function addSection(state: MenusState, action: AddMenuSectionAction) { // let newState = addToIndex(state, action.section, action.menuID); const newState = putSectionState(state, action, action.section); return reorderSections(newState, action) } +/** + * Reorder all sections based on their index field + * @param {MenusState} state The initial state + * @param {MenuSectionAction} action Action containing the menu ID of the menu that is to be reordered + * @returns {MenusState} The new reduced state + */ function reorderSections(state: MenusState, action: MenuSectionAction) { const menuState: MenuState = state[action.menuID]; const newSectionState: MenuSections = {}; const newSectionIndexState: MenuSectionIndex = {}; + Object.values(menuState.sections).sort((sectionA: MenuSection, sectionB: MenuSection) => { const indexA = sectionA.index || 0; const indexB = sectionB.index || 0; @@ -130,6 +166,12 @@ function reorderSections(state: MenusState, action: MenuSectionAction) { return Object.assign({}, state, { [action.menuID]: newMenuState }); } +/** + * Remove a section from a certain menu + * @param {MenusState} state The initial state + * @param {RemoveMenuSectionAction} action Action containing the section ID and menu ID of the section that should be removed + * @returns {MenusState} The new reduced state + */ function removeSection(state: MenusState, action: RemoveMenuSectionAction) { const menuState: MenuState = state[action.menuID]; const id = action.id; @@ -139,6 +181,13 @@ function removeSection(state: MenusState, action: RemoveMenuSectionAction) { return Object.assign({}, newState, { [action.menuID]: newMenuState }); } +/** + * Remove a section from the index of a certain menu + * @param {MenusState} state The initial state + * @param {MenuSection} action The MenuSection of which the ID should be removed from the index + * @param {MenuID} action The Menu ID to which the section belonged + * @returns {MenusState} The new reduced state + */ function removeFromIndex(state: MenusState, section: MenuSection, menuID: MenuID) { const sectionID = section.id; const parentID = section.parentID; @@ -153,14 +202,32 @@ function removeFromIndex(state: MenusState, section: MenuSection, menuID: MenuID return state; } +/** + * Hide a certain section + * @param {MenusState} state The initial state + * @param {HideMenuSectionAction} action Action containing data to identify the section to be updated + * @returns {MenusState} The new reduced state + */ function hideSection(state: MenusState, action: HideMenuSectionAction) { return updateSectionState(state, action, { visible: false }); } +/** + * Show a certain section + * @param {MenusState} state The initial state + * @param {ShowMenuSectionAction} action Action containing data to identify the section to be updated + * @returns {MenusState} The new reduced state + */ function showSection(state: MenusState, action: ShowMenuSectionAction) { return updateSectionState(state, action, { visible: true }); } +/** + * Deactivate a certain section + * @param {MenusState} state The initial state + * @param {DeactivateMenuSectionAction} action Action containing data to identify the section to be updated + * @returns {MenusState} The new reduced state + */ function deactivateSection(state: MenusState, action: DeactivateMenuSectionAction) { const sectionState: MenuSection = state[action.menuID].sections[action.id]; if (hasValue(sectionState)) { @@ -168,6 +235,12 @@ function deactivateSection(state: MenusState, action: DeactivateMenuSectionActio } } +/** + * Activate a certain section + * @param {MenusState} state The initial state + * @param {DeactivateMenuSectionAction} action Action containing data to identify the section to be updated + * @returns {MenusState} The new reduced state + */ function activateSection(state: MenusState, action: ActivateMenuSectionAction) { const sectionState: MenuSection = state[action.menuID].sections[action.id]; if (hasValue(sectionState)) { @@ -175,6 +248,12 @@ function activateSection(state: MenusState, action: ActivateMenuSectionAction) { } } +/** + * Deactivate a certain section when it's currently active, activate a certain section when it's currently inactive + * @param {MenusState} state The initial state + * @param {DeactivateMenuSectionAction} action Action containing data to identify the section to be updated + * @returns {MenusState} The new reduced state + */ function toggleActiveSection(state: MenusState, action: ToggleActiveMenuSectionAction) { const sectionState: MenuSection = state[action.menuID].sections[action.id]; if (hasValue(sectionState)) { @@ -183,6 +262,13 @@ function toggleActiveSection(state: MenusState, action: ToggleActiveMenuSectionA return state; } +/** + * Add or replace a section in the state + * @param {MenusState} state The initial state + * @param {MenuAction} action The action which contains the menu ID of the menu of which the state is to be updated + * @param {MenuSection} section The section that will be added or replaced in the state + * @returns {MenusState} The new reduced state + */ function putSectionState(state: MenusState, action: MenuAction, section: MenuSection): MenusState { const menuState: MenuState = state[action.menuID]; const newSections = Object.assign({}, menuState.sections, { @@ -194,6 +280,13 @@ function putSectionState(state: MenusState, action: MenuAction, section: MenuSec return Object.assign({}, state, { [action.menuID]: newMenuState }); } +/** + * Update a section + * @param {MenusState} state The initial state + * @param {MenuSectionAction} action The action containing the menu ID and section ID + * @param {any} update A partial section that represents the part that should be updated in an existing section + * @returns {MenusState} The new reduced state + */ function updateSectionState(state: MenusState, action: MenuSectionAction, update: any): MenusState { const menuState: MenuState = state[action.menuID]; const sectionState = menuState.sections[action.id]; diff --git a/src/app/shared/menu/menu.service.ts b/src/app/shared/menu/menu.service.ts index 6c8846c6f9..152b3eb91c 100644 --- a/src/app/shared/menu/menu.service.ts +++ b/src/app/shared/menu/menu.service.ts @@ -44,10 +44,21 @@ export class MenuService { constructor(private store: Store) { } + /** + * Retrieve a menu's state by its ID + * @param {MenuID} id ID of the requested Menu + * @returns {Observable} Observable that emits the current state of the requested Menu + */ getMenu(id: MenuID): Observable { return this.store.pipe(select(menuByIDSelector(id))); } + /** + * Retrieve all top level sections of a certain menu + * @param {MenuID} menuID ID of the Menu + * @param {boolean} mustBeVisible True if you only want to request visible sections, false if you want to request all top level sections + * @returns {Observable} Observable that emits a list of MenuSections that are top sections of the given menu + */ getMenuTopSections(menuID: MenuID, mustBeVisible = true): Observable { return this.store.pipe( select(menuByIDSelector(menuID)), @@ -61,6 +72,13 @@ export class MenuService { ); } + /** + * Retrieve all sub level sections of a certain top section in a given menu + * @param {MenuID} menuID The ID of the menu + * @param {string} parentID The ID of the parent section + * @param {boolean} mustBeVisible True if you only want to request visible sections, false if you want to request all sections + * @returns {Observable} Observable that emits a list of MenuSections that are sub sections of the given menu and parent section + */ getSubSectionsByParentID(menuID: MenuID, parentID: string, mustBeVisible = true): Observable { return this.store.pipe( select(menuByIDSelector(menuID)), @@ -73,6 +91,12 @@ export class MenuService { ); } + /** + * Check if the a menu's top level section has subsections + * @param {MenuID} menuID The ID of the Menu + * @param {string} parentID The ID of the top level parent section + * @returns {Observable} Observable that emits true when the given parent section has sub sections, false if the given parent section does not have any sub sections + */ hasSubSections(menuID: MenuID, parentID: string): Observable { return this.store.pipe( select(menuByIDSelector(menuID)), @@ -81,6 +105,12 @@ export class MenuService { ); } + /** + * Retrieve a specific menu section by its menu ID and section ID + * @param {MenuID} menuID The ID of the menu the section resides in + * @param {string} sectionId The ID of the requested section + * @returns {Observable} Observable that emits the found MenuSection + */ getMenuSection(menuID: MenuID, sectionId: string): Observable { return this.store.pipe( select(menuByIDSelector(menuID)), @@ -88,76 +118,156 @@ export class MenuService { ); } + /** + * Add a new section to the store + * @param {MenuID} menuID The menu to which the new section is to be added + * @param {MenuSection} section The section to be added + */ addSection(menuID: MenuID, section: MenuSection) { this.store.dispatch(new AddMenuSectionAction(menuID, section)); } + /** + * Remove a section from the store + * @param {MenuID} menuID The menu from which the section is to be removed + * @param {string} sectionID The ID of the section that should be removed + */ removeSection(menuID: MenuID, sectionID: string) { this.store.dispatch(new RemoveMenuSectionAction(menuID, sectionID)); } + /** + * Check if a given menu is collapsed + * @param {MenuID} menuID The ID of the menu that is to be checked + * @returns {Observable} Emits true if the given menu is collapsed, emits falls when it's expanded + */ isMenuCollapsed(menuID: MenuID): Observable { return this.getMenu(menuID).pipe( map((state: MenuState) => state.collapsed) ); } + /** + * Check if a given menu's preview is collapsed + * @param {MenuID} menuID The ID of the menu that is to be checked + * @returns {Observable} Emits true if the given menu's preview is collapsed, emits falls when it's expanded + */ isMenuPreviewCollapsed(menuID: MenuID): Observable { return this.getMenu(menuID).pipe( map((state: MenuState) => state.previewCollapsed) ); } + /** + * Check if a given menu is visible + * @param {MenuID} menuID The ID of the menu that is to be checked + * @returns {Observable} Emits true if the given menu is visible, emits falls when it's hidden + */ isMenuVisible(menuID: MenuID): Observable { return this.getMenu(menuID).pipe( map((state: MenuState) => state.visible) ); } + /** + * Expands a given menu + * @param {MenuID} menuID The ID of the menu + */ expandMenu(menuID: MenuID): void { this.store.dispatch(new ExpandMenuAction(menuID)); } + /** + * Collapses a given menu + * @param {MenuID} menuID The ID of the menu + */ collapseMenu(menuID: MenuID): void { this.store.dispatch(new CollapseMenuAction(menuID)); } + /** + * Expands a given menu's preview + * @param {MenuID} menuID The ID of the menu + */ expandMenuPreview(menuID: MenuID): void { this.store.dispatch(new ExpandMenuPreviewAction(menuID)); } + /** + * Collapses a given menu's preview + * @param {MenuID} menuID The ID of the menu + */ collapseMenuPreview(menuID: MenuID): void { this.store.dispatch(new CollapseMenuPreviewAction(menuID)); } + /** + * Collapse a given menu when it's currently expanded or expand it when it's currently collapsed + * @param {MenuID} menuID The ID of the menu + */ toggleMenu(menuID: MenuID): void { this.store.dispatch(new ToggleMenuAction(menuID)); } + /** + * Show a given menu + * @param {MenuID} menuID The ID of the menu + */ showMenu(menuID: MenuID): void { this.store.dispatch(new ShowMenuAction(menuID)); } + /** + * Hide a given menu + * @param {MenuID} menuID The ID of the menu + */ hideMenu(menuID: MenuID): void { this.store.dispatch(new HideMenuAction(menuID)); } + /** + * Activate a given menu section when it's currently inactive or deactivate it when it's currently active + * @param {MenuID} menuID The ID of the menu + * @param {string} id The ID of the section + */ toggleActiveSection(menuID: MenuID, id: string): void { this.store.dispatch(new ToggleActiveMenuSectionAction(menuID, id)); } + /** + * Activate a given menu section + * @param {MenuID} menuID The ID of the menu + * @param {string} id The ID of the section + */ activateSection(menuID: MenuID, id: string): void { this.store.dispatch(new ActivateMenuSectionAction(menuID, id)); } + /** + * Deactivate a given menu section + * @param {MenuID} menuID The ID of the menu + * @param {string} id The ID of the section + */ deactivateSection(menuID: MenuID, id: string): void { this.store.dispatch(new DeactivateMenuSectionAction(menuID, id)); } + /** + * Check whether a given section is currently active or not + * @param {MenuID} menuID The ID of the Menu the section resides in + * @param {string} id The ID of the menu section to check + * @returns {Observable} Emits true when the given section is currently active, false when the given section is currently inactive + */ isSectionActive(menuID: MenuID, id: string): Observable { return this.getMenuSection(menuID, id).pipe(map((section) => section.active)); } + /** + * Check whether a given section is currently visible or not + * @param {MenuID} menuID The ID of the Menu the section resides in + * @param {string} id The ID of the menu section to check + * @returns {Observable} Emits true when the given section is currently visible, false when the given section is currently hidden + */ isSectionVisible(menuID: MenuID, id: string): Observable { return this.getMenuSection(menuID, id).pipe(map((section) => section.visible)); } diff --git a/src/app/shared/menu/models/section-types/altmetric.model.ts b/src/app/shared/menu/models/section-types/altmetric.model.ts deleted file mode 100644 index 36891b4c47..0000000000 --- a/src/app/shared/menu/models/section-types/altmetric.model.ts +++ /dev/null @@ -1,7 +0,0 @@ -import { SectionType } from '../../initial-menus-state'; -import { SectionTypeModel } from './section-type.model'; - -export class AltmetricSectionTypeModel implements SectionTypeModel { - type = SectionType.ALTMETRIC; - url: string; -} diff --git a/src/app/shared/menu/models/section-types/link.model.ts b/src/app/shared/menu/models/section-types/link.model.ts deleted file mode 100644 index 6bcc434c3d..0000000000 --- a/src/app/shared/menu/models/section-types/link.model.ts +++ /dev/null @@ -1,8 +0,0 @@ -import { SectionTypeModel } from './section-type.model'; -import { SectionType } from '../../initial-menus-state'; - -export class LinkSectionTypeModel implements SectionTypeModel { - type = SectionType.LINK; - text: string; - link: string; -} diff --git a/src/app/shared/menu/models/section-types/search.model.ts b/src/app/shared/menu/models/section-types/search.model.ts deleted file mode 100644 index b6e30a3d8e..0000000000 --- a/src/app/shared/menu/models/section-types/search.model.ts +++ /dev/null @@ -1,8 +0,0 @@ -import { SectionTypeModel } from './section-type.model'; -import { SectionType } from '../../initial-menus-state'; - -export class SearchSectionTypeModel implements SectionTypeModel { - type = SectionType.SEARCH; - placeholder: string; - action: string; -} diff --git a/src/app/shared/menu/models/section-types/section-type.model.ts b/src/app/shared/menu/models/section-types/section-type.model.ts deleted file mode 100644 index 1442396edd..0000000000 --- a/src/app/shared/menu/models/section-types/section-type.model.ts +++ /dev/null @@ -1,5 +0,0 @@ -import { SectionType } from '../../initial-menus-state'; - -export interface SectionTypeModel { - type: SectionType; -} diff --git a/src/app/shared/menu/models/section-types/text.model.ts b/src/app/shared/menu/models/section-types/text.model.ts deleted file mode 100644 index 641f06c937..0000000000 --- a/src/app/shared/menu/models/section-types/text.model.ts +++ /dev/null @@ -1,7 +0,0 @@ -import { SectionTypeModel } from './section-type.model'; -import { SectionType } from '../../initial-menus-state'; - -export class TextSectionTypeModel implements SectionTypeModel { - type = SectionType.TEXT; - text: string; -} diff --git a/src/app/shared/menu/type-components/link-type.component.ts b/src/app/shared/menu/type-components/link-type.component.ts deleted file mode 100644 index 165bb5bc10..0000000000 --- a/src/app/shared/menu/type-components/link-type.component.ts +++ /dev/null @@ -1,16 +0,0 @@ -import { Component, Inject, Input } from '@angular/core'; -import { LinkSectionTypeModel } from '../models/section-types/link.model'; -import { SectionType } from '../initial-menus-state'; -import { rendersSectionForType } from '../menu-section.decorator'; - -@Component({ - selector: 'ds-link-type-menu-item', - templateUrl: './link-type.component.html' -}) -@rendersSectionForType(SectionType.LINK) -export class LinkTypeMenuItemComponent { - @Input() item: LinkSectionTypeModel; - constructor(@Inject('itemModelProvider') item) { - this.item = item; - } -} diff --git a/src/app/shared/menu/type-components/text-type.component.ts b/src/app/shared/menu/type-components/text-type.component.ts deleted file mode 100644 index c4bd67b289..0000000000 --- a/src/app/shared/menu/type-components/text-type.component.ts +++ /dev/null @@ -1,16 +0,0 @@ -import { Component, Inject, Input } from '@angular/core'; -import { TextSectionTypeModel } from '../models/section-types/text.model'; -import { SectionType } from '../initial-menus-state'; -import { rendersSectionForType } from '../menu-section.decorator'; - -@Component({ - selector: 'ds-text-type-menu-item', - templateUrl: './text-type.component.html', -}) -@rendersSectionForType(SectionType.TEXT) -export class TextTypeMenuItemComponent { - @Input() item: TextSectionTypeModel; - constructor(@Inject('itemModelProvider') item) { - this.item = item; - } -}