Merge remote-tracking branch 'upstream/main' into media-viewer-thumbnail-width_contribute-main

# Conflicts: # src/app/item-page/simple/item-types/publication/publication.component.html # src/app/item-page/simple/item-types/untyped-item/untyped-item.component.html
2025-10-07 10:04:11 +00:00 · 2023-03-24 00:18:33 +01:00
parent f1d675bbe2 d0ccec9d0e
commit ebfef74adb
51 changed files with 6027 additions and 2165 deletions
--- a/package.json
+++ b/package.json
@@ -198,7 +198,7 @@
    "sass-resources-loader": "^2.1.1",
    "ts-node": "^8.10.2",
    "typescript": "~4.5.5",
-    "webpack": "^5.69.1",
+    "webpack": "^5.76.0",
    "webpack-bundle-analyzer": "^4.4.0",
    "webpack-cli": "^4.2.0",
    "webpack-dev-server": "^4.5.0"
--- a/src/app/access-control/epeople-registry/eperson-form/eperson-form.component.html
+++ b/src/app/access-control/epeople-registry/eperson-form/eperson-form.component.html
@@ -13,12 +13,13 @@
         [formGroup]="formGroup"
         [formLayout]="formLayout"
         [displayCancel]="false"
+         [submitLabel]="submitLabel"
         (submitForm)="onSubmit()">
  <div before class="btn-group">
    <button (click)="onCancel()"
            class="btn btn-outline-secondary"><i class="fas fa-arrow-left"></i> {{messagePrefix + '.return' | translate}}</button>
  </div>
-  <div between class="btn-group">
+  <div *ngIf="displayResetPassword" between class="btn-group">
    <button class="btn btn-primary" [disabled]="!(canReset$ | async)" (click)="resetPassword()">
      <i class="fa fa-key"></i> {{'admin.access-control.epeople.actions.reset' | translate}}
    </button>
--- a/src/app/access-control/epeople-registry/eperson-form/eperson-form.component.ts
+++ b/src/app/access-control/epeople-registry/eperson-form/eperson-form.component.ts
@@ -165,6 +165,15 @@ export class EPersonFormComponent implements OnInit, OnDestroy {
   */
  isImpersonated = false;

+  /**
+   * A boolean that indicate if to display EPersonForm's Rest password button
+   */
+  displayResetPassword = false;
+
+  /**
+   * A string that indicate the label of Submit button
+   */
+  submitLabel = 'form.create';
  /**
   * Subscription to email field value change
   */
@@ -188,6 +197,8 @@ export class EPersonFormComponent implements OnInit, OnDestroy {
      this.epersonInitial = eperson;
      if (hasValue(eperson)) {
        this.isImpersonated = this.authService.isImpersonatingUser(eperson.id);
+        this.displayResetPassword = true;
+        this.submitLabel = 'form.submit';
      }
    }));
  }
