[DSC-1634] port file type badge

Author: FrancescoMolinaro

src/app/submission/sections/upload/accessConditions/submission-section-upload-access-conditions.component.ts

@@ -4,7 +4,7 @@ import { find } from 'rxjs/operators';
 
 import { GroupDataService } from '../../../../core/eperson/group-data.service';
 import { ResourcePolicy } from '../../../../core/resource-policy/models/resource-policy.model';
-import { isEmpty } from '../../../../shared/empty.util';
+import { hasValue, isEmpty } from '../../../../shared/empty.util';
 import { Group } from '../../../../core/eperson/models/group.model';
 import { RemoteData } from '../../../../core/data/remote-data';
 import { DSONameService } from '../../../../core/breadcrumbs/dso-name.service';
@@ -41,7 +41,7 @@ export class SubmissionSectionUploadAccessConditionsComponent implements OnInit
    */
   ngOnInit() {
     this.accessConditions.forEach((accessCondition: ResourcePolicy) => {
-      if (isEmpty(accessCondition.name)) {
+      if (isEmpty(accessCondition.name) && hasValue(accessCondition._links?.group.href)) {
         this.groupService.findByHref(accessCondition._links.group.href).pipe(
           find((rd: RemoteData<Group>) => !rd.isResponsePending && rd.hasSucceeded))
           .subscribe((rd: RemoteData<Group>) => {

src/app/submission/sections/upload/file/section-upload-file.component.html

@@ -1,8 +1,13 @@
 <ng-container *ngIf="fileData">
   <div class="row">
     <div class="col-md-12">
-      <div class="float-left w-75">
-        <h3>{{fileName}} <span class="text-muted">({{fileData?.sizeBytes | dsFileSize}})</span></h3>
+      <div class="float-left ml-3 mb-2 badge badge-pill bg-primary text-white" *ngIf="(vocabularyFileType$ | async)">
+        {{(vocabularyFileType$ | async)}}
+      </div>
+    </div>
+    <div class="col-md-12">
+      <div class="float-left w-75 pl-3">
+        <h4>{{fileName}} <span class="text-secondary">({{fileData?.sizeBytes | dsFileSize}})</span></h4>
       </div>
       <div *ngIf="!readOnly" class="float-right w-15">
         <ng-container>

src/app/submission/sections/upload/file/section-upload-file.component.spec.ts

@@ -3,7 +3,7 @@ import { ComponentFixture, inject, TestBed, waitForAsync } from '@angular/core/t
 import { BrowserModule, By } from '@angular/platform-browser';
 import { CommonModule } from '@angular/common';
 
-import { of, of as observableOf } from 'rxjs';
+import { EMPTY, of, of as observableOf } from 'rxjs';
 import { TranslateModule } from '@ngx-translate/core';
 
 import { FormService } from '../../../../shared/form/form.service';
@@ -32,6 +32,7 @@ import { JsonPatchOperationPathCombiner } from '../../../../core/json-patch/buil
 import { getMockSectionUploadService } from '../../../../shared/mocks/section-upload.service.mock';
 import { SubmissionSectionUploadFileEditComponent } from './edit/section-upload-file-edit.component';
 import { FormBuilderService } from '../../../../shared/form/builder/form-builder.service';
+import { VocabularyService } from '../../../../core/submission/vocabularies/vocabulary.service';
 
 const configMetadataFormMock = {
   rows: [{
@@ -56,6 +57,7 @@ describe('SubmissionSectionUploadFileComponent test suite', () => {
   let operationsBuilder: any;
   let operationsService: any;
 
+
   const submissionJsonPatchOperationsServiceStub = new SubmissionJsonPatchOperationsServiceStub();
   const submissionId = mockSubmissionId;
   const sectionId = 'upload';
@@ -74,6 +76,12 @@ describe('SubmissionSectionUploadFileComponent test suite', () => {
     remove: jasmine.createSpy('remove'),
   });
 
+  const vocabularyServiceSpy =
+    jasmine.createSpyObj(
+      'vocabularyService',
+      { getPublicVocabularyEntryByValue: EMPTY, getPublicVocabularyEntryByID: EMPTY }
+    );
+
   beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       imports: [
@@ -98,7 +106,8 @@ describe('SubmissionSectionUploadFileComponent test suite', () => {
         NgbModal,
         SubmissionSectionUploadFileComponent,
         SubmissionSectionUploadFileEditComponent,
-        FormBuilderService
+        FormBuilderService,
+        { provide: VocabularyService, useValue: vocabularyServiceSpy },
       ],
       schemas: [NO_ERRORS_SCHEMA]
     }).compileComponents().then();

src/app/submission/sections/upload/file/section-upload-file.component.ts

@@ -1,16 +1,16 @@
 import {
-    ChangeDetectorRef,
-    Component,
-    Input,
-    OnChanges,
-    OnDestroy,
-    OnInit,
-    SimpleChanges,
-    ViewChild
+  ChangeDetectorRef,
+  Component,
+  Input,
+  OnChanges,
+  OnDestroy,
+  OnInit,
+  SimpleChanges,
+  ViewChild
 } from '@angular/core';
 
-import { BehaviorSubject, Subscription } from 'rxjs';
-import { filter } from 'rxjs/operators';
+import { BehaviorSubject, Observable, of, Subscription } from 'rxjs';
+import { filter, map, take } from 'rxjs/operators';
 import { DynamicFormControlModel, } from '@ng-dynamic-forms/core';
 import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
 
@@ -27,6 +27,12 @@ import { SubmissionJsonPatchOperationsService } from '../../../../core/submissio
 import { SubmissionSectionUploadFileEditComponent } from './edit/section-upload-file-edit.component';
 import { Bitstream } from '../../../../core/shared/bitstream.model';
 import { NgbModalOptions } from '@ng-bootstrap/ng-bootstrap/modal/modal-config';
+import { VocabularyService } from '../../../../core/submission/vocabularies/vocabulary.service';
+import {
+  getFirstCompletedRemoteData,
+  getPaginatedListPayload,
+  getRemoteDataPayload
+} from '../../../../core/shared/operators';
 
 /**
  * This component represents a single bitstream contained in the submission
@@ -137,6 +143,12 @@ export class SubmissionSectionUploadFileComponent implements OnChanges, OnInit,
    */
   public formModel: DynamicFormControlModel[];
 
+
+  /**
+   * The translated dc.type of the file
+   */
+  public vocabularyFileType$: Observable<string>;
+
   /**
    * A boolean representing if a submission delete operation is pending
    * @type {BehaviorSubject<boolean>}
@@ -172,6 +184,7 @@ export class SubmissionSectionUploadFileComponent implements OnChanges, OnInit,
    * @param {SubmissionJsonPatchOperationsService} operationsService
    * @param {SubmissionService} submissionService
    * @param {SectionUploadService} uploadService
+   * @param vocabularyService
    */
   constructor(
     private cdr: ChangeDetectorRef,
@@ -182,6 +195,7 @@ export class SubmissionSectionUploadFileComponent implements OnChanges, OnInit,
     private operationsService: SubmissionJsonPatchOperationsService,
     private submissionService: SubmissionService,
     private uploadService: SectionUploadService,
+    private vocabularyService: VocabularyService,
   ) {
     this.readMode = true;
   }
@@ -197,9 +211,17 @@ export class SubmissionSectionUploadFileComponent implements OnChanges, OnInit,
           .getFileData(this.submissionId, this.sectionId, this.fileId)
           .pipe(filter((bitstream) => isNotUndefined(bitstream)))
           .subscribe((bitstream) => {
-              this.fileData = bitstream;
-            }
-          )
+            this.fileData = bitstream;
+            const fileType = this.fileData.metadata['dc.type']?.map(data => data.value)[0];
+            this.vocabularyFileType$ = !hasValue(fileType) ? of(null) : this.vocabularyService.getPublicVocabularyEntryByValue('bitstream_types', fileType).pipe(
+              getFirstCompletedRemoteData(),
+              getRemoteDataPayload(),
+              getPaginatedListPayload(),
+              map((res) => res?.length > 0 ? res[0] : null),
+              map((res) => res?.display ?? res?.value),
+              take(1)
+            );
+          })
       );
     }
   }
@@ -272,12 +294,12 @@ export class SubmissionSectionUploadFileComponent implements OnChanges, OnInit,
 
   protected loadFormMetadata() {
     this.configMetadataForm.rows.forEach((row) => {
-      row.fields.forEach((field) => {
-        field.selectableMetadata.forEach((metadatum) => {
-          this.formMetadata.push(metadatum.metadata);
+        row.fields.forEach((field) => {
+          field.selectableMetadata.forEach((metadatum) => {
+            this.formMetadata.push(metadatum.metadata);
+          });
         });
-      });
-    }
+      }
     );
   }