From e66192172a9f19820f3617933412f7edb4d2374e Mon Sep 17 00:00:00 2001
From: "konstantina.galouni" <kgalouni@di.uoa.gr>
Date: Tue, 10 Sep 2024 02:07:04 +0300
Subject: [PATCH] [develop | DONE | FIXED]: navigationBar.component.ts: Added a
 class field public isClient: boolean = false; and set it in constructor with
 "this.isClient = !isPlatformServer(this.platform);" statement |
 navigationBar.component.html: Added checks not to display dropdowns on server
 (needed also for non destructive hydration).

---
 sharedComponents/navigationBar.component.html |  4 ++--
 sharedComponents/navigationBar.component.ts   | 11 ++++++++---
 2 files changed, 10 insertions(+), 5 deletions(-)

diff --git a/sharedComponents/navigationBar.component.html b/sharedComponents/navigationBar.component.html
index a0147369..8b90121a 100644
--- a/sharedComponents/navigationBar.component.html
+++ b/sharedComponents/navigationBar.component.html
@@ -220,7 +220,7 @@
                       <a *ngIf="(menu.route.length == 0 && menu.url.length == 0) || ( menu.route.length >0 && menu.routeRequired && !isEnabled([menu.route], showPage) && isAtleastOneEnabled(menu.routeRequired, showPage))">
                         <span *ngIf="menu.badge" class="badge">{{menu.badge}}</span>
                         {{menu.title}}</a>
-                      <div *ngIf="menu.items.length > 0" class="uk-navbar-dropdown uk-navbar-dropdown-bottom-left uk-height-max-medium uk-overflow-auto">
+                      <div *ngIf="menu.items.length > 0 && isClient" class="uk-navbar-dropdown uk-navbar-dropdown-bottom-left uk-height-max-medium uk-overflow-auto">
                         <!-- Do not delete this div, because it will remove the margin bottom of navbar -->
                         <div>
                           <ul class="uk-nav uk-navbar-dropdown-nav">
@@ -272,7 +272,7 @@
                         <a *ngIf="menu.type == 'noAction'">
                           {{menu.title}}
                         </a>
-                        <div *ngIf="menu.items.length > 0" class="uk-navbar-dropdown uk-navbar-dropdown-bottom-left uk-height-max-medium uk-overflow-auto"
+                        <div *ngIf="menu.items.length > 0 && isClient" class="uk-navbar-dropdown uk-navbar-dropdown-bottom-left uk-height-max-medium uk-overflow-auto"
                              style="top: 80px; left: 0px;" id="{{menu._id}}" uk-toggle>
                           <div>
                             <ul class="uk-nav uk-navbar-dropdown-nav">
diff --git a/sharedComponents/navigationBar.component.ts b/sharedComponents/navigationBar.component.ts
index bffc64f1..a0657c2b 100644
--- a/sharedComponents/navigationBar.component.ts
+++ b/sharedComponents/navigationBar.component.ts
@@ -1,10 +1,10 @@
 import {
   ChangeDetectorRef,
-  Component, ElementRef,
+  Component, ElementRef, Inject,
   Input,
   OnChanges,
   OnDestroy,
-  OnInit, QueryList,
+  OnInit, PLATFORM_ID,
   SimpleChanges, ViewChild,
   ViewChildren
 } from '@angular/core';
@@ -21,6 +21,7 @@ import {NotificationConfiguration} from "../notifications/notifications-sidebar/
 import {SearchInputComponent} from "./search-input/search-input.component";
 import {Filter} from "../searchPages/searchUtils/searchHelperClasses.class";
 import {RouterHelper} from "../utils/routerHelper.class";
+import {isPlatformServer} from "@angular/common";
 
 declare var UIkit;
 
@@ -97,12 +98,16 @@ export class NavigationBarComponent implements OnInit, OnDestroy, OnChanges {
   @ViewChild('canvas') canvas: ElementRef;
   public routerHelper: RouterHelper = new RouterHelper();
 
+  public isClient: boolean = false;
   constructor(private router: Router,
               private  route: ActivatedRoute,
               private config: ConfigurationService,
 							private _helpContentService: HelpContentService,
               private layoutService: LayoutService,
-              private cdr: ChangeDetectorRef) {}
+              private cdr: ChangeDetectorRef,
+              @Inject(PLATFORM_ID) private platform: any) {
+    this.isClient = !isPlatformServer(this.platform);
+  }
 
   ngOnInit() {
     this.subs.push(this.route.queryParams.subscribe(params => {