chore: update to ngx-edu-sharing-wlo-pages v0.1.26 (different filterb…

…ar options + more generic side-menu-wrapper) feat: adjust right side menu to the changed components
openeduhub · Nov 8, 2024 · 902ba4c · 902ba4c
1 parent 7c53c99
commit 902ba4c
Show file tree

Hide file tree

Showing 4 changed files with 34 additions and 23 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -48,7 +48,7 @@
     "ngx-colors": "^3.5.3",
     "ngx-edu-sharing-api": "^9999.0.2",
     "ngx-edu-sharing-ui": "^9999.0.4",
-    "ngx-edu-sharing-wlo-pages": "^0.1.25",
+    "ngx-edu-sharing-wlo-pages": "^0.1.26",
     "ngx-slick-carousel": "^17.0.0",
     "rxjs": "^7.0.0",
     "slick-carousel": "^1.8.1",

diff --git a/src/app/wlo-search/template/template.component.html b/src/app/wlo-search/template/template.component.html
@@ -52,27 +52,27 @@
     (closeContentView)="selectedMenuItem = ''"
   >
     <ng-container slot="menu">
-      <wlo-collapsible-menu-item
+      <wlo-side-menu-item
+        [icon]="'person'"
         [selectedMenuItem]="selectedMenuItem"
         [title]="menuItems.profiling"
-        [icon]="'person'"
-        (nestedComponentChange)="selectedMenuItem = $event"
-      ></wlo-collapsible-menu-item>
-      <wlo-collapsible-menu-item
+        (itemClicked)="collapsibleItemClicked($event)"
+      ></wlo-side-menu-item>
+      <wlo-side-menu-item
         [selectedMenuItem]="selectedMenuItem"
         [title]="menuItems.topicTree"
-        (nestedComponentChange)="selectedMenuItem = $event"
-      ></wlo-collapsible-menu-item>
-      <wlo-collapsible-menu-item
+        (itemClicked)="collapsibleItemClicked($event)"
+      ></wlo-side-menu-item>
+      <wlo-side-menu-item
         [selectedMenuItem]="selectedMenuItem"
         [title]="menuItems.statistics"
-        (nestedComponentChange)="selectedMenuItem = $event"
-      ></wlo-collapsible-menu-item>
-      <wlo-collapsible-menu-item
+        (itemClicked)="collapsibleItemClicked($event)"
+      ></wlo-side-menu-item>
+      <wlo-side-menu-item
         [selectedMenuItem]="selectedMenuItem"
         [title]="menuItems.feedback"
-        (nestedComponentChange)="selectedMenuItem = $event"
-      ></wlo-collapsible-menu-item>
+        (itemClicked)="collapsibleItemClicked($event)"
+      ></wlo-side-menu-item>
     </ng-container>
     <ng-container slot="content">
       <ng-container *ngIf="selectedMenuItem === menuItems.profiling">

diff --git a/src/app/wlo-search/template/template.component.ts b/src/app/wlo-search/template/template.component.ts
@@ -23,8 +23,8 @@ import { SearchResultNode } from 'ngx-edu-sharing-api/lib/api/models/search-resu
 import { Value } from 'ngx-edu-sharing-api/lib/api/models/value';
 import { EduSharingUiCommonModule, SpinnerComponent } from 'ngx-edu-sharing-ui';
 import {
-    CollapsibleMenuItemComponent,
     FilterBarComponent,
+    SideMenuItemComponent,
     SideMenuWrapperComponent,
     StatisticChart,
     StatisticsSummaryComponent,
@@ -83,11 +83,11 @@ import { Swimlane } from './swimlane/swimlane';
     imports: [
         AddSwimlaneBorderButtonComponent,
         CdkDragHandle,
-        CollapsibleMenuItemComponent,
         EduSharingUiCommonModule,
         FilterBarComponent,
         SearchModule,
         SharedModule,
+        SideMenuItemComponent,
         SideMenuWrapperComponent,
         SpinnerComponent,
         StatisticsSummaryComponent,
@@ -1016,6 +1016,17 @@ export class TemplateComponent implements OnInit {
         });
     }
 
+    /**
+     * Function to call on wlo-side-menu-item itemClicked output.
+     */
+    collapsibleItemClicked(item: string) {
+        if (this.selectedMenuItem === item) {
+            this.selectedMenuItem = '';
+        } else {
+            this.selectedMenuItem = item;
+        }
+    }
+
     // https://stackoverflow.com/a/16348977
     stringToColour(str: string) {
         let hash = 0;