98855: Themed FileDownloadLinkComponent

src/app/item-page/full/field-components/file-section/full-file-section.component.html

@@ -33,9 +33,9 @@
                         </dl>
                     </div>
                     <div class="col-2">
-                        <ds-file-download-link [bitstream]="file" [item]="item">
+                        <ds-themed-file-download-link [bitstream]="file" [item]="item">
                             {{"item.page.filesection.download" | translate}}
-                        </ds-file-download-link>
+                        </ds-themed-file-download-link>
                     </div>
                 </div>
             </ds-pagination>
@@ -74,9 +74,9 @@
                         </dl>
                     </div>
                     <div class="col-2">
-                        <ds-file-download-link [bitstream]="file" [item]="item">
+                        <ds-themed-file-download-link [bitstream]="file" [item]="item">
                             {{"item.page.filesection.download" | translate}}
-                        </ds-file-download-link>
+                        </ds-themed-file-download-link>
                     </div>
                 </div>
             </ds-pagination>

src/app/item-page/simple/field-components/file-section/file-section.component.html

@@ -1,11 +1,11 @@
 <ng-container *ngVar="(bitstreams$ | async) as bitstreams">
   <ds-metadata-field-wrapper *ngIf="bitstreams?.length > 0" [label]="label | translate">
     <div class="file-section">
-      <ds-file-download-link *ngFor="let file of bitstreams; let last=last;" [bitstream]="file" [item]="item">
+      <ds-themed-file-download-link *ngFor="let file of bitstreams; let last=last;" [bitstream]="file" [item]="item">
         <span>{{file?.name}}</span>
         <span>({{(file?.sizeBytes) | dsFileSize }})</span>
         <span *ngIf="!last" innerHTML="{{separator}}"></span>
-      </ds-file-download-link>
+      </ds-themed-file-download-link>
       <ds-themed-loading *ngIf="isLoading" message="{{'loading.default' | translate}}" [showMessage]="false"></ds-themed-loading>
       <div *ngIf="!isLastPage" class="mt-1" id="view-more">
         <a class="bitstream-view-more btn btn-outline-secondary btn-sm" [routerLink]="[]" (click)="getNextPage()">{{'item.page.bitstreams.view-more' | translate}}</a>

src/app/item-page/simple/field-components/file-section/file-section.component.spec.ts

@@ -109,7 +109,7 @@ describe('FileSectionComponent', () => {
     it('one bitstream should be on the page', () => {
       const viewMore = fixture.debugElement.query(By.css('.bitstream-view-more'));
       viewMore.triggerEventHandler('click', null);
-      const fileDownloadLink = fixture.debugElement.queryAll(By.css('ds-file-download-link'));
+      const fileDownloadLink = fixture.debugElement.queryAll(By.css('ds-themed-file-download-link'));
       expect(fileDownloadLink.length).toEqual(1);
     });
 
@@ -122,7 +122,7 @@ describe('FileSectionComponent', () => {
 
       });
       it('should contain another bitstream', () => {
-        const fileDownloadLink = fixture.debugElement.queryAll(By.css('ds-file-download-link'));
+        const fileDownloadLink = fixture.debugElement.queryAll(By.css('ds-themed-file-download-link'));
         expect(fileDownloadLink.length).toEqual(2);
       });
     });

src/app/process-page/detail/process-detail.component.html

@@ -17,10 +17,10 @@
     <div *ngVar="(filesRD$ | async)?.payload?.page as files">
         <ds-process-detail-field *ngIf="files && files?.length > 0" id="process-files"
                                  [title]="'process.detail.output-files'">
-            <ds-file-download-link *ngFor="let file of files; let last=last;" [bitstream]="file">
+            <ds-themed-file-download-link *ngFor="let file of files; let last=last;" [bitstream]="file">
                 <span>{{getFileName(file)}}</span>
                 <span>({{(file?.sizeBytes) | dsFileSize }})</span>
