Merge pull request #2083 from atmire/atmire-contributions-alex-7.5

New themed components

src/app/collection-page/collection-item-mapper/collection-item-mapper.component.html

@@ -28,14 +28,14 @@
           <ng-template ngbNavContent>
             <div class="row mt-2">
               <div class="col-12 col-lg-6">
-                <ds-search-form id="search-form"
+                <ds-themed-search-form id="search-form"
                                 [query]="(searchOptions$ | async)?.query"
                                 [scope]="(searchOptions$ | async)?.scope"
                                 [currentUrl]="'./'"
                                 [inPlaceSearch]="true"
                                 [searchPlaceholder]="'collection.edit.item-mapper.search-form.placeholder' | translate"
                                 (submitSearch)="performedSearch = true">
-                </ds-search-form>
+                </ds-themed-search-form>
               </div>
             </div>
 

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

@@ -18,12 +18,12 @@
       <!--[fields]="['project.identifier.status']"-->
       <!--[label]="'project.page.status'">-->
     <!--</ds-generic-item-page-field>-->
-    <ds-metadata-representation-list
+    <ds-themed-metadata-representation-list
       [parentItem]="object"
       [itemType]="'OrgUnit'"
       [metadataFields]="['project.contributor.other']"
       [label]="'project.page.contributor' | translate">
-    </ds-metadata-representation-list>
+    </ds-themed-metadata-representation-list>
     <ds-generic-item-page-field [item]="object"
       [fields]="['project.identifier.funder']"
       [label]="'project.page.funder'">

src/app/home-page/home-page.component.html

@@ -3,7 +3,7 @@
   <ng-container *ngIf="(site$ | async) as site">
     <ds-view-tracker [object]="site"></ds-view-tracker>
   </ng-container>
-  <ds-search-form [inPlaceSearch]="false" [searchPlaceholder]="'home.search-form.placeholder' | translate"></ds-search-form>
+  <ds-themed-search-form [inPlaceSearch]="false" [searchPlaceholder]="'home.search-form.placeholder' | translate"></ds-themed-search-form>
   <ds-top-level-community-list></ds-top-level-community-list>
   <ds-recent-item-list *ngIf="recentSubmissionspageSize>0"></ds-recent-item-list>
 </div>

src/app/item-page/alerts/themed-item-alerts.component.ts

@@ -0,0 +1,30 @@
+import { Component, Input } from '@angular/core';
+import { Item } from '../../core/shared/item.model';
+import { ItemAlertsComponent } from './item-alerts.component';
+import { ThemedComponent } from '../../shared/theme-support/themed.component';
+
+/**
+ * Themed wrapper for {@link ItemAlertsComponent}
+ */
+@Component({
+  selector: 'ds-themed-item-alerts',
+  styleUrls: [],
+  templateUrl: '../../shared/theme-support/themed.component.html',
+})
+export class ThemedItemAlertsComponent extends ThemedComponent<ItemAlertsComponent> {
+  protected inAndOutputNames: (keyof ItemAlertsComponent & keyof this)[] = ['item'];
+
+  @Input() item: Item;
+
+  protected getComponentName(): string {
+    return 'ItemAlertsComponent';
+  }
+
+  protected importThemedComponent(themeName: string): Promise<any> {
+    return import(`../../../themes/${themeName}/app/item-page/alerts/item-alerts.component`);
+  }
+
+  protected importUnthemedComponent(): Promise<any> {
+    return import('./item-alerts.component');
+  }
+}

src/app/item-page/edit-item-page/item-collection-mapper/item-collection-mapper.component.html

@@ -27,13 +27,13 @@
           <ng-template ngbNavContent>
             <div class="row mt-2">
               <div class="col-12 col-lg-6">
-                <ds-search-form id="search-form"
+                <ds-themed-search-form id="search-form"
                                 [query]="(searchOptions$ | async)?.query"
                                 [currentUrl]="'./'"
                                 [inPlaceSearch]="true"
                                 [searchPlaceholder]="'item.edit.item-mapper.search-form.placeholder' | translate"
                                 (submitSearch)="performedSearch = true">
-                </ds-search-form>
+                </ds-themed-search-form>
               </div>
             </div>
 

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

@@ -0,0 +1,32 @@
+import { Component, Input } from '@angular/core';
+import { ThemedComponent } from '../../../../shared/theme-support/themed.component';
+import { FullFileSectionComponent } from './full-file-section.component';
+import { Item } from '../../../../core/shared/item.model';
+
+/**
+ * Themed wrapper for {@link FullFileSectionComponent}
+ */
+@Component({
+  selector: 'ds-themed-item-page-full-file-section',
+  styleUrls: [],
+  templateUrl: './../../../../shared/theme-support/themed.component.html',
+})
+export class ThemedFullFileSectionComponent extends ThemedComponent<FullFileSectionComponent> {
+
+  @Input() item: Item;
+
+  protected inAndOutputNames: (keyof FullFileSectionComponent & keyof this)[] = ['item'];
+
+  protected getComponentName(): string {
+    return 'FullFileSectionComponent';
+  }
+
+  protected importThemedComponent(themeName: string): Promise<any> {
+    return import(`../../../../../themes/${themeName}/app/item-page/full/field-components/file-section/full-file-section.component`);
+  }
+
+  protected importUnthemedComponent(): Promise<any> {
+    return import('./full-file-section.component');
+  }
+
+}

src/app/item-page/full/full-item-page.component.html

@@ -1,7 +1,7 @@
 <div class="container" *ngVar="(itemRD$ | async) as itemRD">
   <div class="item-page" *ngIf="itemRD?.hasSucceeded" @fadeInOut>
     <div *ngIf="itemRD?.payload as item">
-      <ds-item-alerts [item]="item"></ds-item-alerts>
+      <ds-themed-item-alerts [item]="item"></ds-themed-item-alerts>
       <ds-item-versions-notice [item]="item"></ds-item-versions-notice>
       <ds-view-tracker [object]="item"></ds-view-tracker>
       <div *ngIf="!item.isWithdrawn || (isAdmin$|async)" class="full-item-info">
@@ -28,7 +28,7 @@
             </tbody>
           </table>
         </div>
