From 7194349bf77579c650c714cbefe99e219eedb2df Mon Sep 17 00:00:00 2001
From: Sufiyan Shaikh <sufiyan.shaikh@peerbits.com>
Date: Fri, 4 Mar 2022 12:05:25 +0530
Subject: [PATCH 1/4] [DSC-472] Empty contextual menu

---
 .../context-menu/context-menu.component.html      |  3 +++
 .../shared/context-menu/context-menu.component.ts | 15 +++++++++++++++
 src/assets/i18n/en.json5                          |  2 ++
 3 files changed, 20 insertions(+)

diff --git a/src/app/shared/context-menu/context-menu.component.html b/src/app/shared/context-menu/context-menu.component.html
index 6be0ad5c449..15a0075da46 100644
--- a/src/app/shared/context-menu/context-menu.component.html
+++ b/src/app/shared/context-menu/context-menu.component.html
@@ -11,6 +11,9 @@ <h6 class="dropdown-header">{{'context-menu.actions.label' | translate}}</h6>
       <ng-container *ngFor="let entry of (getContextMenuEntries() | async)">
         <ng-container *ngComponentOutlet="entry; injector: objectInjector;"></ng-container>
       </ng-container>
+      <label class="dropdown-item" *ngIf="optionCount === 0">
+        {{'context-menu.actions.no-options-available' | translate}}
+      </label>
     </div>
   </div>
 