-            </ds-file-download-link>
+            </ds-themed-file-download-link>
         </ds-process-detail-field>
     </div>
 

src/app/shared/file-download-link/themed-file-download-link.component.ts

@@ -0,0 +1,38 @@
+import { ThemedComponent } from '../theme-support/themed.component';
+import { Component, Input } from '@angular/core';
+import { FileDownloadLinkComponent } from './file-download-link.component';
+import { Bitstream } from '../../core/shared/bitstream.model';
+import { Item } from '../../core/shared/item.model';
+
+@Component({
+  selector: 'ds-themed-file-download-link',
+  styleUrls: [],
+  templateUrl: '../theme-support/themed.component.html',
+})
+export class ThemedFileDownloadLinkComponent extends ThemedComponent<FileDownloadLinkComponent> {
+
+  @Input() bitstream: Bitstream;
+
+  @Input() item: Item;
+
+  @Input() cssClasses: string;
+
+  @Input() isBlank: boolean;
+
+  @Input() enableRequestACopy: boolean;
+
+  protected inAndOutputNames: (keyof FileDownloadLinkComponent & keyof this)[] = ['bitstream', 'item', 'cssClasses', 'isBlank', 'enableRequestACopy'];
+
+  protected getComponentName(): string {
+    return 'FileDownloadLinkComponent';
+  }
+
+  protected importThemedComponent(themeName: string): Promise<any> {
+    return import(`../../../themes/${themeName}/app/shared/file-download-link/file-download-link.component`);
+  }
+
+  protected importUnthemedComponent(): Promise<any> {
+    return import('./file-download-link.component');
+  }
+
+}

src/app/shared/shared.module.ts

@@ -256,6 +256,7 @@ import {
 import { ImpersonateNavbarComponent } from './impersonate-navbar/impersonate-navbar.component';
 import { NgForTrackByIdDirective } from './ng-for-track-by-id.directive';
 import { FileDownloadLinkComponent } from './file-download-link/file-download-link.component';
+import { ThemedFileDownloadLinkComponent } from './file-download-link/themed-file-download-link.component';
 import { CollectionDropdownComponent } from './collection-dropdown/collection-dropdown.component';
 import { EntityDropdownComponent } from './entity-dropdown/entity-dropdown.component';
 import { VocabularyTreeviewComponent } from './vocabulary-treeview/vocabulary-treeview.component';
@@ -479,6 +480,7 @@ const COMPONENTS = [
   ModifyItemOverviewComponent,
   ImpersonateNavbarComponent,
   FileDownloadLinkComponent,
+  ThemedFileDownloadLinkComponent,
   BitstreamDownloadPageComponent,
   BitstreamRequestACopyPageComponent,
   CollectionDropdownComponent,
@@ -561,6 +563,7 @@ const ENTRY_COMPONENTS = [
   ClaimedTaskActionsEditMetadataComponent,
   CollectionDropdownComponent,
   FileDownloadLinkComponent,
+  ThemedFileDownloadLinkComponent,
   BitstreamDownloadPageComponent,
   BitstreamRequestACopyPageComponent,
   CurationFormComponent,

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

@@ -10,9 +10,9 @@
       </div>
       <div class="float-right w-15">
         <ng-container>
-          <ds-file-download-link [cssClasses]="'btn btn-link-focus'" [isBlank]="true" [bitstream]="getBitstream()" [enableRequestACopy]="false">
+          <ds-themed-file-download-link [cssClasses]="'btn btn-link-focus'" [isBlank]="true" [bitstream]="getBitstream()" [enableRequestACopy]="false">
             <i class="fa fa-download fa-2x text-normal" aria-hidden="true"></i>
-          </ds-file-download-link>
+          </ds-themed-file-download-link>
           <button class="btn btn-link-focus"
                   [attr.aria-label]="'submission.sections.upload.edit.title' | translate"
                   title="{{ 'submission.sections.upload.edit.title' | translate }}"