Merge pull request DSpace#2202 from mwoodiupui/themeable-section-upload-file

Themeable `SubmissionSectionUploadFileComponent`

Author: tdonohue

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

@@ -175,7 +175,7 @@ describe('SubmissionSectionUploadFileComponent test suite', () => {
     it('should init file data properly', () => {
       uploadService.getFileData.and.returnValue(observableOf(fileData));
 
-      comp.ngOnChanges();
+      comp.ngOnChanges({});
 
       expect(comp.fileData).toEqual(fileData);
     });

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

@@ -1,4 +1,13 @@
-import { ChangeDetectorRef, Component, Input, OnChanges, OnInit, ViewChild } from '@angular/core';
+import {
+    ChangeDetectorRef,
+    Component,
+    Input,
+    OnChanges,
+    OnDestroy,
+    OnInit,
+    SimpleChanges,
+    ViewChild
+} from '@angular/core';
 
 import { BehaviorSubject, Subscription } from 'rxjs';
 import { filter } from 'rxjs/operators';
@@ -27,7 +36,7 @@ import { NgbModalOptions } from '@ng-bootstrap/ng-bootstrap/modal/modal-config';
   styleUrls: ['./section-upload-file.component.scss'],
   templateUrl: './section-upload-file.component.html',
 })
-export class SubmissionSectionUploadFileComponent implements OnChanges, OnInit {
+export class SubmissionSectionUploadFileComponent implements OnChanges, OnInit, OnDestroy {
 
   /**
    * The list of available access condition
@@ -168,13 +177,13 @@ export class SubmissionSectionUploadFileComponent implements OnChanges, OnInit {
   /**
    * Retrieve bitstream's metadata
    */
-  ngOnChanges() {
+  ngOnChanges(changes: SimpleChanges): void {
     if (this.availableAccessConditionOptions) {
       // Retrieve file state
       this.subscriptions.push(
         this.uploadService
-          .getFileData(this.submissionId, this.sectionId, this.fileId).pipe(
-            filter((bitstream) => isNotUndefined(bitstream)))
+          .getFileData(this.submissionId, this.sectionId, this.fileId)
+          .pipe(filter((bitstream) => isNotUndefined(bitstream)))
           .subscribe((bitstream) => {
               this.fileData = bitstream;
             }

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

@@ -0,0 +1,93 @@
+import { Component, Input } from '@angular/core';
+import { SubmissionFormsModel } from 'src/app/core/config/models/config-submission-forms.model';
+import { ThemedComponent } from 'src/app/shared/theme-support/themed.component';
+import { SubmissionSectionUploadFileComponent } from './section-upload-file.component';
+
+@Component({
+    selector: 'ds-themed-submission-upload-section-file',
+    styleUrls: [],
+    templateUrl: '../../../../shared/theme-support/themed.component.html'
+})
+export class ThemedSubmissionSectionUploadFileComponent
+    extends ThemedComponent<SubmissionSectionUploadFileComponent> {
+
+  /**
+   * The list of available access condition
+   * @type {Array}
+   */
+  @Input() availableAccessConditionOptions: any[];
+
+  /**
+   * The submission id
+   * @type {string}
+   */
+  @Input() collectionId: string;
+
+  /**
+   * Define if collection access conditions policy type :
+   * POLICY_DEFAULT_NO_LIST : is not possible to define additional access group/s for the single file
+   * POLICY_DEFAULT_WITH_LIST : is possible to define additional access group/s for the single file
+   * @type {number}
+   */
+  @Input() collectionPolicyType: number;
+
+  /**
+   * The configuration for the bitstream's metadata form
+   * @type {SubmissionFormsModel}
+   */
+  @Input() configMetadataForm: SubmissionFormsModel;
+
+  /**
+   * The bitstream id
+   * @type {string}
+   */
+  @Input() fileId: string;
+
+  /**
+   * The bitstream array key
+   * @type {string}
+   */
+  @Input() fileIndex: string;
+
+  /**
+   * The bitstream id
+   * @type {string}
+   */
+  @Input() fileName: string;
+
+  /**
+   * The section id
+   * @type {string}
+   */
+  @Input() sectionId: string;
+
+  /**
+   * The submission id
+   * @type {string}
+   */
+  @Input() submissionId: string;
+
+  protected inAndOutputNames: (keyof SubmissionSectionUploadFileComponent & keyof this)[] = [
+    'availableAccessConditionOptions',
+    'collectionId',
+    'collectionPolicyType',
+    'configMetadataForm',
+    'fileId',
+    'fileIndex',
+    'fileName',
+    'sectionId',
+    'submissionId'
+    ];
+
+  protected getComponentName(): string {
+    return 'SubmissionSectionUploadFileComponent';
+  }
+
+  protected importThemedComponent(themeName: string): Promise<any> {
+    return import(`../../../../../themes/${themeName}/app/submission/sections/upload/file/section-upload-file.component`);
+  }
+
+  protected importUnthemedComponent(): Promise<any> {
+    return import(`./section-upload-file.component`);
+  }
+}

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

@@ -28,7 +28,7 @@ <h3 class="text-center"><span class="text-muted">{{'submission.sections.upload.n
   </div>
 
   <ng-container *ngFor="let fileEntry of fileList">
-    <ds-submission-upload-section-file
+    <ds-themed-submission-upload-section-file
                                        [availableAccessConditionOptions]="availableAccessConditionOptions"
                                        [collectionId]="collectionId"
                                        [collectionPolicyType]="collectionPolicyType"
@@ -37,7 +37,7 @@ <h3 class="text-center"><span class="text-muted">{{'submission.sections.upload.n
                                        [fileIndex]="fileList.indexOf(fileEntry)"
                                        [fileName]="fileNames[fileList.indexOf(fileEntry)]"
                                        [sectionId]="sectionData.id"
-                                       [submissionId]="submissionId"></ds-submission-upload-section-file>
+                                       [submissionId]="submissionId"></ds-themed-submission-upload-section-file>
     <div class="row">
       <div class="col-md-12">
         <hr/>

src/app/submission/submission.module.ts

@@ -49,6 +49,7 @@ import { ResearchEntitiesModule } from '../entity-groups/research-entities/resea
 import { ThemedSubmissionEditComponent } from './edit/themed-submission-edit.component';
 import { ThemedSubmissionSubmitComponent } from './submit/themed-submission-submit.component';
 import { ThemedSubmissionImportExternalComponent } from './import-external/themed-submission-import-external.component';
+import { ThemedSubmissionSectionUploadFileComponent } from './sections/upload/file/themed-section-upload-file.component';
 import { FormModule } from '../shared/form/form.module';
 import { NgbAccordionModule, NgbCollapseModule, NgbModalModule } from '@ng-bootstrap/ng-bootstrap';
 import { SubmissionSectionAccessesComponent } from './sections/accesses/section-accesses.component';
@@ -104,6 +105,7 @@ const DECLARATIONS = [
   PublisherPolicyComponent,
   PublicationInformationComponent,
   MetadataInformationComponent,
+  ThemedSubmissionSectionUploadFileComponent,
 ];
 
 @NgModule({

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

@@ -0,0 +1,18 @@
+import { Component } from '@angular/core';
+import {
+    SubmissionSectionUploadFileComponent as BaseComponent
+} from 'src/app/submission/sections/upload/file/section-upload-file.component';
+
+/**
+ * This component represents a single bitstream contained in the submission
+ */
+@Component({
+  selector: 'ds-submission-upload-section-file',
+  // styleUrls: ['./section-upload-file.component.scss'],
+  styleUrls: ['../../../../../../../app/submission/sections/upload/file/section-upload-file.component.scss'],
+  // templateUrl: './section-upload-file.component.html'
+  templateUrl: '../../../../../../../app/submission/sections/upload/file/section-upload-file.component.html'
+})
+export class SubmissionSectionUploadFileComponent
+    extends BaseComponent {
+}

src/themes/custom/app/submission/sections/upload/file/section-upload-file.component.scss

@@ -141,6 +141,7 @@ import {
 import { NgxGalleryModule } from '@kolkov/ngx-gallery';
 import { WorkspaceItemsDeletePageComponent } from './app/workspace-items-delete-page/workspace-items-delete/workspace-items-delete.component';
 import { ThumbnailComponent } from './app/thumbnail/thumbnail.component';
+import { SubmissionSectionUploadFileComponent } from './app/submission/sections/upload/file/section-upload-file.component';
 import { ItemStatusComponent } from './app/item-page/edit-item-page/item-status/item-status.component';
 import { EditBitstreamPageComponent } from './app/bitstream-page/edit-bitstream-page/edit-bitstream-page.component';
 import { FormModule } from '../../app/shared/form/form.module';
@@ -220,6 +221,7 @@ const DECLARATIONS = [
   MediaViewerVideoComponent,
   WorkspaceItemsDeletePageComponent,
   ThumbnailComponent,
+  SubmissionSectionUploadFileComponent,
   ItemStatusComponent,
   EditBitstreamPageComponent,
 ];