Made item page fields themeble

lint/src/util/theme-support.ts

@@ -189,7 +189,7 @@ function getSource(file: string): ts.SourceFile {
 function resolveLocalPath(path: string, relativeTo: string) {
   if (path.startsWith('src/')) {
     return path;
-  } else if (path.startsWith('./')) {
+  } else if (path.startsWith('./') || path.startsWith('../')) {
     const parts = relativeTo.split('/');
     return [
       ...parts.slice(0, parts.length - 1),

src/app/entity-groups/journal-entities/item-pages/journal-issue/journal-issue.component.ts

@@ -4,7 +4,7 @@ import { RouterLink } from '@angular/router';
 import { ViewMode } from '@dspace/core/shared/view-mode.model';
 import { TranslateModule } from '@ngx-translate/core';
 
-import { GenericItemPageFieldComponent } from '../../../../item-page/simple/field-components/specific-field/generic/generic-item-page-field.component';
+import { ThemedGenericItemPageFieldComponent } from '../../../../item-page/simple/field-components/specific-field/generic/themed-generic-item-page-field.component';
 import { ThemedItemPageTitleFieldComponent } from '../../../../item-page/simple/field-components/specific-field/title/themed-item-page-field.component';
 import { ItemComponent } from '../../../../item-page/simple/item-types/shared/item.component';
 import { RelatedItemsComponent } from '../../../../item-page/simple/related-items/related-items-component';
@@ -22,10 +22,10 @@ import { ThemedThumbnailComponent } from '../../../../thumbnail/themed-thumbnail
   imports: [
     AsyncPipe,
     DsoEditMenuComponent,
-    GenericItemPageFieldComponent,
     MetadataFieldWrapperComponent,
     RelatedItemsComponent,
     RouterLink,
+    ThemedGenericItemPageFieldComponent,
     ThemedItemPageTitleFieldComponent,
     ThemedResultsBackButtonComponent,
     ThemedThumbnailComponent,

src/app/entity-groups/journal-entities/item-pages/journal-volume/journal-volume.component.ts

@@ -4,7 +4,7 @@ import { RouterLink } from '@angular/router';
 import { ViewMode } from '@dspace/core/shared/view-mode.model';
 import { TranslateModule } from '@ngx-translate/core';
 
-import { GenericItemPageFieldComponent } from '../../../../item-page/simple/field-components/specific-field/generic/generic-item-page-field.component';
+import { ThemedGenericItemPageFieldComponent } from '../../../../item-page/simple/field-components/specific-field/generic/themed-generic-item-page-field.component';
 import { ThemedItemPageTitleFieldComponent } from '../../../../item-page/simple/field-components/specific-field/title/themed-item-page-field.component';
 import { ItemComponent } from '../../../../item-page/simple/item-types/shared/item.component';
 import { RelatedItemsComponent } from '../../../../item-page/simple/related-items/related-items-component';
@@ -22,10 +22,10 @@ import { ThemedThumbnailComponent } from '../../../../thumbnail/themed-thumbnail
   imports: [
     AsyncPipe,
     DsoEditMenuComponent,
-    GenericItemPageFieldComponent,
     MetadataFieldWrapperComponent,
     RelatedItemsComponent,
     RouterLink,
+    ThemedGenericItemPageFieldComponent,
     ThemedItemPageTitleFieldComponent,
     ThemedResultsBackButtonComponent,
     ThemedThumbnailComponent,

src/app/entity-groups/journal-entities/item-pages/journal/journal.component.spec.ts

@@ -46,8 +46,7 @@ import {
 } from '@ngx-translate/core';
 import { Observable } from 'rxjs';
 
-import { MetadataValuesComponent } from '../../../../item-page/field-components/metadata-values/metadata-values.component';
-import { GenericItemPageFieldComponent } from '../../../../item-page/simple/field-components/specific-field/generic/generic-item-page-field.component';
+import { ThemedGenericItemPageFieldComponent } from '../../../../item-page/simple/field-components/specific-field/generic/themed-generic-item-page-field.component';
 import { ThemedItemPageTitleFieldComponent } from '../../../../item-page/simple/field-components/specific-field/title/themed-item-page-field.component';
 import { mockRouteService } from '../../../../item-page/simple/item-types/shared/item.component.spec';
 import { ThemedMetadataRepresentationListComponent } from '../../../../item-page/simple/metadata-representation-list/themed-metadata-representation-list.component';
@@ -105,7 +104,7 @@ describe('JournalComponent', () => {
           },
         }),
         RouterTestingModule,
-        GenericItemPageFieldComponent, TruncatePipe,
+        TruncatePipe,
         JournalComponent,
       ],
       providers: [
@@ -144,14 +143,11 @@ describe('JournalComponent', () => {
           RelatedItemsComponent,
           TabbedRelatedEntitiesSearchComponent,
           ThemedMetadataRepresentationListComponent,
+          ThemedGenericItemPageFieldComponent,
         ],
       },
       add: { changeDetection: ChangeDetectionStrategy.Default },
-    })
-      .overrideComponent(GenericItemPageFieldComponent, {
-        remove: { imports: [MetadataValuesComponent] },
-      })
-      .compileComponents();
+    }).compileComponents();
   }));
 
   beforeEach(waitForAsync(() => {
@@ -171,7 +167,7 @@ describe('JournalComponent', () => {
 
 function containsFieldInput(fields: DebugElement[], metadataKey: string): boolean {
   for (const field of fields) {
-    const fieldComp = field.componentInstance;
+    const fieldComp = field.nativeElement;
     if (isNotEmpty(fieldComp.fields)) {
       if (fieldComp.fields.indexOf(metadataKey) > -1) {
         return true;

src/app/entity-groups/journal-entities/item-pages/journal/journal.component.ts

@@ -4,7 +4,7 @@ import { RouterLink } from '@angular/router';
 import { ViewMode } from '@dspace/core/shared/view-mode.model';
 import { TranslateModule } from '@ngx-translate/core';
 
-import { GenericItemPageFieldComponent } from '../../../../item-page/simple/field-components/specific-field/generic/generic-item-page-field.component';
+import { ThemedGenericItemPageFieldComponent } from '../../../../item-page/simple/field-components/specific-field/generic/themed-generic-item-page-field.component';
 import { ThemedItemPageTitleFieldComponent } from '../../../../item-page/simple/field-components/specific-field/title/themed-item-page-field.component';
 import { ItemComponent } from '../../../../item-page/simple/item-types/shared/item.component';
 import { TabbedRelatedEntitiesSearchComponent } from '../../../../item-page/simple/related-entities/tabbed-related-entities-search/tabbed-related-entities-search.component';
@@ -23,11 +23,11 @@ import { ThemedThumbnailComponent } from '../../../../thumbnail/themed-thumbnail
   imports: [
     AsyncPipe,
     DsoEditMenuComponent,
-    GenericItemPageFieldComponent,
     MetadataFieldWrapperComponent,
     RelatedItemsComponent,
     RouterLink,
     TabbedRelatedEntitiesSearchComponent,
+    ThemedGenericItemPageFieldComponent,
     ThemedItemPageTitleFieldComponent,
     ThemedResultsBackButtonComponent,
     ThemedThumbnailComponent,

src/app/entity-groups/research-entities/item-pages/org-unit/org-unit.component.ts

@@ -4,7 +4,7 @@ import { RouterLink } from '@angular/router';
 import { ViewMode } from '@dspace/core/shared/view-mode.model';
 import { TranslateModule } from '@ngx-translate/core';
 
-import { GenericItemPageFieldComponent } from '../../../../item-page/simple/field-components/specific-field/generic/generic-item-page-field.component';
+import { ThemedGenericItemPageFieldComponent } from '../../../../item-page/simple/field-components/specific-field/generic/themed-generic-item-page-field.component';
 import { ItemPageImgFieldComponent } from '../../../../item-page/simple/field-components/specific-field/img/item-page-img-field.component';
 import { ThemedItemPageTitleFieldComponent } from '../../../../item-page/simple/field-components/specific-field/title/themed-item-page-field.component';
 import { ItemComponent } from '../../../../item-page/simple/item-types/shared/item.component';
@@ -24,12 +24,12 @@ import { ThemedThumbnailComponent } from '../../../../thumbnail/themed-thumbnail
   imports: [
     AsyncPipe,
     DsoEditMenuComponent,
-    GenericItemPageFieldComponent,
     ItemPageImgFieldComponent,
     MetadataFieldWrapperComponent,
     RelatedItemsComponent,
     RouterLink,
     TabbedRelatedEntitiesSearchComponent,
+    ThemedGenericItemPageFieldComponent,
     ThemedItemPageTitleFieldComponent,
     ThemedResultsBackButtonComponent,
     ThemedThumbnailComponent,

src/app/entity-groups/research-entities/item-pages/person/person.component.ts

@@ -4,7 +4,7 @@ import { RouterLink } from '@angular/router';
 import { ViewMode } from '@dspace/core/shared/view-mode.model';
 import { TranslateModule } from '@ngx-translate/core';
 
-import { GenericItemPageFieldComponent } from '../../../../item-page/simple/field-components/specific-field/generic/generic-item-page-field.component';
+import { ThemedGenericItemPageFieldComponent } from '../../../../item-page/simple/field-components/specific-field/generic/themed-generic-item-page-field.component';
 import { ThemedItemPageTitleFieldComponent } from '../../../../item-page/simple/field-components/specific-field/title/themed-item-page-field.component';
 import { ItemComponent } from '../../../../item-page/simple/item-types/shared/item.component';
 import { TabbedRelatedEntitiesSearchComponent } from '../../../../item-page/simple/related-entities/tabbed-related-entities-search/tabbed-related-entities-search.component';
@@ -23,11 +23,11 @@ import { ThemedThumbnailComponent } from '../../../../thumbnail/themed-thumbnail
   imports: [
     AsyncPipe,
     DsoEditMenuComponent,
-    GenericItemPageFieldComponent,
     MetadataFieldWrapperComponent,
     RelatedItemsComponent,
     RouterLink,
     TabbedRelatedEntitiesSearchComponent,
+    ThemedGenericItemPageFieldComponent,
     ThemedItemPageTitleFieldComponent,
     ThemedResultsBackButtonComponent,
     ThemedThumbnailComponent,

src/app/entity-groups/research-entities/item-pages/project/project.component.ts

@@ -4,7 +4,7 @@ import { RouterLink } from '@angular/router';
 import { ViewMode } from '@dspace/core/shared/view-mode.model';
 import { TranslateModule } from '@ngx-translate/core';
 
-import { GenericItemPageFieldComponent } from '../../../../item-page/simple/field-components/specific-field/generic/generic-item-page-field.component';
+import { ThemedGenericItemPageFieldComponent } from '../../../../item-page/simple/field-components/specific-field/generic/themed-generic-item-page-field.component';
 import { ThemedItemPageTitleFieldComponent } from '../../../../item-page/simple/field-components/specific-field/title/themed-item-page-field.component';
 import { ItemComponent } from '../../../../item-page/simple/item-types/shared/item.component';
 import { ThemedMetadataRepresentationListComponent } from '../../../../item-page/simple/metadata-representation-list/themed-metadata-representation-list.component';
@@ -23,10 +23,10 @@ import { ThemedThumbnailComponent } from '../../../../thumbnail/themed-thumbnail
   imports: [
     AsyncPipe,
     DsoEditMenuComponent,
-    GenericItemPageFieldComponent,
     MetadataFieldWrapperComponent,
     RelatedItemsComponent,
     RouterLink,
+    ThemedGenericItemPageFieldComponent,
     ThemedItemPageTitleFieldComponent,
     ThemedMetadataRepresentationListComponent,
     ThemedResultsBackButtonComponent,

src/app/item-page/simple/field-components/specific-field/abstract/item-page-abstract-field.component.ts

@@ -9,7 +9,7 @@ import { MetadataValuesComponent } from '../../../../field-components/metadata-v
 import { ItemPageFieldComponent } from '../item-page-field.component';
 
 @Component({
-  selector: 'ds-item-page-abstract-field',
+  selector: 'ds-base-item-page-abstract-field',
   templateUrl: '../item-page-field.component.html',
   imports: [
     AsyncPipe,

src/app/item-page/simple/field-components/specific-field/abstract/themed-item-page-abstract-field.component.ts

@@ -0,0 +1,37 @@
+import {
+  Component,
+  Input,
+} from '@angular/core';
+
+import { Item } from '../../../../../core/shared/item.model';
+import { ThemedComponent } from '../../../../../shared/theme-support/themed.component';
+import { ItemPageAbstractFieldComponent } from './item-page-abstract-field.component';
+
+@Component({
+  selector: 'ds-item-page-abstract-field',
+  templateUrl: '../../../../../shared/theme-support/themed.component.html',
+  imports: [
+    ItemPageAbstractFieldComponent,
+  ],
+})
+export class ThemedItemPageAbstractFieldComponent extends ThemedComponent<ItemPageAbstractFieldComponent> {
+
+  @Input() item: Item;
+
+  protected inAndOutputNames: (keyof ItemPageAbstractFieldComponent & keyof this)[] = [
+    'item',
+  ];
+
+  protected getComponentName(): string {
+    return 'ItemPageAbstractFieldComponent';
+  }
+
+  protected importThemedComponent(themeName: string): Promise<any> {
+    return import(`../../../../../../themes/${themeName}/app/item-page/simple/field-components/specific-field/abstract/item-page-abstract-field.component`);
+  }
+
+  protected importUnthemedComponent(): Promise<any> {
+    return import('./item-page-abstract-field.component');
+  }
+
+}

src/app/item-page/simple/field-components/specific-field/author/item-page-author-field.component.ts

@@ -9,7 +9,7 @@ import { MetadataValuesComponent } from '../../../../field-components/metadata-v
 import { ItemPageFieldComponent } from '../item-page-field.component';
 
 @Component({
-  selector: 'ds-item-page-author-field',
+  selector: 'ds-base-item-page-author-field',
   templateUrl: '../item-page-field.component.html',
   imports: [
     AsyncPipe,

src/app/item-page/simple/field-components/specific-field/author/themed-item-page-author-field.component.ts

@@ -0,0 +1,37 @@
+import {
+  Component,
+  Input,
+} from '@angular/core';
+
+import { Item } from '../../../../../core/shared/item.model';
+import { ThemedComponent } from '../../../../../shared/theme-support/themed.component';
+import { ItemPageAuthorFieldComponent } from './item-page-author-field.component';
+
+@Component({
+  selector: 'ds-item-page-author-field',
+  templateUrl: '../../../../../shared/theme-support/themed.component.html',
+  imports: [
+    ItemPageAuthorFieldComponent,
+  ],
+})
+export class ThemedItemPageAuthorFieldComponent extends ThemedComponent<ItemPageAuthorFieldComponent> {
+
+  @Input() item: Item;
+
+  protected inAndOutputNames: (keyof ItemPageAuthorFieldComponent & keyof this)[] = [
+    'item',
+  ];
+
+  protected getComponentName(): string {
+    return 'ItemPageAuthorFieldComponent';
+  }
+
+  protected importThemedComponent(themeName: string): Promise<any> {
+    return import(`../../../../../../themes/${themeName}/app/item-page/simple/field-components/specific-field/author/item-page-author-field.component`);
+  }
+
+  protected importUnthemedComponent(): Promise<any> {
+    return import('./item-page-author-field.component');
+  }
+
+}

src/app/item-page/simple/field-components/specific-field/cc-license/item-page-cc-license-field.component.ts

@@ -27,7 +27,7 @@ import { MetadataFieldWrapperComponent } from 'src/app/shared/metadata-field-wra
 
 
 @Component({
-  selector: 'ds-item-page-cc-license-field',
+  selector: 'ds-base-item-page-cc-license-field',
   templateUrl: './item-page-cc-license-field.component.html',
   imports: [
     AsyncPipe,
@@ -51,7 +51,7 @@ export class ItemPageCcLicenseFieldComponent implements OnInit {
    * 'full' variant shows image, a disclaimer (optional) and name (always), better for the item page content.
    * 'small' variant shows image and name (optional), better for the item page sidebar
    */
-  @Input() variant?: 'small' | 'full' = 'small';
+  @Input() variant: 'small' | 'full' = 'small';
 
   /**
    * Field name containing the CC license URI
@@ -66,12 +66,12 @@ export class ItemPageCcLicenseFieldComponent implements OnInit {
   /**
    * Shows the CC license name with the image. Always show if image fails to load
    */
-  @Input() showName? = true;
+  @Input() showName = true;
 
   /**
    * Shows the disclaimer in the 'full' variant of the component
    */
-  @Input() showDisclaimer? = true;
+  @Input() showDisclaimer = true;
 
 
   showImage = true;

src/app/item-page/simple/field-components/specific-field/cc-license/themed-item-page-cc-license-field.component.ts

@@ -0,0 +1,52 @@
+import {
+  Component,
+  Input,
+} from '@angular/core';
+
+import { Item } from '../../../../../core/shared/item.model';
+import { ThemedComponent } from '../../../../../shared/theme-support/themed.component';
+import { ItemPageCcLicenseFieldComponent } from './item-page-cc-license-field.component';
+
+@Component({
+  selector: 'ds-item-page-cc-license-field',
+  templateUrl: '../../../../../shared/theme-support/themed.component.html',
+  imports: [
+    ItemPageCcLicenseFieldComponent,
+  ],
+})
+export class ThemedItemPageCcLicenseFieldComponent extends ThemedComponent<ItemPageCcLicenseFieldComponent> {
+
+  @Input() item: Item;
+
+  @Input() variant: 'small' | 'full';
+
+  @Input() ccLicenseUriField?: string;
+
+  @Input() ccLicenseNameField?: string;
+
+  @Input() showName: boolean;
+
+  @Input() showDisclaimer: boolean;
+
+  protected inAndOutputNames: (keyof ItemPageCcLicenseFieldComponent & keyof this)[] = [
+    'item',
+    'variant',
+    'ccLicenseUriField',
+    'ccLicenseNameField',
+    'showName',
+    'showDisclaimer',
+  ];
+
+  protected getComponentName(): string {
+    return 'ItemPageCcLicenseFieldComponent';
+  }
+
+  protected importThemedComponent(themeName: string): Promise<any> {
+    return import(`../../../../../../themes/${themeName}/app/item-page/simple/field-components/specific-field/cc-license/item-page-cc-license-field.component`);
+  }
+
+  protected importUnthemedComponent(): Promise<any> {
+    return import('./item-page-cc-license-field.component');
+  }
+
+}

src/app/item-page/simple/field-components/specific-field/date/item-page-date-field.component.ts

@@ -9,7 +9,7 @@ import { MetadataValuesComponent } from '../../../../field-components/metadata-v
 import { ItemPageFieldComponent } from '../item-page-field.component';
 
 @Component({
-  selector: 'ds-item-page-date-field',
+  selector: 'ds-base-item-page-date-field',
   templateUrl: '../item-page-field.component.html',
   imports: [
     AsyncPipe,