-        <ds-item-page-full-file-section [item]="item"></ds-item-page-full-file-section>
+        <ds-themed-item-page-full-file-section [item]="item"></ds-themed-item-page-full-file-section>
         <ds-item-page-collections [item]="item"></ds-item-page-collections>
         <ds-item-versions class="mt-2" [item]="item"></ds-item-versions>
         <div class="button-row bottom" *ngIf="fromSubmissionObject">

src/app/item-page/item-page.module.ts

@@ -53,6 +53,10 @@ import { BitstreamRequestACopyPageComponent } from './bitstreams/request-a-copy/
 import { FileSectionComponent } from './simple/field-components/file-section/file-section.component';
 import { ItemSharedModule } from './item-shared.module';
 import { DsoPageModule } from '../shared/dso-page/dso-page.module';
+import { ThemedItemAlertsComponent } from './alerts/themed-item-alerts.component';
+import {
+  ThemedFullFileSectionComponent
+} from './full/field-components/file-section/themed-full-file-section.component';
 
 
 const ENTRY_COMPONENTS = [
@@ -76,6 +80,7 @@ const DECLARATIONS = [
   ItemPageFieldComponent,
   CollectionsComponent,
   FullFileSectionComponent,
+  ThemedFullFileSectionComponent,
   PublicationComponent,
   UntypedItemComponent,
   ItemComponent,
@@ -91,6 +96,7 @@ const DECLARATIONS = [
   OrcidSyncSettingsComponent,
   OrcidQueueComponent,
   ItemAlertsComponent,
+  ThemedItemAlertsComponent,
   BitstreamRequestACopyPageComponent,
 ];
 

src/app/item-page/item-shared.module.ts

@@ -13,6 +13,9 @@ import { MetadataValuesComponent } from './field-components/metadata-values/meta
 import { GenericItemPageFieldComponent } from './simple/field-components/specific-field/generic/generic-item-page-field.component';
 import { MetadataRepresentationListComponent } from './simple/metadata-representation-list/metadata-representation-list.component';
 import { RelatedItemsComponent } from './simple/related-items/related-items-component';
+import {
+  ThemedMetadataRepresentationListComponent
+} from './simple/metadata-representation-list/themed-metadata-representation-list.component';
 
 const ENTRY_COMPONENTS = [
   ItemVersionsDeleteModalComponent,
@@ -27,6 +30,7 @@ const COMPONENTS = [
   MetadataValuesComponent,
   GenericItemPageFieldComponent,
   MetadataRepresentationListComponent,
+  ThemedMetadataRepresentationListComponent,
   RelatedItemsComponent,
 ];
 

src/app/item-page/simple/item-page.component.html

@@ -1,7 +1,7 @@
 <div class="container" *ngVar="(itemRD$ | async) as itemRD">
   <div class="item-page" *ngIf="itemRD?.hasSucceeded" @fadeInOut>
     <div *ngIf="itemRD?.payload as item">
-      <ds-item-alerts [item]="item"></ds-item-alerts>
+      <ds-themed-item-alerts [item]="item"></ds-themed-item-alerts>
       <ds-item-versions-notice [item]="item"></ds-item-versions-notice>
       <ds-view-tracker [object]="item"></ds-view-tracker>
       <ds-listable-object-component-loader *ngIf="!item.isWithdrawn || (isAdmin$|async)" [object]="item" [viewMode]="viewMode"></ds-listable-object-component-loader>

src/app/item-page/simple/item-types/publication/publication.component.html

@@ -25,12 +25,12 @@
     </ng-container>
     <ds-themed-item-page-file-section [item]="object"></ds-themed-item-page-file-section>
     <ds-item-page-date-field [item]="object"></ds-item-page-date-field>
-    <ds-metadata-representation-list class="ds-item-page-mixed-author-field"
+    <ds-themed-metadata-representation-list class="ds-item-page-mixed-author-field"
       [parentItem]="object"
       [itemType]="'Person'"
       [metadataFields]="['dc.contributor.author', 'dc.creator']"
       [label]="'relationships.isAuthorOf' | translate">
-    </ds-metadata-representation-list>
+    </ds-themed-metadata-representation-list>
     <ds-generic-item-page-field [item]="object"
       [fields]="['journal.title']"
       [label]="'publication.page.journal-title'">

src/app/item-page/simple/item-types/untyped-item/untyped-item.component.html

@@ -26,12 +26,12 @@
     </ng-container>
     <ds-themed-item-page-file-section [item]="object"></ds-themed-item-page-file-section>
     <ds-item-page-date-field [item]="object"></ds-item-page-date-field>
-    <ds-metadata-representation-list class="ds-item-page-mixed-author-field"
+    <ds-themed-metadata-representation-list class="ds-item-page-mixed-author-field"
       [parentItem]="object"
       [itemType]="'Person'"
       [metadataFields]="['dc.contributor.author', 'dc.creator']"
       [label]="'relationships.isAuthorOf' | translate">
-    </ds-metadata-representation-list>
+    </ds-themed-metadata-representation-list>
     <ds-generic-item-page-field [item]="object"
       [fields]="['journal.title']"
       [label]="'item.page.journal-title'">

src/app/item-page/simple/metadata-representation-list/metadata-representation-list.component.ts

@@ -59,8 +59,10 @@ export class MetadataRepresentationListComponent extends AbstractIncrementalList
    */
   total: number;
 
-  constructor(public relationshipService: RelationshipDataService,
+  constructor(
-              private browseDefinitionDataService: BrowseDefinitionDataService) {
+    public relationshipService: RelationshipDataService,
+    protected browseDefinitionDataService: BrowseDefinitionDataService,
+  ) {
     super();
   }
 

src/app/item-page/simple/metadata-representation-list/themed-metadata-representation-list.component.ts

@@ -0,0 +1,35 @@
+import { ThemedComponent } from '../../../shared/theme-support/themed.component';
+import { MetadataRepresentationListComponent } from './metadata-representation-list.component';
+import { Component, Input } from '@angular/core';
+import { Item } from '../../../core/shared/item.model';
+
+@Component({
+  selector: 'ds-themed-metadata-representation-list',
+  styleUrls: [],
+  templateUrl: '../../../shared/theme-support/themed.component.html',
+})
+export class ThemedMetadataRepresentationListComponent extends ThemedComponent<MetadataRepresentationListComponent> {
+  protected inAndOutputNames: (keyof MetadataRepresentationListComponent & keyof this)[] = ['parentItem', 'itemType', 'metadataFields', 'label', 'incrementBy'];
+
+  @Input() parentItem: Item;
+
+  @Input() itemType: string;
+
+  @Input() metadataFields: string[];
+
+  @Input() label: string;
+
+  @Input() incrementBy = 10;
+
+  protected getComponentName(): string {
+    return 'MetadataRepresentationListComponent';
+  }
+
+  protected importThemedComponent(themeName: string): Promise<any> {
+    return import(`../../../../themes/${themeName}/app/item-page/simple/metadata-representation-list/metadata-representation-list.component`);
+  }
+
+  protected importUnthemedComponent(): Promise<any> {
+    return import(`./metadata-representation-list.component`);
+  }
+}

src/app/shared/form/builder/ds-dynamic-form-ui/relation-lookup-modal/dynamic-lookup-relation-modal.component.html

@@ -12,7 +12,7 @@
             <li ngbNavItem>
                 <a ngbNavLink>{{'submission.sections.describe.relationship-lookup.search-tab.tab-title.' + relationshipOptions.relationshipType | translate  : { count: (totalInternal$ | async)} }}</a>
                 <ng-template ngbNavContent>
-                    <ds-dynamic-lookup-relation-search-tab
+                    <ds-themed-dynamic-lookup-relation-search-tab
                             [selection$]="selection$"
                             [listId]="listId"
                             [relationship]="relationshipOptions"
@@ -28,13 +28,13 @@
                             (deselectObject)="deselect($event)"
                             (resultFound)="setTotalInternals($event.pageInfo.totalElements)"
                             class="d-block pt-3">
-                    </ds-dynamic-lookup-relation-search-tab>
+                    </ds-themed-dynamic-lookup-relation-search-tab>
                 </ng-template>
             </li>
             <li ngbNavItem *ngFor="let source of (externalSourcesRD$ | async); let idx = index">
                 <a ngbNavLink>{{'submission.sections.describe.relationship-lookup.search-tab.tab-title.' + source.id | translate  : { count: (totalExternal$ | async)[idx] } }}</a>
                 <ng-template ngbNavContent>
-                    <ds-dynamic-lookup-relation-external-source-tab
+                    <ds-themed-dynamic-lookup-relation-external-source-tab
                             [label]="label"
                             [listId]="listId"
                             [repeatable]="repeatable"
@@ -45,7 +45,7 @@
                             [externalSource]="source"
                             (importedObject)="imported($event)"
                             class="d-block pt-3">
-                    </ds-dynamic-lookup-relation-external-source-tab>
+                    </ds-themed-dynamic-lookup-relation-external-source-tab>
                 </ng-template>
             </li>
             <li ngbNavItem *ngIf="!isEditRelationship">

src/app/shared/form/builder/ds-dynamic-form-ui/relation-lookup-modal/external-source-tab/dynamic-lookup-relation-external-source-tab.component.html

@@ -4,10 +4,10 @@
     <ds-page-size-selector></ds-page-size-selector>
   </div>
   <div class="col-8">
-    <ds-search-form [query]="(searchConfigService.paginatedSearchOptions | async)?.query"
+    <ds-themed-search-form [query]="(searchConfigService.paginatedSearchOptions | async)?.query"
                     [inPlaceSearch]="true"
                     [searchPlaceholder]="'submission.sections.describe.relationship-lookup.selection-tab.search-form.placeholder' | translate">
-    </ds-search-form>
+    </ds-themed-search-form>
     <div>
       <h3>{{ 'submission.sections.describe.relationship-lookup.selection-tab.title.' + externalSource.id | translate}}</h3>
       <ng-container *ngVar="(entriesRD$ | async) as entriesRD">

src/app/shared/form/builder/ds-dynamic-form-ui/relation-lookup-modal/external-source-tab/dynamic-lookup-relation-external-source-tab.component.ts

@@ -124,12 +124,13 @@ export class DsDynamicLookupRelationExternalSourceTabComponent implements OnInit
    */
   relatedEntityType: ItemType;
 
-  constructor(private router: Router,
+  constructor(
-              public searchConfigService: SearchConfigurationService,
+    protected router: Router,
-              private externalSourceService: ExternalSourceDataService,
+    public searchConfigService: SearchConfigurationService,
-              private modalService: NgbModal,
+    protected externalSourceService: ExternalSourceDataService,
-              private selectableListService: SelectableListService,
+    protected modalService: NgbModal,
-              private paginationService: PaginationService
+    protected selectableListService: SelectableListService,
+    protected paginationService: PaginationService,
   ) {
   }
 

src/app/shared/form/builder/ds-dynamic-form-ui/relation-lookup-modal/external-source-tab/themed-dynamic-lookup-relation-external-source-tab.component.ts

@@ -0,0 +1,62 @@
+import { ThemedComponent } from '../../../../../theme-support/themed.component';
+import { Component, EventEmitter, Input, Output } from '@angular/core';
+import { RelationshipOptions } from '../../../models/relationship-options.model';
+import { ListableObject } from '../../../../../object-collection/shared/listable-object.model';
+import { Context } from '../../../../../../core/shared/context.model';
+import { Item } from '../../../../../../core/shared/item.model';
+import { SEARCH_CONFIG_SERVICE } from '../../../../../../my-dspace-page/my-dspace-page.component';
+import { SearchConfigurationService } from '../../../../../../core/shared/search/search-configuration.service';
+import { Collection } from '../../../../../../core/shared/collection.model';
+import { ExternalSource } from '../../../../../../core/shared/external-source.model';
+import { DsDynamicLookupRelationExternalSourceTabComponent } from './dynamic-lookup-relation-external-source-tab.component';
+import { fadeIn, fadeInOut } from '../../../../../animations/fade';
+
+@Component({
+  selector: 'ds-themed-dynamic-lookup-relation-external-source-tab',
+  styleUrls: [],
+  templateUrl: '../../../../../theme-support/themed.component.html',
+  providers: [
+    {
+      provide: SEARCH_CONFIG_SERVICE,
+      useClass: SearchConfigurationService
+    }
+  ],
+  animations: [
+    fadeIn,
+    fadeInOut
+  ]
+})
+export class ThemedDynamicLookupRelationExternalSourceTabComponent extends ThemedComponent<DsDynamicLookupRelationExternalSourceTabComponent> {
+  protected inAndOutputNames: (keyof DsDynamicLookupRelationExternalSourceTabComponent & keyof this)[] = ['label', 'listId',
+    'item', 'collection', 'relationship', 'context', 'repeatable', 'importedObject', 'externalSource'];
+
+  @Input() label: string;
+
+  @Input() listId: string;
+
+  @Input() item: Item;
+
+  @Input() collection: Collection;
+
+  @Input() relationship: RelationshipOptions;
+
+  @Input() context: Context;
+
+  @Input() repeatable: boolean;
+
+  @Output() importedObject: EventEmitter<ListableObject> = new EventEmitter<ListableObject>();
+
+  @Input() externalSource: ExternalSource;
+
+  protected getComponentName(): string {
+    return 'DsDynamicLookupRelationExternalSourceTabComponent';
+  }
+
+  protected importThemedComponent(themeName: string): Promise<any> {
+    return import(`../../../../../../../themes/${themeName}/app/shared/form/builder/ds-dynamic-form-ui/relation-lookup-modal/external-source-tab/dynamic-lookup-relation-external-source-tab.component`);
+  }
+
+  protected importUnthemedComponent(): Promise<any> {
+    return import(`./dynamic-lookup-relation-external-source-tab.component`);
+  }
+}

src/app/shared/form/builder/ds-dynamic-form-ui/relation-lookup-modal/search-tab/dynamic-lookup-relation-search-tab.component.html

@@ -9,6 +9,7 @@
            [selectionConfig]="{ repeatable: repeatable, listId: listId }"
            [showScopeSelector]="false"
            [showViewModes]="false"
+           [query]="query"
            (resultFound)="onResultFound($event)"
            (deselectObject)="deselectObject.emit($event)"
            (selectObject)="selectObject.emit($event)">

src/app/shared/form/builder/ds-dynamic-form-ui/relation-lookup-modal/search-tab/dynamic-lookup-relation-search-tab.component.ts

@@ -147,12 +147,12 @@ export class DsDynamicLookupRelationSearchTabComponent implements OnInit, OnDest
   @Output() resultFound: EventEmitter<SearchObjects<DSpaceObject>> = new EventEmitter<SearchObjects<DSpaceObject>>();
 
   constructor(
-    private searchService: SearchService,
+    protected searchService: SearchService,
-    private selectableListService: SelectableListService,
+    protected selectableListService: SelectableListService,
     public searchConfigService: SearchConfigurationService,
     public lookupRelationService: LookupRelationService,
-    private relationshipService: RelationshipDataService,
+    protected relationshipService: RelationshipDataService,
-    private paginationService: PaginationService
+    protected paginationService: PaginationService,
   ) {
   }
 

src/app/shared/form/builder/ds-dynamic-form-ui/relation-lookup-modal/search-tab/themed-dynamic-lookup-relation-search-tab.component.ts

@@ -0,0 +1,71 @@
+import { ThemedComponent } from '../../../../../theme-support/themed.component';
+import { DsDynamicLookupRelationSearchTabComponent } from './dynamic-lookup-relation-search-tab.component';
+import { Component, EventEmitter, Input, Output } from '@angular/core';
+import { RelationshipOptions } from '../../../models/relationship-options.model';
+import { Observable } from 'rxjs';
+import { ListableObject } from '../../../../../object-collection/shared/listable-object.model';
+import { Context } from '../../../../../../core/shared/context.model';
+import { RelationshipType } from '../../../../../../core/shared/item-relationships/relationship-type.model';
+import { Item } from '../../../../../../core/shared/item.model';
+import { SearchResult } from '../../../../../search/models/search-result.model';
+import { SearchObjects } from '../../../../../search/models/search-objects.model';
+import { DSpaceObject } from '../../../../../../core/shared/dspace-object.model';
+import { SEARCH_CONFIG_SERVICE } from '../../../../../../my-dspace-page/my-dspace-page.component';
+import { SearchConfigurationService } from '../../../../../../core/shared/search/search-configuration.service';
+
+@Component({
+  selector: 'ds-themed-dynamic-lookup-relation-search-tab',
+  styleUrls: [],
+  templateUrl: '../../../../../theme-support/themed.component.html',
+  providers: [
+    {
+      provide: SEARCH_CONFIG_SERVICE,
+      useClass: SearchConfigurationService
+    }
+  ]
+})
+export class ThemedDynamicLookupRelationSearchTabComponent extends ThemedComponent<DsDynamicLookupRelationSearchTabComponent> {
+  protected inAndOutputNames: (keyof DsDynamicLookupRelationSearchTabComponent & keyof this)[] = ['relationship', 'listId',
+    'query', 'repeatable', 'selection$', 'context', 'relationshipType', 'item', 'isLeft', 'toRemove', 'isEditRelationship',
+    'deselectObject', 'selectObject', 'resultFound'];
+
+  @Input() relationship: RelationshipOptions;
+
+  @Input() listId: string;
+
+  @Input() query: string;
+
+  @Input() repeatable: boolean;
+
+  @Input() selection$: Observable<ListableObject[]>;
+
+  @Input() context: Context;
+
+  @Input() relationshipType: RelationshipType;
+
+  @Input() item: Item;
+
+  @Input() isLeft: boolean;
+
+  @Input() toRemove: SearchResult<Item>[];
+
+  @Input() isEditRelationship: boolean;
+
+  @Output() deselectObject: EventEmitter<ListableObject> = new EventEmitter<ListableObject>();
+
+  @Output() selectObject: EventEmitter<ListableObject> = new EventEmitter<ListableObject>();
+
+  @Output() resultFound: EventEmitter<SearchObjects<DSpaceObject>> = new EventEmitter<SearchObjects<DSpaceObject>>();
+
+  protected getComponentName(): string {
+    return 'DsDynamicLookupRelationSearchTabComponent';
+  }
+
+  protected importThemedComponent(themeName: string): Promise<any> {
+    return import(`../../../../../../../themes/${themeName}/app/shared/form/builder/ds-dynamic-form-ui/relation-lookup-modal/search-tab/dynamic-lookup-relation-search-tab.component`);
+  }
+
+  protected importUnthemedComponent(): Promise<any> {
+    return import(`./dynamic-lookup-relation-search-tab.component`);
+  }
+}

src/app/shared/form/form.module.ts

@@ -40,6 +40,8 @@ import { NgxMaskModule } from 'ngx-mask';
 import { ThemedExternalSourceEntryImportModalComponent } from './builder/ds-dynamic-form-ui/relation-lookup-modal/external-source-tab/external-source-entry-import-modal/themed-external-source-entry-import-modal.component';
 import { NgbDatepickerModule, NgbTimepickerModule } from '@ng-bootstrap/ng-bootstrap';
 import { CdkTreeModule } from '@angular/cdk/tree';
+import { ThemedDynamicLookupRelationSearchTabComponent } from './builder/ds-dynamic-form-ui/relation-lookup-modal/search-tab/themed-dynamic-lookup-relation-search-tab.component';
+import { ThemedDynamicLookupRelationExternalSourceTabComponent } from './builder/ds-dynamic-form-ui/relation-lookup-modal/external-source-tab/themed-dynamic-lookup-relation-external-source-tab.component';
 
 const COMPONENTS = [
   CustomSwitchComponent,
@@ -48,8 +50,10 @@ const COMPONENTS = [
   DsDynamicListComponent,
   DsDynamicLookupComponent,
   DsDynamicLookupRelationSearchTabComponent,
+  ThemedDynamicLookupRelationSearchTabComponent,
   DsDynamicLookupRelationSelectionTabComponent,
   DsDynamicLookupRelationExternalSourceTabComponent,
+  ThemedDynamicLookupRelationExternalSourceTabComponent,
   DsDynamicDisabledComponent,
   DsDynamicLookupRelationModalComponent,
   DsDynamicScrollableDropdownComponent,

src/app/shared/search-form/search-form.component.ts

@@ -37,7 +37,7 @@ export class SearchFormComponent implements OnInit {
   /**
    * True when the search component should show results on the current page
    */
-  @Input() inPlaceSearch;
+  @Input() inPlaceSearch: boolean;
 
   /**
    * The currently selected scope object's UUID
@@ -74,12 +74,13 @@ export class SearchFormComponent implements OnInit {
    */
   @Output() submitSearch = new EventEmitter<any>();
 
-  constructor(private router: Router,
+  constructor(
-              private searchService: SearchService,
+    protected router: Router,
-              private paginationService: PaginationService,
+    protected searchService: SearchService,
-              private searchConfig: SearchConfigurationService,
+    protected paginationService: PaginationService,
-              private modalService: NgbModal,
+    protected searchConfig: SearchConfigurationService,
-              private dsoService: DSpaceObjectDataService
+    protected modalService: NgbModal,
+    protected dsoService: DSpaceObjectDataService,
   ) {
   }
 
@@ -120,7 +121,7 @@ export class SearchFormComponent implements OnInit {
   updateSearch(data: any) {
     const queryParams = Object.assign({}, data);
 
-    this.router.navigate(this.getSearchLinkParts(), {
+    void this.router.navigate(this.getSearchLinkParts(), {
       queryParams: queryParams,
       queryParamsHandling: 'merge'
     });

src/app/shared/search-form/themed-search-form.component.ts

@@ -0,0 +1,50 @@
+import { Component, Input, Output, EventEmitter } from '@angular/core';
+import { ThemedComponent } from '../theme-support/themed.component';
+import { SearchFormComponent } from './search-form.component';
+
+/**
+ * Themed wrapper for {@link SearchFormComponent}
+ */
+@Component({
+  selector: 'ds-themed-search-form',
+  styleUrls: [],
+  templateUrl: '../../shared/theme-support/themed.component.html',
+})
+export class ThemedSearchFormComponent extends ThemedComponent<SearchFormComponent> {
+
+  @Input() query: string;
+
+  @Input() inPlaceSearch: boolean;
+
+  @Input() scope: string;
+
+  @Input() currentUrl: string;
+
+  @Input() large: boolean;
+
+  @Input() brandColor: string;
+
+  @Input() searchPlaceholder: string;
+
+  @Input() showScopeSelector: boolean;
+
+  @Output() submitSearch: EventEmitter<any> = new EventEmitter();
+
+  protected inAndOutputNames: (keyof SearchFormComponent & keyof this)[] = [
+    'query', 'inPlaceSearch', 'scope', 'currentUrl', 'large', 'brandColor', 'searchPlaceholder', 'showScopeSelector',
+    'submitSearch',
+  ];
+
+  protected getComponentName(): string {
+    return 'SearchFormComponent';
+  }
+
+  protected importThemedComponent(themeName: string): Promise<any> {
+    return import(`../../../themes/${themeName}/app/shared/search-form/search-form.component`);
+  }
+
+  protected importUnthemedComponent(): Promise<any> {
+    return import('./search-form.component');
+  }
+
+}

src/app/shared/search/search.component.html

@@ -80,14 +80,14 @@
 </ng-template>
 
 <ng-template #searchForm>
-    <ds-search-form *ngIf="searchEnabled" id="search-form"
+    <ds-themed-search-form *ngIf="searchEnabled" id="search-form"
                     [query]="(searchOptions$ | async)?.query"
                     [scope]="(searchOptions$ | async)?.scope"
                     [currentUrl]="searchLink"
                     [showScopeSelector]="showScopeSelector"
                     [inPlaceSearch]="inPlaceSearch"
                     [searchPlaceholder]="searchFormPlaceholder | translate">
-    </ds-search-form>
+    </ds-themed-search-form>
     <div class="row mb-3 mb-md-1">
         <div class="labels col-sm-9">
             <ds-search-labels *ngIf="searchEnabled" [inPlaceSearch]="inPlaceSearch"></ds-search-labels>

src/app/shared/search/search.component.ts

@@ -153,6 +153,11 @@ export class SearchComponent implements OnInit {
    */
   @Input() trackStatistics = false;
 
+  /**
+   * The default value for the search query when none is already defined in the {@link SearchConfigurationService}
+   */
+  @Input() query: string;
+
   /**
    * The current configuration used during the search
    */
@@ -309,6 +314,9 @@ export class SearchComponent implements OnInit {
           configuration: searchOptions.configuration || configuration,
           sort: sortOption || searchOptions.sort
         });
+      if (combinedOptions.query === '') {
+        combinedOptions.query = this.query;
+      }
       const newSearchOptions = new PaginatedSearchOptions(combinedOptions);
       // check if search options are changed
       // if so retrieve new related results otherwise skip it

src/app/shared/search/themed-search.component.ts

@@ -19,7 +19,7 @@ import { ListableObject } from '../object-collection/shared/listable-object.mode
   templateUrl: '../theme-support/themed.component.html',
 })
 export class ThemedSearchComponent extends ThemedComponent<SearchComponent> {
-  protected inAndOutputNames: (keyof SearchComponent & keyof this)[] = ['configurationList', 'context', 'configuration', 'fixedFilterQuery', 'useCachedVersionIfAvailable', 'inPlaceSearch', 'linkType', 'paginationId', 'searchEnabled', 'sideBarWidth', 'searchFormPlaceholder', 'selectable', 'selectionConfig', 'showCsvExport', 'showSidebar', 'showViewModes', 'useUniquePageId', 'viewModeList', 'showScopeSelector', 'resultFound', 'deselectObject', 'selectObject', 'trackStatistics'];
+  protected inAndOutputNames: (keyof SearchComponent & keyof this)[] = ['configurationList', 'context', 'configuration', 'fixedFilterQuery', 'useCachedVersionIfAvailable', 'inPlaceSearch', 'linkType', 'paginationId', 'searchEnabled', 'sideBarWidth', 'searchFormPlaceholder', 'selectable', 'selectionConfig', 'showCsvExport', 'showSidebar', 'showViewModes', 'useUniquePageId', 'viewModeList', 'showScopeSelector', 'resultFound', 'deselectObject', 'selectObject', 'trackStatistics', 'query'];
 
   @Input() configurationList: SearchConfigurationOption[] = [];
 
@@ -61,6 +61,8 @@ export class ThemedSearchComponent extends ThemedComponent<SearchComponent> {
 
   @Input() trackStatistics = false;
 
+  @Input() query: string;
+
   @Output() resultFound: EventEmitter<SearchObjects<DSpaceObject>> = new EventEmitter<SearchObjects<DSpaceObject>>();
 
   @Output() deselectObject: EventEmitter<ListableObject> = new EventEmitter<ListableObject>();

src/app/shared/shared.module.ts

@@ -51,6 +51,7 @@ import { LoadingComponent } from './loading/loading.component';
 import { PaginationComponent } from './pagination/pagination.component';
 import { ThumbnailComponent } from '../thumbnail/thumbnail.component';
 import { SearchFormComponent } from './search-form/search-form.component';
+import { ThemedSearchFormComponent } from './search-form/themed-search-form.component';
 import {
   SearchResultGridElementComponent
 } from './object-grid/search-result-grid-element/search-result-grid-element.component';
@@ -330,6 +331,7 @@ const COMPONENTS = [
   PaginationComponent,
   RSSComponent,
   SearchFormComponent,
+  ThemedSearchFormComponent,
   PageWithSidebarComponent,
   SidebarDropdownComponent,
   ThumbnailComponent,

src/themes/custom/app/item-page/alerts/item-alerts.component.ts

@@ -0,0 +1,12 @@
+import { Component } from '@angular/core';
+import { ItemAlertsComponent as BaseComponent } from '../../../../../app/item-page/alerts/item-alerts.component';
+
+@Component({
+  selector: 'ds-item-alerts',
+  // templateUrl: './item-alerts.component.html',
+  templateUrl: '../../../../../app/item-page/alerts/item-alerts.component.html',
+  // styleUrls: ['./item-alerts.component.scss'],
+  styleUrls: ['../../../../../app/item-page/alerts/item-alerts.component.scss'],
+})
+export class ItemAlertsComponent extends BaseComponent {
+}

src/themes/custom/app/item-page/full/field-components/file-section/full-file-section.component.ts

@@ -0,0 +1,14 @@
+import { Component } from '@angular/core';
+import {
+  FullFileSectionComponent as BaseComponent
+} from '../../../../../../../app/item-page/full/field-components/file-section/full-file-section.component';
+
+@Component({
+  selector: 'ds-item-page-full-file-section',
+  // styleUrls: ['./full-file-section.component.scss'],
+  styleUrls: ['../../../../../../../app/item-page/full/field-components/file-section/full-file-section.component.scss'],
+  // templateUrl: './full-file-section.component.html',
+  templateUrl: '../../../../../../../app/item-page/full/field-components/file-section/full-file-section.component.html',
+})
+export class FullFileSectionComponent extends BaseComponent {
+}

src/themes/custom/app/item-page/simple/metadata-representation-list/metadata-representation-list.component.ts

@@ -0,0 +1,11 @@
+import { MetadataRepresentationListComponent as BaseComponent } from '../../../../../../app/item-page/simple/metadata-representation-list/metadata-representation-list.component';
+import { Component } from '@angular/core';
+
+@Component({
+  selector: 'ds-metadata-representation-list',
+  // templateUrl: './metadata-representation-list.component.html'
+  templateUrl: '../../../../../../app/item-page/simple/metadata-representation-list/metadata-representation-list.component.html'
+})
+export class MetadataRepresentationListComponent extends BaseComponent {
+
+}

src/themes/custom/app/shared/form/builder/ds-dynamic-form-ui/relation-lookup-modal/external-source-tab/dynamic-lookup-relation-external-source-tab.component.ts

@@ -0,0 +1,26 @@
+import { DsDynamicLookupRelationExternalSourceTabComponent as BaseComponent } from '../../../../../../../../../app/shared/form/builder/ds-dynamic-form-ui/relation-lookup-modal/external-source-tab/dynamic-lookup-relation-external-source-tab.component';
+import { Component } from '@angular/core';
+import { SEARCH_CONFIG_SERVICE } from '../../../../../../../../../app/my-dspace-page/my-dspace-page.component';
+import { SearchConfigurationService } from '../../../../../../../../../app/core/shared/search/search-configuration.service';
+import { fadeIn, fadeInOut } from '../../../../../../../../../app/shared/animations/fade';
+
+@Component({
+  selector: 'ds-dynamic-lookup-relation-external-source-tab',
+  // styleUrls: ['./dynamic-lookup-relation-external-source-tab.component.scss'],
+  styleUrls: ['../../../../../../../../../app/shared/form/builder/ds-dynamic-form-ui/relation-lookup-modal/external-source-tab/dynamic-lookup-relation-external-source-tab.component.scss'],
+  // templateUrl: './dynamic-lookup-relation-external-source-tab.component.html',
+  templateUrl: '../../../../../../../../../app/shared/form/builder/ds-dynamic-form-ui/relation-lookup-modal/external-source-tab/dynamic-lookup-relation-external-source-tab.component.html',
+  providers: [
+    {
+      provide: SEARCH_CONFIG_SERVICE,
+      useClass: SearchConfigurationService
+    }
+  ],
+  animations: [
+    fadeIn,
+    fadeInOut
+  ]
+})
+export class DsDynamicLookupRelationExternalSourceTabComponent extends BaseComponent {
+
+}

src/themes/custom/app/shared/form/builder/ds-dynamic-form-ui/relation-lookup-modal/search-tab/dynamic-lookup-relation-search-tab.component.ts

@@ -0,0 +1,21 @@
+import { DsDynamicLookupRelationSearchTabComponent as BaseComponent } from '../../../../../../../../../app/shared/form/builder/ds-dynamic-form-ui/relation-lookup-modal/search-tab/dynamic-lookup-relation-search-tab.component';
+import { Component } from '@angular/core';
+import { SEARCH_CONFIG_SERVICE } from '../../../../../../../../../app/my-dspace-page/my-dspace-page.component';
+import { SearchConfigurationService } from '../../../../../../../../../app/core/shared/search/search-configuration.service';
+
+@Component({
+  selector: 'ds-dynamic-lookup-relation-search-tab',
+  // styleUrls: ['./dynamic-lookup-relation-search-tab.component.scss'],
+  styleUrls: ['../../../../../../../../../app/shared/form/builder/ds-dynamic-form-ui/relation-lookup-modal/search-tab/dynamic-lookup-relation-search-tab.component.scss'],
+  // templateUrl: './dynamic-lookup-relation-search-tab.component.html',
+  templateUrl: '../../../../../../../../../app/shared/form/builder/ds-dynamic-form-ui/relation-lookup-modal/search-tab/dynamic-lookup-relation-search-tab.component.html',
+  providers: [
+    {
+      provide: SEARCH_CONFIG_SERVICE,
+      useClass: SearchConfigurationService
+    }
+  ]
+})
+export class DsDynamicLookupRelationSearchTabComponent extends BaseComponent {
+
+}

src/themes/custom/app/shared/object-list/search-result-list-element/item-search-result/item-types/item/item-search-result-list-element.component.ts

@@ -0,0 +1,24 @@
+import { Component } from '@angular/core';
+import {
+  listableObjectComponent
+} from '../../../../../../../../../app/shared/object-collection/shared/listable-object/listable-object.decorator';
+import { ViewMode } from '../../../../../../../../../app/core/shared/view-mode.model';
+import {
+  ItemSearchResult
+} from '../../../../../../../../../app/shared/object-collection/shared/item-search-result.model';
+import {
+  ItemSearchResultListElementComponent as BaseComponent
+} from '../../../../../../../../../app/shared/object-list/search-result-list-element/item-search-result/item-types/item/item-search-result-list-element.component';
+import { Context } from '../../../../../../../../../app/core/shared/context.model';
+
+@listableObjectComponent('PublicationSearchResult', ViewMode.ListElement, Context.Any, 'custom')
+@listableObjectComponent(ItemSearchResult, ViewMode.ListElement, Context.Any, 'custom')
+@Component({
+  selector: 'ds-item-search-result-list-element',
+  // styleUrls: ['./item-search-result-list-element.component.scss'],
+  styleUrls: ['../../../../../../../../../app/shared/object-list/search-result-list-element/item-search-result/item-types/item/item-search-result-list-element.component.scss'],
+  // templateUrl: './item-search-result-list-element.component.html',
+  templateUrl: '../../../../../../../../../app/shared/object-list/search-result-list-element/item-search-result/item-types/item/item-search-result-list-element.component.html',
+})
+export class ItemSearchResultListElementComponent extends BaseComponent {
+}

src/themes/custom/app/shared/object-list/sidebar-search-list-element/item-types/publication-sidebar-search-list-element.component.ts

@@ -0,0 +1,20 @@
+import { listableObjectComponent } from '../../../../../../../app/shared/object-collection/shared/listable-object/listable-object.decorator';
+import { ViewMode } from '../../../../../../../app/core/shared/view-mode.model';
+import { Component } from '@angular/core';
+import { Context } from '../../../../../../../app/core/shared/context.model';
+import { ItemSearchResult } from '../../../../../../../app/shared/object-collection/shared/item-search-result.model';
+import {
+  PublicationSidebarSearchListElementComponent as BaseComponent
+} from '../../../../../../../app/shared/object-list/sidebar-search-list-element/item-types/publication/publication-sidebar-search-list-element.component';
+
+@listableObjectComponent('PublicationSearchResult', ViewMode.ListElement, Context.SideBarSearchModal, 'custom')
+@listableObjectComponent('PublicationSearchResult', ViewMode.ListElement, Context.SideBarSearchModalCurrent, 'custom')
+@listableObjectComponent(ItemSearchResult, ViewMode.ListElement, Context.SideBarSearchModal, 'custom')
+@listableObjectComponent(ItemSearchResult, ViewMode.ListElement, Context.SideBarSearchModalCurrent, 'custom')
+@Component({
+  selector: 'ds-publication-sidebar-search-list-element',
+  // templateUrl: './publication-sidebar-search-list-element.component.html',
+  templateUrl: '../../../../../../../app/shared/object-list/sidebar-search-list-element/sidebar-search-list-element.component.html',
+})
+export class PublicationSidebarSearchListElementComponent extends BaseComponent {
+}

src/themes/custom/app/shared/search-form/search-form.component.ts

@@ -0,0 +1,14 @@
+import { Component } from '@angular/core';
+import {
+  SearchFormComponent as BaseComponent,
+} from '../../../../../app/shared/search-form/search-form.component';
+
+@Component({
+  selector: 'ds-search-form',
+  // styleUrls: ['./search-form.component.scss'],
+  styleUrls: ['../../../../../app/shared/search-form/search-form.component.scss'],
+  // templateUrl: './search-form.component.html',
+  templateUrl: '../../../../../app/shared/search-form/search-form.component.html',
+})
+export class SearchFormComponent extends BaseComponent {
+}

src/themes/custom/app/shared/starts-with/date/starts-with-date.component.ts

@@ -0,0 +1,16 @@
+import { Component } from '@angular/core';
+import { renderStartsWithFor, StartsWithType } from '../../../../../../app/shared/starts-with/starts-with-decorator';
+import {
+  StartsWithDateComponent as BaseComponent
+} from '../../../../../../app/shared/starts-with/date/starts-with-date.component';
+
+@Component({
+  selector: 'ds-starts-with-date',
+  // styleUrls: ['./starts-with-date.component.scss'],
+  styleUrls: ['../../../../../../app/shared/starts-with/date/starts-with-date.component.scss'],
+  // templateUrl: './starts-with-date.component.html',
+  templateUrl: '../../../../../../app/shared/starts-with/date/starts-with-date.component.html',
+})
+@renderStartsWithFor(StartsWithType.date)
+export class StartsWithDateComponent extends BaseComponent {
+}

src/themes/custom/app/shared/starts-with/text/starts-with-text.component.ts

@@ -0,0 +1,16 @@
+import { Component } from '@angular/core';
+import { renderStartsWithFor, StartsWithType } from '../../../../../../app/shared/starts-with/starts-with-decorator';
+import {
+  StartsWithTextComponent as BaseComponent
+} from '../../../../../../app/shared/starts-with/text/starts-with-text.component';
+
+@Component({
+  selector: 'ds-starts-with-text',
+  // styleUrls: ['./starts-with-text.component.scss'],
+  styleUrls: ['../../../../../../app/shared/starts-with/text/starts-with-text.component.scss'],
+  // templateUrl: './starts-with-text.component.html',
+  templateUrl: '../../../../../../app/shared/starts-with/text/starts-with-text.component.html',
+})
+@renderStartsWithFor(StartsWithType.text)
+export class StartsWithTextComponent extends BaseComponent {
+}

src/themes/custom/eager-theme.module.ts

@@ -38,7 +38,6 @@ import {
 import {
     EditItemSelectorComponent
 } from './app/shared/dso-selector/modal-wrappers/edit-item-selector/edit-item-selector.component';
-
 import { CommunityListElementComponent } from './app/shared/object-list/community-list-element/community-list-element.component';
 import { CollectionListElementComponent} from './app/shared/object-list/collection-list-element/collection-list-element.component';
 import { CollectionDropdownComponent } from './app/shared/collection-dropdown/collection-dropdown.component';
@@ -46,7 +45,14 @@ import { SharedBrowseByModule } from '../../app/shared/browse-by/shared-browse-b
 import { ResultsBackButtonModule } from '../../app/shared/results-back-button/results-back-button.module';
 import { DsoPageModule } from '../../app/shared/dso-page/dso-page.module';
 import { FileDownloadLinkComponent } from './app/shared/file-download-link/file-download-link.component';
-
+import { StartsWithDateComponent } from './app/shared/starts-with/date/starts-with-date.component';
+import { StartsWithTextComponent } from './app/shared/starts-with/text/starts-with-text.component';
+import {
+  PublicationSidebarSearchListElementComponent
+} from './app/shared/object-list/sidebar-search-list-element/item-types/publication-sidebar-search-list-element.component';
+import {
+  ItemSearchResultListElementComponent
+} from './app/shared/object-list/search-result-list-element/item-search-result/item-types/item/item-search-result-list-element.component';
 
 /**
  * Add components that use a custom decorator to ENTRY_COMPONENTS as well as DECLARATIONS.
@@ -58,11 +64,14 @@ const ENTRY_COMPONENTS = [
   JournalVolumeComponent,
   PublicationComponent,
   UntypedItemComponent,
-
   CommunityListElementComponent,
   CollectionListElementComponent,
   CollectionDropdownComponent,
   FileDownloadLinkComponent,
+  StartsWithDateComponent,
+  StartsWithTextComponent,
+  PublicationSidebarSearchListElementComponent,
+  ItemSearchResultListElementComponent,
 ];
 
 const DECLARATIONS = [

src/themes/custom/lazy-theme.module.ts

@@ -50,6 +50,7 @@ import { BrowseBySwitcherComponent } from './app/browse-by/browse-by-switcher/br
 import { CommunityListPageComponent } from './app/community-list-page/community-list-page.component';
 import { SearchPageComponent } from './app/search-page/search-page.component';
 import { ConfigurationSearchPageComponent } from './app/search-page/configuration-search-page.component';
+import { SearchFormComponent } from './app/shared/search-form/search-form.component';
 import { EndUserAgreementComponent } from './app/info/end-user-agreement/end-user-agreement.component';
 import { PageNotFoundComponent } from './app/pagenotfound/pagenotfound.component';
 import { ObjectNotFoundComponent } from './app/lookup-by-id/objectnotfound/objectnotfound.component';
@@ -125,6 +126,13 @@ import { DsoEditMetadataComponent } from './app/dso-shared/dso-edit-metadata/dso
 import { DsoSharedModule } from '../../app/dso-shared/dso-shared.module';
 import { SystemWideAlertModule } from '../../app/system-wide-alert/system-wide-alert.module';
 import { DsoPageModule } from '../../app/shared/dso-page/dso-page.module';
+import { ItemAlertsComponent } from './app/item-page/alerts/item-alerts.component';
+import {
+  FullFileSectionComponent
+} from './app/item-page/full/field-components/file-section/full-file-section.component';
+import { MetadataRepresentationListComponent } from './app/item-page/simple/metadata-representation-list/metadata-representation-list.component';
+import { DsDynamicLookupRelationSearchTabComponent } from './app/shared/form/builder/ds-dynamic-form-ui/relation-lookup-modal/search-tab/dynamic-lookup-relation-search-tab.component';
+import { DsDynamicLookupRelationExternalSourceTabComponent } from './app/shared/form/builder/ds-dynamic-form-ui/relation-lookup-modal/external-source-tab/dynamic-lookup-relation-external-source-tab.component';
 
 const DECLARATIONS = [
   FileSectionComponent,
@@ -134,6 +142,7 @@ const DECLARATIONS = [
   CommunityListPageComponent,
   SearchPageComponent,
   ConfigurationSearchPageComponent,
+  SearchFormComponent,
   EndUserAgreementComponent,
   PageNotFoundComponent,
   ObjectNotFoundComponent,
@@ -181,6 +190,11 @@ const DECLARATIONS = [
   ExternalSourceEntryImportModalComponent,
   ResultsBackButtonComponent,
   DsoEditMetadataComponent,
+  ItemAlertsComponent,
+  FullFileSectionComponent,
+  MetadataRepresentationListComponent,
+  DsDynamicLookupRelationSearchTabComponent,
+  DsDynamicLookupRelationExternalSourceTabComponent,
 ];
 
 @NgModule({