62589: Feedback improvements and fixes

src/app/shared/object-select/collection-select/collection-select.component.html

@@ -24,5 +24,9 @@
       </table>
     </div>
   </ds-pagination>
-  <button class="btn btn-outline-secondary collection-confirm" (click)="confirmSelected()">{{confirmButton | translate}}</button>
+  <div>
+    <button class="btn btn-outline-secondary collection-cancel float-left" (click)="onCancel()">{{cancelButton | translate}}</button>
+    <button *ngIf="dangerConfirm" class="btn btn-danger collection-confirm float-right" (click)="confirmSelected()">{{confirmButton | translate}}</button>
+    <button *ngIf="!dangerConfirm" class="btn btn-primary collection-confirm float-right" (click)="confirmSelected()">{{confirmButton | translate}}</button>
+  </div>
 </ng-container>

src/app/shared/object-select/item-select/item-select.component.html

@@ -28,5 +28,9 @@
       </table>
     </div>
   </ds-pagination>
-  <button class="btn btn-outline-secondary item-confirm" (click)="confirmSelected()">{{confirmButton | translate}}</button>
+  <div>
+    <button class="btn btn-outline-secondary item-cancel float-left" (click)="onCancel()">{{cancelButton | translate}}</button>
+    <button *ngIf="dangerConfirm" class="btn btn-danger item-confirm float-right" (click)="confirmSelected()">{{confirmButton | translate}}</button>
+    <button *ngIf="!dangerConfirm" class="btn btn-primary item-confirm float-right" (click)="confirmSelected()">{{confirmButton | translate}}</button>
+  </div>
 </ng-container>

src/app/shared/object-select/item-select/item-select.component.ts

@@ -1,4 +1,4 @@
-import { Component} from '@angular/core';
+import { Component, Input } from '@angular/core';
 import { Item } from '../../../core/shared/item.model';
 import { ObjectSelectService } from '../object-select.service';
 import { ObjectSelectComponent } from '../object-select/object-select.component';
@@ -14,6 +14,12 @@ import { isNotEmpty } from '../../empty.util';
  */
 export class ItemSelectComponent extends ObjectSelectComponent<Item> {
 
+  /**
+   * Whether or not to hide the collection column
+   */
+  @Input()
+  hideCollection = false;
+
   constructor(protected objectSelectService: ObjectSelectService) {
     super(objectSelectService);
   }

src/app/shared/object-select/object-select/object-select.component.ts

@@ -12,6 +12,9 @@ import { SortOptions } from '../../../core/cache/models/sort-options.model';
  */
 export abstract class ObjectSelectComponent<TDomain> implements OnInit, OnDestroy {
 
+  /**
+   * A unique key used for the object select service
+   */
   @Input()
   key: string;
 
@@ -40,8 +43,18 @@ export abstract class ObjectSelectComponent<TDomain> implements OnInit, OnDestro
   @Input()
   confirmButton: string;
 
+  /**
+   * The message key used for the cancel button
+   * @type {string}
+   */
   @Input()
-  hideCollection = false;
+  cancelButton: string;
+
+  /**
+   * An event fired when the cancel button is clicked
+   */
+  @Output()
+  cancel = new EventEmitter<any>();
 
   /**
    * EventEmitter to return the selected UUIDs when the confirm button is pressed
@@ -50,6 +63,13 @@ export abstract class ObjectSelectComponent<TDomain> implements OnInit, OnDestro
   @Output()
   confirm: EventEmitter<string[]> = new EventEmitter<string[]>();
 
+  /**
+   * Whether or not to render the confirm button as danger (for example if confirm deletes objects)
+   * Defaults to false
+   */
+  @Input()
+  dangerConfirm = false;
+
   /**
    * The list of selected UUIDs
    */
@@ -96,4 +116,11 @@ export abstract class ObjectSelectComponent<TDomain> implements OnInit, OnDestro
     });
   }
 
+  /**
+   * Fire a cancel event
+   */
+  onCancel() {
+    this.cancel.emit();
+  }
+
 }