diff --git a/src/app/shared/context-menu/context-menu.component.ts b/src/app/shared/context-menu/context-menu.component.ts
index 29e74d2b2cd..7afd565b67c 100644
--- a/src/app/shared/context-menu/context-menu.component.ts
+++ b/src/app/shared/context-menu/context-menu.component.ts
@@ -50,6 +50,12 @@ export class ContextMenuComponent implements OnInit {
    */
   public objectInjector: Injector;
 
+  /**
+   * context menu options count.
+   * @type {number}
+   */
+  public optionCount = 0;
+
   /**
    * Initialize instance variables
    *
@@ -124,4 +130,13 @@ export class ContextMenuComponent implements OnInit {
   isItem(): boolean {
     return this.contextMenuObjectType === DSpaceObjectType.ITEM;
   }
+
+  ngAfterViewChecked() {
+    // To check that Context-menu contains options or not
+    const el = Array.from(document.getElementById('itemOptionsDropdownMenu').getElementsByClassName('ng-star-inserted'));
+    this.optionCount = 0;
+    el.forEach(element => {
+      this.optionCount += element.childElementCount;
+    });
+  }
 }
diff --git a/src/assets/i18n/en.json5 b/src/assets/i18n/en.json5
index d49002e527c..a4049953137 100644
--- a/src/assets/i18n/en.json5
+++ b/src/assets/i18n/en.json5
@@ -1415,6 +1415,8 @@
 
   "context-menu.actions.label": "Options",
 
+  "context-menu.actions.no-options-available": "No Options Available",
+
   "context-menu.actions.edit-item.btn.FULL": "Edit all the details",
 
   "context-menu.actions.edit-item.btn.OWNER": "Edit",

From c3f78de9d2c1313ec1546362ada73f412fe8aa34 Mon Sep 17 00:00:00 2001
From: Sufiyan Shaikh <sufiyan.shaikh@peerbits.com>
Date: Fri, 4 Mar 2022 20:05:25 +0530
Subject: [PATCH 2/4] [DSC-472] Empty contextual menu

---
 .../shared/context-menu/context-menu.component.html    |  6 ++----
 src/app/shared/context-menu/context-menu.component.ts  | 10 ++++++----
 src/assets/i18n/en.json5                               |  2 --
 3 files changed, 8 insertions(+), 10 deletions(-)

diff --git a/src/app/shared/context-menu/context-menu.component.html b/src/app/shared/context-menu/context-menu.component.html
index 15a0075da46..70c948a3b42 100644
--- a/src/app/shared/context-menu/context-menu.component.html
+++ b/src/app/shared/context-menu/context-menu.component.html
@@ -2,7 +2,8 @@
   <ng-container *ngFor="let entry of (getStandAloneMenuEntries() | async)">
     <ng-container *ngComponentOutlet="entry; injector: objectInjector;"></ng-container>
   </ng-container>
-  <div ngbDropdown #itemOptions="ngbDropdown" placement="bottom-right" class="d-inline-block float-right ml-1">
+  <div ngbDropdown #itemOptions="ngbDropdown" placement="bottom-right"
+       class="float-right ml-1" [ngClass]="optionCount === 0 ? 'd-none' : 'd-inline-block'">
     <button class="btn btn-outline-primary" id="context-menu" ngbDropdownToggle>
       <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
     </button>
@@ -11,9 +12,6 @@ <h6 class="dropdown-header">{{'context-menu.actions.label' | translate}}</h6>
       <ng-container *ngFor="let entry of (getContextMenuEntries() | async)">
         <ng-container *ngComponentOutlet="entry; injector: objectInjector;"></ng-container>
       </ng-container>
-      <label class="dropdown-item" *ngIf="optionCount === 0">
-        {{'context-menu.actions.no-options-available' | translate}}
-      </label>
     </div>
   </div>
 
diff --git a/src/app/shared/context-menu/context-menu.component.ts b/src/app/shared/context-menu/context-menu.component.ts
index 7afd565b67c..0de17f9d00b 100644
--- a/src/app/shared/context-menu/context-menu.component.ts
+++ b/src/app/shared/context-menu/context-menu.component.ts
@@ -133,10 +133,12 @@ export class ContextMenuComponent implements OnInit {
 
   ngAfterViewChecked() {
     // To check that Context-menu contains options or not
-    const el = Array.from(document.getElementById('itemOptionsDropdownMenu').getElementsByClassName('ng-star-inserted'));
+    const el = Array.from(document.getElementById('itemOptionsDropdownMenu')?.getElementsByClassName('ng-star-inserted'));
     this.optionCount = 0;
-    el.forEach(element => {
-      this.optionCount += element.childElementCount;
-    });
+    if (el) {
+      el.forEach(element => {
+        this.optionCount += element.childElementCount;
+      });
+    }
   }
 }
diff --git a/src/assets/i18n/en.json5 b/src/assets/i18n/en.json5
index a4049953137..d49002e527c 100644
--- a/src/assets/i18n/en.json5
+++ b/src/assets/i18n/en.json5
@@ -1415,8 +1415,6 @@
 
   "context-menu.actions.label": "Options",
 
-  "context-menu.actions.no-options-available": "No Options Available",
-
   "context-menu.actions.edit-item.btn.FULL": "Edit all the details",
 
   "context-menu.actions.edit-item.btn.OWNER": "Edit",

From d27fdfac6cc8cc14a7723e2c2e479ed39e8a71b3 Mon Sep 17 00:00:00 2001
From: Sufiyan Shaikh <sufiyan.shaikh@peerbits.com>
Date: Tue, 8 Mar 2022 19:37:49 +0530
Subject: [PATCH 3/4] [DSC-472] Automated Test cases

---
 .../context-menu.component.spec.ts            | 36 +++++++++++++++++++
 .../context-menu/context-menu.component.ts    | 14 ++++----
 2 files changed, 44 insertions(+), 6 deletions(-)

diff --git a/src/app/shared/context-menu/context-menu.component.spec.ts b/src/app/shared/context-menu/context-menu.component.spec.ts
index 1257c870d1c..4a6679ba35f 100644
--- a/src/app/shared/context-menu/context-menu.component.spec.ts
+++ b/src/app/shared/context-menu/context-menu.component.spec.ts
@@ -146,6 +146,18 @@ describe('ContextMenuComponent', () => {
       done();
     });
 
+    it('should display d-none', (done) => {
+      const menu = fixture.debugElement.query(By.css('div.d-none'));
+      expect(menu).not.toBeNull();
+      done();
+    });
+
+    it('should not display d-inline-block', (done) => {
+      const menu = fixture.debugElement.query(By.css('div.d-inline-block'));
+      expect(menu).toBeNull();
+      done();
+    });
+
     it('should display stand alone buttons', (done) => {
       const menu = fixture.debugElement.query(By.css('button.btn-primary'));
       expect(menu).not.toBeNull();
@@ -203,6 +215,18 @@ describe('ContextMenuComponent', () => {
         done();
       });
 
+      it('should display d-none', (done) => {
+        const menu = fixture.debugElement.query(By.css('div.d-none'));
+        expect(menu).not.toBeNull();
+        done();
+      });
+
+      it('should not display d-inline-block', (done) => {
+        const menu = fixture.debugElement.query(By.css('div.d-inline-block'));
+        expect(menu).toBeNull();
+        done();
+      });
+
       it('should not display stand alone buttons', (done) => {
         const menu = fixture.debugElement.query(By.css('button.btn-primary'));
         expect(menu).not.toBeNull();
@@ -232,6 +256,18 @@ describe('ContextMenuComponent', () => {
         done();
       });
 
+      it('should display d-inline-block', (done) => {
+        const menu = fixture.debugElement.query(By.css('div.d-inline-block'));
+        expect(menu).toBeNull();
+        done();
+      });
+
+      it('should not display d-none', (done) => {
+        const menu = fixture.debugElement.query(By.css('div.d-none'));
+        expect(menu).toBeNull();
+        done();
+      });
+
       it('should check the authorization of the current user', (done) => {
         expect(component.isAuthenticated).toBeObservable(cold('a', { a: false }));
         done();
diff --git a/src/app/shared/context-menu/context-menu.component.ts b/src/app/shared/context-menu/context-menu.component.ts
index 0de17f9d00b..3403d7363cc 100644
--- a/src/app/shared/context-menu/context-menu.component.ts
+++ b/src/app/shared/context-menu/context-menu.component.ts
@@ -133,12 +133,14 @@ export class ContextMenuComponent implements OnInit {
 
   ngAfterViewChecked() {
     // To check that Context-menu contains options or not
-    const el = Array.from(document.getElementById('itemOptionsDropdownMenu')?.getElementsByClassName('ng-star-inserted'));
-    this.optionCount = 0;
-    if (el) {
-      el.forEach(element => {
-        this.optionCount += element.childElementCount;
-      });
+    if (document.getElementById('itemOptionsDropdownMenu')) {
+      const el = Array.from(document.getElementById('itemOptionsDropdownMenu')?.getElementsByClassName('ng-star-inserted'));
+      this.optionCount = 0;
+      if (el) {
+        el.forEach(element => {
+          this.optionCount += element.childElementCount;
+        });
+      }
     }
   }
 }

From 87c9d4651681f267993b315d3a2ea3b113643ebc Mon Sep 17 00:00:00 2001
From: Giuseppe Digilio <giuseppe.digilio@4science.it>
Date: Wed, 6 Apr 2022 16:38:11 +0200
Subject: [PATCH 4/4] [DSC-472] Replace document object with inject token

---
 src/app/shared/context-menu/context-menu.component.ts | 9 ++++++---
 1 file changed, 6 insertions(+), 3 deletions(-)

diff --git a/src/app/shared/context-menu/context-menu.component.ts b/src/app/shared/context-menu/context-menu.component.ts
index 3403d7363cc..2c08a2b5f20 100644
--- a/src/app/shared/context-menu/context-menu.component.ts
+++ b/src/app/shared/context-menu/context-menu.component.ts
@@ -1,4 +1,4 @@
-import { Component, Injector, Input, OnInit } from '@angular/core';
+import { Component, Inject, Injector, Input, OnInit } from '@angular/core';
 
 import { select, Store } from '@ngrx/store';
 import { from, Observable } from 'rxjs';
@@ -17,6 +17,7 @@ import { ContextMenuEntryType } from './context-menu-entry-type';
 import { isNotEmpty } from '../empty.util';
 import { ConfigurationDataService } from '../../core/data/configuration-data.service';
 import { GenericConstructor } from '../../core/shared/generic-constructor';
+import { DOCUMENT } from '@angular/common';
 
 /**
  * This component renders a context menu for a given DSO.
@@ -59,11 +60,13 @@ export class ContextMenuComponent implements OnInit {
   /**
    * Initialize instance variables
    *
+   * @param {Document} _document
    * @param {ConfigurationDataService} configurationService
    * @param {Injector} injector
    * @param {Store<CoreState>} store
    */
   constructor(
+    @Inject(DOCUMENT) private _document: Document,
     private configurationService: ConfigurationDataService,
     private injector: Injector,
     private store: Store<CoreState>
@@ -133,8 +136,8 @@ export class ContextMenuComponent implements OnInit {
 
   ngAfterViewChecked() {
     // To check that Context-menu contains options or not
-    if (document.getElementById('itemOptionsDropdownMenu')) {
-      const el = Array.from(document.getElementById('itemOptionsDropdownMenu')?.getElementsByClassName('ng-star-inserted'));
+    if (this._document.getElementById('itemOptionsDropdownMenu')) {
+      const el = Array.from(this._document.getElementById('itemOptionsDropdownMenu')?.getElementsByClassName('ng-star-inserted'));
       this.optionCount = 0;
       if (el) {
         el.forEach(element => {