--- a/src/app/app-routing.module.ts
+++ b/src/app/app-routing.module.ts
@@ -218,7 +218,8 @@ import { ThemedPageErrorComponent } from './page-error/themed-page-error.compone
          {
            path: 'statistics',
            loadChildren: () => import('./statistics-page/statistics-page-routing.module')
-              .then((m) => m.StatisticsPageRoutingModule)
+              .then((m) => m.StatisticsPageRoutingModule),
+            canActivate: [EndUserAgreementCurrentUserGuard],
          },
          {
            path: HEALTH_PAGE_PATH,
@@ -228,7 +229,7 @@ import { ThemedPageErrorComponent } from './page-error/themed-page-error.compone
          {
            path: ACCESS_CONTROL_MODULE_PATH,
            loadChildren: () => import('./access-control/access-control.module').then((m) => m.AccessControlModule),
-            canActivate: [GroupAdministratorGuard],
+            canActivate: [GroupAdministratorGuard, EndUserAgreementCurrentUserGuard],
          },
          {
            path: 'subscriptions',
--- a/src/app/browse-by/browse-by-metadata-page/browse-by-metadata-page.component.ts
+++ b/src/app/browse-by/browse-by-metadata-page/browse-by-metadata-page.component.ts
@@ -151,8 +151,15 @@ export class BrowseByMetadataPageComponent implements OnInit, OnDestroy {
      ).subscribe(([params, currentPage, currentSort]: [Params, PaginationComponentOptions, SortOptions]) => {
          this.browseId = params.id || this.defaultBrowseId;
          this.authority = params.authority;
-          this.value = +params.value || params.value || '';
-          this.startsWith = +params.startsWith || params.startsWith;
+
+          if (typeof params.value === 'string'){
+            this.value = params.value.trim();
+          }
+
+          if (typeof params.startsWith === 'string'){
+            this.startsWith = params.startsWith.trim();
+          }
+
          if (isNotEmpty(this.value)) {
            this.updatePageWithItems(
              browseParamsToOptions(params, currentPage, currentSort, this.browseId, this.fetchThumbnails), this.value, this.authority);
@@ -305,7 +312,7 @@ export function browseParamsToOptions(params: any,
    metadata,
    paginationConfig,
    sortConfig,
-    +params.startsWith || params.startsWith,
+    params.startsWith,
    params.scope,
    fetchThumbnail
  );
--- a/src/app/core/locale/locale.service.spec.ts
+++ b/src/app/core/locale/locale.service.spec.ts
@@ -62,14 +62,23 @@ describe('LocaleService test suite', () => {
  });

  describe('getCurrentLanguageCode', () => {
-    it('should return language saved on cookie', () => {
+    beforeEach(() => {
+      spyOn(translateService, 'getLangs').and.returnValue(langList);
+    });
+
+    it('should return the language saved on cookie if it\'s a valid & active language', () => {
      spyOnGet.and.returnValue('de');
      expect(service.getCurrentLanguageCode()).toBe('de');
    });

-    describe('', () => {
-      beforeEach(() => {
-        spyOn(translateService, 'getLangs').and.returnValue(langList);
+    it('should return the default language if the cookie language is disabled', () => {
+      spyOnGet.and.returnValue('disabled');
+      expect(service.getCurrentLanguageCode()).toBe('en');
+    });
+
+    it('should return the default language if the cookie language does not exist', () => {
+      spyOnGet.and.returnValue('does-not-exist');
+      expect(service.getCurrentLanguageCode()).toBe('en');
    });

    it('should return language from browser setting', () => {
@@ -82,7 +91,6 @@ describe('LocaleService test suite', () => {
      expect(service.getCurrentLanguageCode()).toBe('en');
    });
  });
-  });

  describe('getLanguageCodeFromCookie', () => {
    it('should return language from cookie', () => {
--- a/src/app/core/locale/locale.service.ts
+++ b/src/app/core/locale/locale.service.ts
@@ -11,6 +11,7 @@ import { map, mergeMap, take } from 'rxjs/operators';
 import { NativeWindowRef, NativeWindowService } from '../services/window.service';
 import { RouteService } from '../services/route.service';
 import { DOCUMENT } from '@angular/common';
+import { LangConfig } from '../../../config/lang-config.interface';

 export const LANG_COOKIE = 'dsLanguage';

@@ -52,8 +53,7 @@ export class LocaleService {
  getCurrentLanguageCode(): string {
    // Attempt to get the language from a cookie
    let lang = this.getLanguageCodeFromCookie();
-    if (isEmpty(lang)) {
-      // Cookie not found
+    if (isEmpty(lang) || environment.languages.find((langConfig: LangConfig) => langConfig.code === lang && langConfig.active) === undefined) {
      // Attempt to get the browser language from the user
      if (this.translate.getLangs().includes(this.translate.getBrowserLang())) {
        lang = this.translate.getBrowserLang();
--- a/src/app/entity-groups/journal-entities/item-pages/journal-issue/journal-issue.component.html
+++ b/src/app/entity-groups/journal-entities/item-pages/journal-issue/journal-issue.component.html
@@ -1,7 +1,7 @@
 <ds-themed-results-back-button *ngIf="showBackButton | async" [back]="back"></ds-themed-results-back-button>
 <div class="d-flex flex-row">
-  <ds-item-page-title-field [item]="object" class="mr-auto">
-  </ds-item-page-title-field>
+  <ds-themed-item-page-title-field [item]="object" class="mr-auto">
+  </ds-themed-item-page-title-field>
  <ds-dso-edit-menu></ds-dso-edit-menu>
 </div>
 <div class="row">
--- a/src/app/entity-groups/journal-entities/item-pages/journal-volume/journal-volume.component.html
+++ b/src/app/entity-groups/journal-entities/item-pages/journal-volume/journal-volume.component.html
@@ -1,7 +1,7 @@
 <ds-themed-results-back-button *ngIf="showBackButton | async" [back]="back"></ds-themed-results-back-button>
 <div class="d-flex flex-row">
-  <ds-item-page-title-field [item]="object" class="mr-auto">
-  </ds-item-page-title-field>
+  <ds-themed-item-page-title-field [item]="object" class="mr-auto">
+  </ds-themed-item-page-title-field>
  <ds-dso-edit-menu></ds-dso-edit-menu>
 </div>
 <div class="row">
--- a/src/app/entity-groups/journal-entities/item-pages/journal/journal.component.html
+++ b/src/app/entity-groups/journal-entities/item-pages/journal/journal.component.html
@@ -1,7 +1,7 @@
 <ds-themed-results-back-button *ngIf="showBackButton | async" [back]="back"></ds-themed-results-back-button>
 <div class="d-flex flex-row">
-  <ds-item-page-title-field [item]="object" class="mr-auto">
-  </ds-item-page-title-field>
+  <ds-themed-item-page-title-field [item]="object" class="mr-auto">
+  </ds-themed-item-page-title-field>
  <ds-dso-edit-menu></ds-dso-edit-menu>
 </div>
 <div class="row">
--- a/src/app/entity-groups/research-entities/item-pages/org-unit/org-unit.component.html
+++ b/src/app/entity-groups/research-entities/item-pages/org-unit/org-unit.component.html
@@ -1,7 +1,7 @@
 <ds-themed-results-back-button *ngIf="showBackButton | async" [back]="back"></ds-themed-results-back-button>
 <div class="d-flex flex-row">
-  <ds-item-page-title-field [item]="object" class="mr-auto">
-  </ds-item-page-title-field>
+  <ds-themed-item-page-title-field [item]="object" class="mr-auto">
+  </ds-themed-item-page-title-field>
  <ds-dso-edit-menu></ds-dso-edit-menu>
 </div>
 <div class="row">
--- a/src/app/entity-groups/research-entities/item-pages/person/person.component.html
+++ b/src/app/entity-groups/research-entities/item-pages/person/person.component.html
@@ -1,7 +1,7 @@
 <ds-themed-results-back-button *ngIf="showBackButton | async" [back]="back"></ds-themed-results-back-button>
 <div class="d-flex flex-row">
-  <ds-item-page-title-field class="mr-auto" [item]="object">
-  </ds-item-page-title-field>
+  <ds-themed-item-page-title-field class="mr-auto" [item]="object">
+  </ds-themed-item-page-title-field>
  <ds-dso-edit-menu></ds-dso-edit-menu>
 </div>
 <div class="row">
--- a/src/app/entity-groups/research-entities/item-pages/project/project.component.html
+++ b/src/app/entity-groups/research-entities/item-pages/project/project.component.html
@@ -1,7 +1,7 @@
 <ds-themed-results-back-button *ngIf="showBackButton | async" [back]="back"></ds-themed-results-back-button>
 <div class="d-flex flex-row">
-  <ds-item-page-title-field [item]="object" class="mr-auto">
-  </ds-item-page-title-field>
+  <ds-themed-item-page-title-field [item]="object" class="mr-auto">
+  </ds-themed-item-page-title-field>
  <ds-dso-edit-menu></ds-dso-edit-menu>
 </div>
 <div class="row">
--- a/src/app/info/feedback/feedback-form/themed-feedback-form.component.ts
+++ b/src/app/info/feedback/feedback-form/themed-feedback-form.component.ts
@@ -0,0 +1,27 @@
+import { Component } from '@angular/core';
+import { ThemedComponent } from '../../../shared/theme-support/themed.component';
+import { FeedbackFormComponent } from './feedback-form.component';
+
+/**
+ * Themed wrapper for {@link FeedbackFormComponent}
+ */
+@Component({
+  selector: 'ds-themed-feedback-form',
+  styleUrls: [],
+  templateUrl: '../../../shared/theme-support/themed.component.html',
+})
+export class ThemedFeedbackFormComponent extends ThemedComponent<FeedbackFormComponent> {
+
+  protected getComponentName(): string {
+    return 'FeedbackFormComponent';
+  }
+
+  protected importThemedComponent(themeName: string): Promise<any> {
+    return import(`../../../../themes/${themeName}/app/info/feedback/feedback-form/feedback-form.component`);
+  }
+
+  protected importUnthemedComponent(): Promise<any> {
+    return import('./feedback-form.component');
+  }
+
+}
--- a/src/app/info/feedback/feedback.component.html
+++ b/src/app/info/feedback/feedback.component.html
@@ -1,3 +1,3 @@
 <div class="container">
-  <ds-feedback-form></ds-feedback-form>
+  <ds-themed-feedback-form></ds-themed-feedback-form>
 </div>
--- a/src/app/info/info.module.ts
+++ b/src/app/info/info.module.ts
@@ -10,6 +10,7 @@ import { ThemedEndUserAgreementComponent } from './end-user-agreement/themed-end
 import { ThemedPrivacyComponent } from './privacy/themed-privacy.component';
 import { FeedbackComponent } from './feedback/feedback.component';
 import { FeedbackFormComponent } from './feedback/feedback-form/feedback-form.component';
+import { ThemedFeedbackFormComponent } from './feedback/feedback-form/themed-feedback-form.component';
 import { ThemedFeedbackComponent } from './feedback/themed-feedback.component';
 import { FeedbackGuard } from '../core/feedback/feedback.guard';

@@ -23,6 +24,7 @@ const DECLARATIONS = [
  ThemedPrivacyComponent,
  FeedbackComponent,
  FeedbackFormComponent,
+  ThemedFeedbackFormComponent,
  ThemedFeedbackComponent
 ];

--- a/src/app/item-page/full/full-item-page.component.html
+++ b/src/app/item-page/full/full-item-page.component.html
@@ -6,9 +6,8 @@
      <ds-view-tracker [object]="item"></ds-view-tracker>
      <div *ngIf="!item.isWithdrawn || (isAdmin$|async)" class="full-item-info">
        <div class="d-flex flex-row">
-          <ds-item-page-title-field class="mr-auto" [item]="item"></ds-item-page-title-field>
+          <ds-themed-item-page-title-field class="mr-auto" [item]="item"></ds-themed-item-page-title-field>
          <ds-dso-edit-menu></ds-dso-edit-menu>
-
        </div>
        <div class="simple-view-link my-3" *ngIf="!fromSubmissionObject">
          <a class="btn btn-outline-primary" [routerLink]="[(itemPageRoute$ | async)]">
--- a/src/app/item-page/item-page.module.ts
+++ b/src/app/item-page/item-page.module.ts
@@ -34,8 +34,11 @@ import { ResearchEntitiesModule } from '../entity-groups/research-entities/resea
 import { ThemedItemPageComponent } from './simple/themed-item-page.component';
 import { ThemedFullItemPageComponent } from './full/themed-full-item-page.component';
 import { MediaViewerComponent } from './media-viewer/media-viewer.component';
+import { ThemedMediaViewerComponent } from './media-viewer/themed-media-viewer.component';
 import { MediaViewerVideoComponent } from './media-viewer/media-viewer-video/media-viewer-video.component';
+import { ThemedMediaViewerVideoComponent } from './media-viewer/media-viewer-video/themed-media-viewer-video.component';
 import { MediaViewerImageComponent } from './media-viewer/media-viewer-image/media-viewer-image.component';
+import { ThemedMediaViewerImageComponent } from './media-viewer/media-viewer-image/themed-media-viewer-image.component';
 import { NgxGalleryModule } from '@kolkov/ngx-gallery';
 import { MiradorViewerComponent } from './mirador-viewer/mirador-viewer.component';
 import { VersionPageComponent } from './version-page/version-page/version-page.component';
@@ -58,7 +61,6 @@ import {
  ThemedFullFileSectionComponent
 } from './full/field-components/file-section/themed-full-file-section.component';

-
 const ENTRY_COMPONENTS = [
  // put only entry components that use custom decorator
  PublicationComponent,
@@ -87,8 +89,11 @@ const DECLARATIONS = [
  UploadBitstreamComponent,
  AbstractIncrementalListComponent,
  MediaViewerComponent,
+  ThemedMediaViewerComponent,
  MediaViewerVideoComponent,
+  ThemedMediaViewerVideoComponent,
  MediaViewerImageComponent,
+  ThemedMediaViewerImageComponent,
  MiradorViewerComponent,
  VersionPageComponent,
  OrcidPageComponent,
--- a/src/app/item-page/media-viewer/media-viewer-image/media-viewer-image.component.ts
+++ b/src/app/item-page/media-viewer/media-viewer-image/media-viewer-image.component.ts
@@ -18,7 +18,7 @@ export class MediaViewerImageComponent implements OnInit {
  @Input() preview?: boolean;
  @Input() image?: string;

-  loggedin: boolean;
+  thumbnailPlaceholder = './assets/images/replacement_image.svg';

  galleryOptions: NgxGalleryOptions[];
  galleryImages: NgxGalleryImage[];
@@ -28,7 +28,10 @@ export class MediaViewerImageComponent implements OnInit {
   */
  isAuthenticated$: Observable<boolean>;

-  constructor(private authService: AuthService) {}
+  constructor(
+    protected authService: AuthService,
+  ) {
+  }

  /**
   * Thi method sets up the gallery settings and data
@@ -69,20 +72,20 @@ export class MediaViewerImageComponent implements OnInit {
   * @param medias input NgxGalleryImage array
   */
  convertToGalleryImage(medias: MediaViewerItem[]): NgxGalleryImage[] {
-    const mappadImages = [];
+    const mappedImages = [];
    for (const image of medias) {
      if (image.format === 'image') {
-        mappadImages.push({
+        mappedImages.push({
          small: image.thumbnail
            ? image.thumbnail
-            : './assets/images/replacement_image.svg',
+            : this.thumbnailPlaceholder,
          medium: image.thumbnail
            ? image.thumbnail
-            : './assets/images/replacement_image.svg',
+            : this.thumbnailPlaceholder,
          big: image.bitstream._links.content.href,
        });
      }
    }
-    return mappadImages;
+    return mappedImages;
  }
 }
--- a/src/app/item-page/media-viewer/media-viewer-image/themed-media-viewer-image.component.ts
+++ b/src/app/item-page/media-viewer/media-viewer-image/themed-media-viewer-image.component.ts
@@ -0,0 +1,38 @@
+import { Component, Input } from '@angular/core';
+import { ThemedComponent } from '../../../shared/theme-support/themed.component';
+import { MediaViewerImageComponent } from './media-viewer-image.component';
+import { MediaViewerItem } from '../../../core/shared/media-viewer-item.model';
+
+/**
+ * Themed wrapper for {@link MediaViewerImageComponent}.
+ */
+@Component({
+  selector: 'ds-themed-media-viewer-image',
+  styleUrls: [],
+  templateUrl: '../../../shared/theme-support/themed.component.html',
+})
+export class ThemedMediaViewerImageComponent extends ThemedComponent<MediaViewerImageComponent> {
+
+  @Input() images: MediaViewerItem[];
+  @Input() preview?: boolean;
+  @Input() image?: string;
+
+  protected inAndOutputNames: (keyof MediaViewerImageComponent & keyof this)[] = [
+    'images',
+    'preview',
+    'image',
+  ];
+
+  protected getComponentName(): string {
+    return 'MediaViewerImageComponent';
+  }
+
+  protected importThemedComponent(themeName: string): Promise<any> {
+    return import(`../../../../themes/${themeName}/app/item-page/media-viewer/media-viewer-image/media-viewer-image.component`);
+  }
+
+  protected importUnthemedComponent(): Promise<any> {
+    return import('./media-viewer-image.component');
+  }
+
+}
--- a/src/app/item-page/media-viewer/media-viewer-video/media-viewer-video.component.ts
+++ b/src/app/item-page/media-viewer/media-viewer-video/media-viewer-video.component.ts
@@ -4,7 +4,7 @@ import { languageHelper } from './language-helper';
 import { CaptionInfo} from './caption-info';

 /**
- * This componenet renders a video viewer and playlist for the media viewer
+ * This component renders a video viewer and playlist for the media viewer
 */
@Component({
  selector: 'ds-media-viewer-video',
@@ -24,8 +24,6 @@ export class MediaViewerVideoComponent implements OnInit {
    audio: './assets/images/replacement_audio.svg',
  };

-  replacementThumbnail: string;
-
  ngOnInit() {
    this.isCollapsed = false;
    this.filteredMedias = this.medias.filter((media) => media.format === 'audio' || media.format === 'video');
--- a/src/app/item-page/media-viewer/media-viewer-video/themed-media-viewer-video.component.ts
+++ b/src/app/item-page/media-viewer/media-viewer-video/themed-media-viewer-video.component.ts
@@ -0,0 +1,34 @@
+import { Component, Input } from '@angular/core';
+import { ThemedComponent } from '../../../shared/theme-support/themed.component';
+import { MediaViewerItem } from '../../../core/shared/media-viewer-item.model';
+import { MediaViewerVideoComponent } from './media-viewer-video.component';
+
+/**
+ * Themed wrapper for {@link MediaViewerVideoComponent}.
+ */
+@Component({
+  selector: 'ds-themed-media-viewer-video',
+  styleUrls: [],
+  templateUrl: '../../../shared/theme-support/themed.component.html',
+})
+export class ThemedMediaViewerVideoComponent extends ThemedComponent<MediaViewerVideoComponent> {
+
+  @Input() medias: MediaViewerItem[];
+
+  protected inAndOutputNames: (keyof MediaViewerVideoComponent & keyof this)[] = [
+    'medias',
+  ];
+
+  protected getComponentName(): string {
+    return 'MediaViewerVideoComponent';
+  }
+
+  protected importThemedComponent(themeName: string): Promise<any> {
+    return import(`../../../../themes/${themeName}/app/item-page/media-viewer/media-viewer-video/media-viewer-video.component`);
+  }
+
+  protected importUnthemedComponent(): Promise<any> {
+    return import('./media-viewer-video.component');
+  }
+
+}
--- a/src/app/item-page/media-viewer/media-viewer.component.html
+++ b/src/app/item-page/media-viewer/media-viewer.component.html
@@ -12,11 +12,11 @@
            mediaList[0]?.format === 'video' || mediaList[0]?.format === 'audio'
          "
        >
-          <ds-media-viewer-video [medias]="mediaList"></ds-media-viewer-video>
+          <ds-themed-media-viewer-video [medias]="mediaList"></ds-themed-media-viewer-video>
        </ng-container>
      </ng-container>
        <ng-container *ngIf="mediaList[0]?.format === 'image'">
-          <ds-media-viewer-image [images]="mediaList"></ds-media-viewer-image>
+          <ds-themed-media-viewer-image [images]="mediaList"></ds-themed-media-viewer-image>
        </ng-container>
    </ng-container>
    <ng-container
@@ -27,10 +27,10 @@
        mediaList.length === 0
      "
    >
-      <ds-media-viewer-image
+      <ds-themed-media-viewer-image
        [image]="mediaList[0]?.thumbnail || thumbnailPlaceholder"
        [preview]="false"
-      ></ds-media-viewer-image>
+      ></ds-themed-media-viewer-image>
    </ng-container>
  </div>
 </ng-container>
--- a/src/app/item-page/media-viewer/media-viewer.component.spec.ts
+++ b/src/app/item-page/media-viewer/media-viewer.component.spec.ts
@@ -135,7 +135,7 @@ describe('MediaViewerComponent', () => {

    it('should display a default, thumbnail', () => {
      const defaultThumbnail = fixture.debugElement.query(
-        By.css('ds-media-viewer-image')
+        By.css('ds-themed-media-viewer-image')
      );
      expect(defaultThumbnail.nativeElement).toBeDefined();
    });
--- a/src/app/item-page/media-viewer/media-viewer.component.ts
+++ b/src/app/item-page/media-viewer/media-viewer.component.ts
@@ -13,9 +13,8 @@ import { hasValue } from '../../shared/empty.util';
 import { followLink } from '../../shared/utils/follow-link-config.model';

 /**
- * This componenet renders the media viewers
+ * This component renders the media viewers
 */
-
@Component({
  selector: 'ds-media-viewer',
  templateUrl: './media-viewer.component.html',
--- a/src/app/item-page/media-viewer/themed-media-viewer.component.ts
+++ b/src/app/item-page/media-viewer/themed-media-viewer.component.ts
@@ -0,0 +1,36 @@
+import { Component, Input } from '@angular/core';
+import { ThemedComponent } from '../../shared/theme-support/themed.component';
+import { MediaViewerComponent } from './media-viewer.component';
+import { Item } from '../../core/shared/item.model';
+
+/**
+ * Themed wrapper for {@link MediaViewerComponent}.
+ */
+@Component({
+  selector: 'ds-themed-media-viewer',
+  styleUrls: [],
+  templateUrl: '../../shared/theme-support/themed.component.html',
+})
+export class ThemedMediaViewerComponent extends ThemedComponent<MediaViewerComponent> {
+
+  @Input() item: Item;
+  @Input() videoOptions: boolean;
+
+  protected inAndOutputNames: (keyof MediaViewerComponent & keyof this)[] = [
+    'item',
+    'videoOptions',
+  ];
+
+  protected getComponentName(): string {
+    return 'MediaViewerComponent';
+  }
+
+  protected importThemedComponent(themeName: string): Promise<any> {
+    return import(`../../../themes/${themeName}/app/item-page/media-viewer/media-viewer.component`);
+  }
+
+  protected importUnthemedComponent(): Promise<any> {
+    return import('./media-viewer.component');
+  }
+
+}
--- a/src/app/item-page/simple/field-components/specific-field/title/themed-item-page-field.component.ts
+++ b/src/app/item-page/simple/field-components/specific-field/title/themed-item-page-field.component.ts
@@ -0,0 +1,33 @@
+import { Component, Input } from '@angular/core';
+import { ThemedComponent } from '../../../../../shared/theme-support/themed.component';
+import { ItemPageTitleFieldComponent } from './item-page-title-field.component';
+import { Item } from '../../../../../core/shared/item.model';
+
+/**
+ * Themed wrapper for {@link ItemPageTitleFieldComponent}
+ */
+@Component({
+  selector: 'ds-themed-item-page-title-field',
+  styleUrls: [],
+  templateUrl: '../../../../../shared/theme-support/themed.component.html',
+})
+export class ThemedItemPageTitleFieldComponent extends ThemedComponent<ItemPageTitleFieldComponent> {
+
+  protected inAndOutputNames: (keyof ItemPageTitleFieldComponent & keyof this)[] = [
+    'item',
+  ];
+
+  @Input() item: Item;
+
+  protected getComponentName(): string {
+    return 'ItemPageTitleFieldComponent';
+  }
+
+  protected importThemedComponent(themeName: string): Promise<any> {
+    return import(`../../../../../../themes/${themeName}/app/item-page/simple/field-components/specific-field/title/item-page-title-field.component`);
+  }
+
+  protected importUnthemedComponent(): Promise<any> {
+    return import('./item-page-title-field.component');
+  }
+}
--- a/src/app/item-page/simple/item-types/publication/publication.component.html
+++ b/src/app/item-page/simple/item-types/publication/publication.component.html
@@ -9,8 +9,8 @@
  </div>
 </div>
 <div class="d-flex flex-row">
-  <ds-item-page-title-field [item]="object" class="mr-auto">
-  </ds-item-page-title-field>
+  <ds-themed-item-page-title-field [item]="object" class="mr-auto">
+  </ds-themed-item-page-title-field>
  <ds-dso-edit-menu></ds-dso-edit-menu>
 </div>
 <div class="row">
@@ -21,7 +21,7 @@
      </ds-metadata-field-wrapper>
    </ng-container>
    <div *ngIf="mediaViewer.image" class="mb-2">
-      <ds-media-viewer [item]="object" [videoOptions]="mediaViewer.video"></ds-media-viewer>
+      <ds-themed-media-viewer [item]="object" [videoOptions]="mediaViewer.video"></ds-themed-media-viewer>
    </div>
    <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>
--- a/src/app/item-page/simple/item-types/untyped-item/untyped-item.component.html
+++ b/src/app/item-page/simple/item-types/untyped-item/untyped-item.component.html
@@ -10,8 +10,8 @@
 </div>

 <div class="d-flex flex-row">
-  <ds-item-page-title-field [item]="object" class="mr-auto">
-  </ds-item-page-title-field>
+  <ds-themed-item-page-title-field [item]="object" class="mr-auto">
+  </ds-themed-item-page-title-field>
  <ds-dso-edit-menu></ds-dso-edit-menu>
 </div>
 <div class="row">
@@ -22,7 +22,7 @@
      </ds-metadata-field-wrapper>
    </ng-container>
    <div *ngIf="mediaViewer.image" class="mb-2">
-      <ds-media-viewer [item]="object" [videoOptions]="mediaViewer.video"></ds-media-viewer>
+      <ds-themed-media-viewer [item]="object" [videoOptions]="mediaViewer.video"></ds-themed-media-viewer>
    </div>
    <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>
--- a/src/app/shared/object-detail/my-dspace-result-detail-element/item-detail-preview/item-detail-preview.component.html
+++ b/src/app/shared/object-detail/my-dspace-result-detail-element/item-detail-preview/item-detail-preview.component.html
@@ -3,8 +3,8 @@
    <ds-mydspace-item-status [status]="status"></ds-mydspace-item-status>
  </ng-container>
  <div *ngIf="item">
-    <ds-item-page-title-field [item]="item">
-    </ds-item-page-title-field>
+    <ds-themed-item-page-title-field [item]="item">
+    </ds-themed-item-page-title-field>
    <div class="row mb-1">
      <div class="col-xs-12 col-md-4">
        <ds-metadata-field-wrapper [hideIfNoTextContent]="false">
--- a/src/app/shared/rss-feed/rss.component.ts
+++ b/src/app/shared/rss-feed/rss.component.ts
@@ -32,7 +32,7 @@ import { RemoteData } from '../../core/data/remote-data';
 })
 export class RSSComponent implements OnInit, OnDestroy  {

-  route$: BehaviorSubject<string>;
+  route$: BehaviorSubject<string> = new BehaviorSubject<string>('');

  isEnabled$: BehaviorSubject<boolean> = new BehaviorSubject<boolean>(null);

@@ -99,7 +99,7 @@ export class RSSComponent implements OnInit, OnDestroy  {
        rel: 'search',
        title: 'Dspace'
      });
-      this.route$ = new BehaviorSubject<string>(route);
+      this.route$.next(route);
    }));
  }

--- a/src/app/shared/shared.module.ts
+++ b/src/app/shared/shared.module.ts
@@ -268,6 +268,9 @@ import {
 import { EpersonGroupListComponent } from './eperson-group-list/eperson-group-list.component';
 import { EpersonSearchBoxComponent } from './eperson-group-list/eperson-search-box/eperson-search-box.component';
 import { GroupSearchBoxComponent } from './eperson-group-list/group-search-box/group-search-box.component';
+import {
+  ThemedItemPageTitleFieldComponent
+} from '../item-page/simple/field-components/specific-field/title/themed-item-page-field.component';

 const MODULES = [
  CommonModule,
@@ -373,7 +376,8 @@ const COMPONENTS = [
  ContextHelpWrapperComponent,
  EpersonGroupListComponent,
  EpersonSearchBoxComponent,
-  GroupSearchBoxComponent
+  GroupSearchBoxComponent,
+  ThemedItemPageTitleFieldComponent,
 ];

 const ENTRY_COMPONENTS = [
--- a/src/assets/i18n/en.json5
+++ b/src/assets/i18n/en.json5
@@ -1751,6 +1751,8 @@

  "form.submit": "Save",

+  "form.create": "Create",
+
  "form.repeatable.sort.tip": "Drop the item in the new position",


--- a/src/assets/i18n/hu.json5
+++ b/src/assets/i18n/hu.json5
--- a/src/environments/environment.test.ts
+++ b/src/environments/environment.test.ts
@@ -209,6 +209,10 @@ export const environment: BuildConfig = {
    code: 'el',
    label: 'Ελληνικά',
    active: true,
+  }, {
+    code: 'disabled',
+    label: 'Disabled',
+    active: false,
  }],

  // Browse-By Pages
--- a/src/themes/custom/app/info/feedback/feedback-form/feedback-form.component.html
+++ b/src/themes/custom/app/info/feedback/feedback-form/feedback-form.component.html
--- a/src/themes/custom/app/info/feedback/feedback-form/feedback-form.component.scss
+++ b/src/themes/custom/app/info/feedback/feedback-form/feedback-form.component.scss
--- a/src/themes/custom/app/info/feedback/feedback-form/feedback-form.component.ts
+++ b/src/themes/custom/app/info/feedback/feedback-form/feedback-form.component.ts
@@ -0,0 +1,14 @@
+import { Component } from '@angular/core';
+import {
+  FeedbackFormComponent as BaseComponent
+} from '../../../../../../app/info/feedback/feedback-form/feedback-form.component';
+
+@Component({
+  selector: 'ds-feedback-form',
+  // templateUrl: './feedback-form.component.html',
+  templateUrl: '../../../../../../app/info/feedback/feedback-form/feedback-form.component.html',
+  // styleUrls: ['./feedback-form.component.scss'],
+  styleUrls: ['../../../../../../app/info/feedback/feedback-form/feedback-form.component.scss'],
+})
+export class FeedbackFormComponent extends BaseComponent {
+}
--- a/src/themes/custom/app/item-page/media-viewer/media-viewer-image/media-viewer-image.component.html
+++ b/src/themes/custom/app/item-page/media-viewer/media-viewer-image/media-viewer-image.component.html
--- a/src/themes/custom/app/item-page/media-viewer/media-viewer-image/media-viewer-image.component.scss
+++ b/src/themes/custom/app/item-page/media-viewer/media-viewer-image/media-viewer-image.component.scss
--- a/src/themes/custom/app/item-page/media-viewer/media-viewer-image/media-viewer-image.component.ts
+++ b/src/themes/custom/app/item-page/media-viewer/media-viewer-image/media-viewer-image.component.ts
@@ -0,0 +1,14 @@
+import { Component } from '@angular/core';
+import {
+  MediaViewerImageComponent as BaseComponent
+} from '../../../../../../app/item-page/media-viewer/media-viewer-image/media-viewer-image.component';
+
+@Component({
+  selector: 'ds-media-viewer-image',
+  // templateUrl: './media-viewer-image.component.html',
+  templateUrl: '../../../../../../app/item-page/media-viewer/media-viewer-image/media-viewer-image.component.html',
+  // styleUrls: ['./media-viewer-image.component.scss'],
+  styleUrls: ['../../../../../../app/item-page/media-viewer/media-viewer-image/media-viewer-image.component.scss'],
+})
+export class MediaViewerImageComponent extends BaseComponent {
+}
--- a/src/themes/custom/app/item-page/media-viewer/media-viewer-video/media-viewer-video.component.html
+++ b/src/themes/custom/app/item-page/media-viewer/media-viewer-video/media-viewer-video.component.html
--- a/src/themes/custom/app/item-page/media-viewer/media-viewer-video/media-viewer-video.component.scss
+++ b/src/themes/custom/app/item-page/media-viewer/media-viewer-video/media-viewer-video.component.scss
--- a/src/themes/custom/app/item-page/media-viewer/media-viewer-video/media-viewer-video.component.ts
+++ b/src/themes/custom/app/item-page/media-viewer/media-viewer-video/media-viewer-video.component.ts
@@ -0,0 +1,14 @@
+import { Component } from '@angular/core';
+import {
+  MediaViewerVideoComponent as BaseComponent
+} from '../../../../../../app/item-page/media-viewer/media-viewer-video/media-viewer-video.component';
+
+@Component({
+  selector: 'ds-media-viewer-video',
+  // templateUrl: './media-viewer-video.component.html',
+  templateUrl: '../../../../../../app/item-page/media-viewer/media-viewer-video/media-viewer-video.component.html',
+  // styleUrls: ['./media-viewer-video.component.scss'],
+  styleUrls: ['../../../../../../app/item-page/media-viewer/media-viewer-video/media-viewer-video.component.scss'],
+})
+export class MediaViewerVideoComponent extends BaseComponent {
+}
--- a/src/themes/custom/app/item-page/media-viewer/media-viewer.component.html
+++ b/src/themes/custom/app/item-page/media-viewer/media-viewer.component.html
--- a/src/themes/custom/app/item-page/media-viewer/media-viewer.component.scss
+++ b/src/themes/custom/app/item-page/media-viewer/media-viewer.component.scss
@@ -0,0 +1 @@
+
--- a/src/themes/custom/app/item-page/media-viewer/media-viewer.component.ts
+++ b/src/themes/custom/app/item-page/media-viewer/media-viewer.component.ts
@@ -0,0 +1,14 @@
+import { Component } from '@angular/core';
+import {
+  MediaViewerComponent as BaseComponent
+} from '../../../../../app/item-page/media-viewer/media-viewer.component';
+
+@Component({
+  selector: 'ds-media-viewer',
+  // templateUrl: './media-viewer.component.html',
+  templateUrl: '../../../../../app/item-page/media-viewer/media-viewer.component.html',
+  // styleUrls: ['./media-viewer.component.scss'],
+  styleUrls: ['../../../../../app/item-page/media-viewer/media-viewer.component.scss'],
+})
+export class MediaViewerComponent extends BaseComponent {
+}
--- a/src/themes/custom/app/item-page/simple/field-components/specific-field/title/item-page-title-field.component.html
+++ b/src/themes/custom/app/item-page/simple/field-components/specific-field/title/item-page-title-field.component.html
--- a/src/themes/custom/app/item-page/simple/field-components/specific-field/title/item-page-title-field.component.ts
+++ b/src/themes/custom/app/item-page/simple/field-components/specific-field/title/item-page-title-field.component.ts
@@ -0,0 +1,12 @@
+import { Component } from '@angular/core';
+import {
+  ItemPageTitleFieldComponent as BaseComponent
+} from '../../../../../../../../app/item-page/simple/field-components/specific-field/title/item-page-title-field.component';
+
+@Component({
+  selector: 'ds-item-page-title-field',
+  // templateUrl: './item-page-title-field.component.html',
+  templateUrl: '../../../../../../../../app/item-page/simple/field-components/specific-field/title/item-page-title-field.component.html',
+})
+export class ItemPageTitleFieldComponent extends BaseComponent {
+}
--- a/src/themes/custom/lazy-theme.module.ts
+++ b/src/themes/custom/lazy-theme.module.ts
@@ -133,6 +133,18 @@ import {
 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';
+import { FeedbackFormComponent } from './app/info/feedback/feedback-form/feedback-form.component';
+import {
+  ItemPageTitleFieldComponent
+} from './app/item-page/simple/field-components/specific-field/title/item-page-title-field.component';
+import { MediaViewerComponent } from './app/item-page/media-viewer/media-viewer.component';
+import {
+  MediaViewerImageComponent
+} from './app/item-page/media-viewer/media-viewer-image/media-viewer-image.component';
+import {
+  MediaViewerVideoComponent
+} from './app/item-page/media-viewer/media-viewer-video/media-viewer-video.component';
+import { NgxGalleryModule } from '@kolkov/ngx-gallery';

 const DECLARATIONS = [
  FileSectionComponent,
@@ -173,6 +185,7 @@ const DECLARATIONS = [
  WorkflowItemSendBackComponent,
  BreadcrumbsComponent,
  FeedbackComponent,
+  FeedbackFormComponent,
  CommunityListComponent,
  ComcolPageHandleComponent,
  AuthNavMenuComponent,
@@ -195,6 +208,10 @@ const DECLARATIONS = [
  MetadataRepresentationListComponent,
  DsDynamicLookupRelationSearchTabComponent,
  DsDynamicLookupRelationExternalSourceTabComponent,
+  ItemPageTitleFieldComponent,
+  MediaViewerComponent,
+  MediaViewerImageComponent,
+  MediaViewerVideoComponent,
 ];

@NgModule({
@@ -251,7 +268,8 @@ const DECLARATIONS = [
    ResourcePoliciesModule,
    ComcolModule,
    DsoSharedModule,
-    SystemWideAlertModule
+    SystemWideAlertModule,
+    NgxGalleryModule,
  ],
  declarations: DECLARATIONS,
  exports: [
--- a/yarn.lock
+++ b/yarn.lock
@@ -11520,10 +11520,10 @@ webpack@5.70.0:
    watchpack "^2.3.1"
    webpack-sources "^3.2.3"

-webpack@^5.69.1:
-  version "5.75.0"
-  resolved "https://registry.yarnpkg.com/webpack/-/webpack-5.75.0.tgz#1e440468647b2505860e94c9ff3e44d5b582c152"
-  integrity sha512-piaIaoVJlqMsPtX/+3KTTO6jfvrSYgauFVdt8cr9LTHKmcq/AMd4mhzsiP7ZF/PGRNPGA8336jldh9l2Kt2ogQ==
+webpack@^5.76.0:
+  version "5.76.0"
+  resolved "https://registry.yarnpkg.com/webpack/-/webpack-5.76.0.tgz#f9fb9fb8c4a7dbdcd0d56a98e56b8a942ee2692c"
+  integrity sha512-l5sOdYBDunyf72HW8dF23rFtWq/7Zgvt/9ftMof71E/yUb1YLOBmTgA2K4vQthB3kotMrSj609txVE0dnr2fjA==
  dependencies:
    "@types/eslint-scope" "^3.7.3"
    "@types/estree" "^0.0.51"