Merged in DSC-472 (pull request DSpace#141)

DSC-472

Approved-by: Giuseppe Digilio

Author: Sufiyan Shaikh

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>

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();

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.
@@ -50,14 +51,22 @@ export class ContextMenuComponent implements OnInit {
    */
   public objectInjector: Injector;
 
+  /**
+   * context menu options count.
+   * @type {number}
+   */
+  public optionCount = 0;
+
   /**
    * 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>
@@ -124,4 +133,17 @@ export class ContextMenuComponent implements OnInit {
   isItem(): boolean {
     return this.contextMenuObjectType === DSpaceObjectType.ITEM;
   }
+
+  ngAfterViewChecked() {
+    // To check that Context-menu contains options or not
+    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 => {
+          this.optionCount += element.childElementCount;
+        });
+      }
+    }
+  }
 }