Merge pull request #1885 from mspalti/entity-thumbnail

Removed thumbnails from relationship modal

Author: tdonohue

src/app/item-page/edit-item-page/virtual-metadata/virtual-metadata.component.html

@@ -1,4 +1,4 @@
-<div>
+<div [ngClass]="showThumbnails ? 'hide-modal-thumbnail-column' : ''">
     <div class="modal-header">{{'virtual-metadata.delete-relationship.modal-head' | translate}}
         <button type="button" class="close" (click)="close.emit()" aria-label="Close">
             <span aria-hidden="true">×</span>

src/app/item-page/edit-item-page/virtual-metadata/virtual-metadata.component.spec.ts

@@ -7,6 +7,8 @@ import { VirtualMetadataComponent } from './virtual-metadata.component';
 import { Item } from '../../../core/shared/item.model';
 import { ObjectUpdatesService } from '../../../core/data/object-updates/object-updates.service';
 import { VarDirective } from '../../../shared/utils/var.directive';
+import { APP_CONFIG } from '../../../../config/app-config.interface';
+import { environment } from '../../../../environments/environment';
 
 describe('VirtualMetadataComponent', () => {
 
@@ -46,6 +48,7 @@ describe('VirtualMetadataComponent', () => {
       declarations: [VirtualMetadataComponent, VarDirective],
       providers: [
         { provide: ObjectUpdatesService, useValue: objectUpdatesService },
+        { provide: APP_CONFIG, useValue: environment }
       ], schemas: [
         NO_ERRORS_SCHEMA
       ]

src/app/item-page/edit-item-page/virtual-metadata/virtual-metadata.component.ts

@@ -1,8 +1,9 @@
-import {Component, EventEmitter, Input, OnInit, Output} from '@angular/core';
+import { Component, EventEmitter, Inject, Input, OnInit, Output } from '@angular/core';
 import {Observable} from 'rxjs';
 import {Item} from '../../../core/shared/item.model';
 import {MetadataValue} from '../../../core/shared/metadata.models';
 import {ObjectUpdatesService} from '../../../core/data/object-updates/object-updates.service';
+import { APP_CONFIG, AppConfig } from '../../../../config/app-config.interface';
 
 @Component({
   selector: 'ds-virtual-metadata',
@@ -45,6 +46,12 @@ export class VirtualMetadataComponent implements OnInit {
    */
   @Output() save = new EventEmitter();
 
+  /**
+   * Indicates when thumbnails are required by configuration and therefore
+   * need to be hidden in the modal layout.
+   */
+  showThumbnails: boolean;
+
   /**
    * Get an array of the left and the right item of the relationship to be deleted.
    */
@@ -56,7 +63,9 @@ export class VirtualMetadataComponent implements OnInit {
 
   constructor(
     protected objectUpdatesService: ObjectUpdatesService,
+    @Inject(APP_CONFIG) protected appConfig: AppConfig,
   ) {
+    this.showThumbnails = this.appConfig.browseBy.showThumbnails;
   }
 
   /**

src/styles/_global-styles.scss

@@ -138,6 +138,29 @@ ds-dynamic-form-control-container.d-none {
 .btn-dark {
   background-color: var(--ds-admin-sidebar-bg);
 }
+
+.preserve-line-breaks {
+  white-space: pre-line;
+}
+
+/* Thumbnail styles */
+.hide-placeholder-text {
+  .thumbnail-placeholder {
+    color: transparent !important;
+  }
+}
+
+/* Used to hide the thumbnail column in modals. */
+.hide-modal-thumbnail-column {
+  .modal-body ds-listable-object-component-loader div.row > div:first-child {
+    display: none;
+  }
+  .modal-body ds-listable-object-component-loader div.row > div:nth-child(2) {
+    flex: 0 0 100%;
+    max-width: 100%;
+  }
+}
+
 /* The font sizes used in "no thumbnail" placeholder */
 .thumb-font-0 {
   .thumbnail-placeholder {
@@ -153,13 +176,6 @@ ds-dynamic-form-control-container.d-none {
     padding: 0.1rem;
   }
 }
-
-.hide-placeholder-text {
-  .thumbnail-placeholder {
-    color: transparent !important;
-  }
-}
-
 .thumb-font-1 {
   .thumbnail-placeholder {
     @media screen and (max-width: map-get($grid-breakpoints, sm)) {
@@ -170,7 +186,7 @@ ds-dynamic-form-control-container.d-none {
       font-size: 0.4rem;
       padding: 0.1rem;
     }
-    font-size: 0.6rem;
+    font-size: 0.5rem;
     padding: 0.125rem;
   }
 }
@@ -187,6 +203,4 @@ ds-dynamic-form-control-container.d-none {
   }
 }
 
-.preserve-line-breaks {
-  white-space: pre-line;
-}
+