From 1666c8692aa03056140b879f43283397549e0b79 Mon Sep 17 00:00:00 2001
From: pcg-kk <krzysztof.kubiak@pcgacademia.pl>
Date: Thu, 23 May 2024 21:51:48 +0200
Subject: [PATCH] fix: move translateService.currentLang assignment to the
 component

fix: order of elements

fix: changes after code review

feat: fix e2e

feat: next test fix

feat: first test fix

feat: fix unit

feat: use the metadata with correct language
feat: provide a language support for community pages
---
 cypress/e2e/collection-create.cy.ts           |   4 +-
 cypress/e2e/community-create.cy.ts            |   4 +-
 .../collection-form.component.ts              |  25 ++-
 .../collection-form/collection-form.models.ts |  78 ++++----
 .../collection-page.component.html            |   8 +-
 .../collection-page.component.ts              |  14 +-
 .../community-list.component.html             |   8 +-
 .../community-list.component.ts               |  17 +-
 .../community-form.component.ts               |  71 +++----
 .../community-form/community-form.models.ts   |  48 +++++
 .../community-page.component.html             |   8 +-
 .../community-page.component.ts               |  14 +-
 src/app/core/breadcrumbs/dso-name.service.ts  |   4 +
 src/app/core/shared/collection.model.ts       |  20 +-
 src/app/core/shared/community.model.ts        |  16 +-
 .../comcol-form/comcol-form.component.html    |  63 ++++++-
 .../comcol-form/comcol-form.component.scss    |   7 +
 .../comcol-form/comcol-form.component.spec.ts |  64 ++++---
 .../comcol-form/comcol-form.component.ts      | 176 +++++++++++++-----
 .../shared/mocks/translate.service.mock.ts    |  12 ++
 .../collection-grid-element.component.html    |   2 +-
 .../collection-grid-element.component.ts      |  15 +-
 .../community-grid-element.component.html     |   2 +-
 .../community-grid-element.component.ts       |  15 +-
 ...-search-result-grid-element.component.html |   2 +-
 ...on-search-result-grid-element.component.ts |  14 +-
 ...-search-result-grid-element.component.html |   2 +-
 ...ty-search-result-grid-element.component.ts |  15 +-
 .../collection-list-element.component.html    |   4 +-
 .../collection-list-element.component.spec.ts |   3 +
 .../collection-list-element.component.ts      |  20 +-
 .../community-list-element.component.html     |   4 +-
 .../community-list-element.component.spec.ts  |   3 +
 .../community-list-element.component.ts       |  10 +
 ...-search-result-list-element.component.html |   2 +-
 ...arch-result-list-element.component.spec.ts |   3 +
 ...on-search-result-list-element.component.ts |  23 +++
 ...-search-result-list-element.component.html |   2 +-
 ...arch-result-list-element.component.spec.ts |   3 +
 ...ty-search-result-list-element.component.ts |  24 +++
 src/assets/i18n/en.json5                      |   4 +
 src/assets/i18n/pl.json5                      |   2 +
 42 files changed, 608 insertions(+), 227 deletions(-)
 create mode 100644 src/app/community-page/community-form/community-form.models.ts

diff --git a/cypress/e2e/collection-create.cy.ts b/cypress/e2e/collection-create.cy.ts
index 29f7dd5cacb..423464233f8 100644
--- a/cypress/e2e/collection-create.cy.ts
+++ b/cypress/e2e/collection-create.cy.ts
@@ -5,9 +5,9 @@ beforeEach(() => {
 
 it('should show loading component while saving', () => {
   const title = 'Test Collection Title';
-  cy.get('#title').type(title);
+  cy.get('#title-en').type(title);
 
-  cy.get('button[type="submit"]').click();
+  cy.get('button[type="button"].btn-primary').click();
 
   cy.get('ds-loading').should('be.visible');
 });
diff --git a/cypress/e2e/community-create.cy.ts b/cypress/e2e/community-create.cy.ts
index 96bc003ba2a..205f270db14 100644
--- a/cypress/e2e/community-create.cy.ts
+++ b/cypress/e2e/community-create.cy.ts
@@ -5,9 +5,9 @@ beforeEach(() => {
 
 it('should show loading component while saving', () => {
   const title = 'Test Community Title';
-  cy.get('#title').type(title);
+  cy.get('#title-en').type(title);
 
-  cy.get('button[type="submit"]').click();
+  cy.get('button[type="button"].btn-primary').click();
 
   cy.get('ds-loading').should('be.visible');
 });
diff --git a/src/app/collection-page/collection-form/collection-form.component.ts b/src/app/collection-page/collection-form/collection-form.component.ts
index 0758435db88..9338d744b37 100644
--- a/src/app/collection-page/collection-form/collection-form.component.ts
+++ b/src/app/collection-page/collection-form/collection-form.component.ts
@@ -1,6 +1,7 @@
 import {
   AsyncPipe,
   NgClass,
+  NgForOf,
   NgIf,
 } from '@angular/common';
 import {
@@ -12,6 +13,7 @@ import {
   SimpleChange,
   SimpleChanges,
 } from '@angular/core';
+import { FormsModule } from '@angular/forms';
 import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
 import {
   DynamicFormControlModel,
@@ -66,7 +68,9 @@ import {
     ComcolPageLogoComponent,
     NgIf,
     NgClass,
+    NgForOf,
     VarDirective,
+    FormsModule,
   ],
 })
 export class CollectionFormComponent extends ComColFormComponent<Collection> implements OnInit, OnChanges {
@@ -101,11 +105,14 @@ export class CollectionFormComponent extends ComColFormComponent<Collection> imp
                      protected objectCache: ObjectCacheService,
                      protected entityTypeService: EntityTypeDataService,
                      protected chd: ChangeDetectorRef,
-                     protected modalService: NgbModal) {
-    super(formService, translate, notificationsService, authService, requestService, objectCache, modalService);
+                     protected modalService: NgbModal,
+                     protected cdr: ChangeDetectorRef) {
+    super(formService, translate, notificationsService, authService, requestService, objectCache, modalService, cdr);
   }
 
   ngOnInit(): void {
+    this.initializeLanguage();
+
     if (hasNoValue(this.formModel) && isNotNull(this.dso)) {
       this.initializeForm();
     }
@@ -148,11 +155,23 @@ export class CollectionFormComponent extends ComColFormComponent<Collection> imp
         }
       });
 
-      this.formModel = entityTypes.length === 0 ? collectionFormModels : [...collectionFormModels, this.entityTypeSelection];
+      this.formModels.set(
+        this.defaultLanguageCode,
+        this.getCollectionFormModels(entityTypes, collectionFormModels(this.defaultLanguageCode, true)),
+      );
+      this.languages.forEach(lang => {
+        this.formModels.set(
+          lang.code,
+          this.getCollectionFormModels(entityTypes, collectionFormModels(lang.code, false)),
+        );
+      });
 
       super.ngOnInit();
       this.chd.detectChanges();
     });
+  }
 
+  private getCollectionFormModels(entityTypes: ItemType[],  dynamicCollectionFormModels: DynamicFormControlModel[]): DynamicFormControlModel[] {
+    return entityTypes.length === 0 ? dynamicCollectionFormModels : [...dynamicCollectionFormModels, this.entityTypeSelection];
   }
 }
diff --git a/src/app/collection-page/collection-form/collection-form.models.ts b/src/app/collection-page/collection-form/collection-form.models.ts
index 22998af674e..f0c35270ebb 100644
--- a/src/app/collection-page/collection-form/collection-form.models.ts
+++ b/src/app/collection-page/collection-form/collection-form.models.ts
@@ -17,41 +17,43 @@ export const collectionFormEntityTypeSelectionConfig: DynamicSelectModelConfig<s
  * The dynamic form fields used for creating/editing a collection
  * @type {(DynamicInputModel | DynamicTextAreaModel)[]}
  */
-export const collectionFormModels: DynamicFormControlModel[] = [
-  new DynamicInputModel({
-    id: 'title',
-    name: 'dc.title',
-    required: true,
-    validators: {
-      required: null,
-    },
-    errorMessages: {
-      required: 'Please enter a name for this title',
-    },
-  }),
-  new DynamicTextAreaModel({
-    id: 'description',
-    name: 'dc.description',
-    spellCheck: environment.form.spellCheck,
-  }),
-  new DynamicTextAreaModel({
-    id: 'abstract',
-    name: 'dc.description.abstract',
-    spellCheck: environment.form.spellCheck,
-  }),
-  new DynamicTextAreaModel({
-    id: 'rights',
-    name: 'dc.rights',
-    spellCheck: environment.form.spellCheck,
-  }),
-  new DynamicTextAreaModel({
-    id: 'tableofcontents',
-    name: 'dc.description.tableofcontents',
-    spellCheck: environment.form.spellCheck,
-  }),
-  new DynamicTextAreaModel({
-    id: 'license',
-    name: 'dc.rights.license',
-    spellCheck: environment.form.spellCheck,
-  }),
-];
+export const collectionFormModels = (lang: string, isDefaultLanguage: boolean): DynamicFormControlModel[] => {
+  return [
+    new DynamicInputModel({
+      id: `title-${lang}`,
+      name: 'dc.title',
+      required: isDefaultLanguage,
+      validators: {
+        required: null,
+      },
+      errorMessages: {
+        required: 'Please enter a name for this title',
+      },
+    }),
+    new DynamicTextAreaModel({
+      id: `description-${lang}`,
+      name: 'dc.description',
+      spellCheck: environment.form.spellCheck,
+    }),
+    new DynamicTextAreaModel({
+      id: `abstract-${lang}`,
+      name: 'dc.description.abstract',
+      spellCheck: environment.form.spellCheck,
+    }),
+    new DynamicTextAreaModel({
+      id: `rights-${lang}`,
+      name: 'dc.rights',
+      spellCheck: environment.form.spellCheck,
+    }),
+    new DynamicTextAreaModel({
+      id: `tableofcontents-${lang}`,
+      name: 'dc.description.tableofcontents',
+      spellCheck: environment.form.spellCheck,
+    }),
+    new DynamicTextAreaModel({
+      id: `license-${lang}`,
+      name: 'dc.rights.license',
+      spellCheck: environment.form.spellCheck,
+    }),
+  ];
+};
diff --git a/src/app/collection-page/collection-page.component.html b/src/app/collection-page/collection-page.component.html
index 4a3e28c6aad..1679ef54ae8 100644
--- a/src/app/collection-page/collection-page.component.html
+++ b/src/app/collection-page/collection-page.component.html
@@ -23,12 +23,12 @@
             </ds-comcol-page-handle>
             <!-- Introductory text -->
             <ds-comcol-page-content
-                [content]="collection.introductoryText"
+                [content]="collection.introductoryText(currentLanguage)"
                 [hasInnerHtml]="true">
             </ds-comcol-page-content>
             <!-- News -->
             <ds-comcol-page-content
-                [content]="collection.sidebarText"
+                [content]="collection.sidebarText(currentLanguage)"
                 [hasInnerHtml]="true"
                 [title]="'collection.page.news'">
             </ds-comcol-page-content>
@@ -44,10 +44,10 @@
 
           <router-outlet></router-outlet>
         </section>
-        <footer *ngIf="collection.copyrightText" class="border-top my-5 pt-4">
+        <footer *ngIf="collection.copyrightText(currentLanguage) as copyrightText" class="border-top my-5 pt-4">
           <!-- Copyright -->
           <ds-comcol-page-content
-              [content]="collection.copyrightText"
+              [content]="copyrightText"
               [hasInnerHtml]="true">
           </ds-comcol-page-content>
         </footer>
diff --git a/src/app/collection-page/collection-page.component.ts b/src/app/collection-page/collection-page.component.ts
index 0d240f5328d..679ea06fbf9 100644
--- a/src/app/collection-page/collection-page.component.ts
+++ b/src/app/collection-page/collection-page.component.ts
@@ -12,7 +12,10 @@ import {
   Router,
   RouterOutlet,
 } from '@angular/router';
-import { TranslateModule } from '@ngx-translate/core';
+import {
+  TranslateModule,
+  TranslateService,
+} from '@ngx-translate/core';
 import { Observable } from 'rxjs';
 import {
   filter,
@@ -21,6 +24,7 @@ import {
   take,
 } from 'rxjs/operators';
 
+import { environment } from '../../environments/environment';
 import { AuthService } from '../core/auth/auth.service';
 import { DSONameService } from '../core/breadcrumbs/dso-name.service';
 import { SortOptions } from '../core/cache/models/sort-options.model';
@@ -97,16 +101,24 @@ export class CollectionPageComponent implements OnInit {
    */
   collectionPageRoute$: Observable<string>;
 
+  /**
+   * The current language of the page
+   */
+  currentLanguage: string = environment.defaultLanguage;
+
   constructor(
     protected route: ActivatedRoute,
     protected router: Router,
     protected authService: AuthService,
     protected authorizationDataService: AuthorizationDataService,
     public dsoNameService: DSONameService,
+    public translateService: TranslateService,
   ) {
   }
 
   ngOnInit(): void {
+    this.currentLanguage = this.translateService.currentLang;
+
     this.collectionRD$ = this.route.data.pipe(
       map((data) => data.dso as RemoteData<Collection>),
       redirectOn4xx(this.router, this.authService),
diff --git a/src/app/community-list-page/community-list/community-list.component.html b/src/app/community-list-page/community-list/community-list.component.html
index 82238ddd0d1..c699e22c10e 100644
--- a/src/app/community-list-page/community-list/community-list.component.html
+++ b/src/app/community-list-page/community-list/community-list.component.html
@@ -46,12 +46,12 @@
     </div>
     <ds-truncatable [id]="node.id">
       <div class="text-muted" cdkTreeNodePadding>
-        <div class="d-flex" *ngIf="node.payload.shortDescription">
+        <div class="d-flex" *ngIf="node.payload.shortDescription(currentLanguage) as shorDescription">
           <span aria-hidden="true" class="btn btn-default invisible">
             <span class="fa fa-chevron-right"></span>
           </span>
           <ds-truncatable-part [id]="node.id" [minLines]="3">
-            <span>{{node.payload.shortDescription}}</span>
+            <span>{{shorDescription}}</span>
           </ds-truncatable-part>
         </div>
       </div>
@@ -77,12 +77,12 @@ <h6 class="align-middle my-auto">
     </div>
     <ds-truncatable [id]="node.id">
       <div class="text-muted" cdkTreeNodePadding>
-        <div class="d-flex" *ngIf="node.payload.shortDescription">
+        <div class="d-flex" *ngIf="node.payload.shortDescription(currentLanguage) as shortDescription">
           <span aria-hidden="true" class="btn btn-default invisible">
             <span class="fa fa-chevron-right"></span>
           </span>
           <ds-truncatable-part [id]="node.id" [minLines]="3">
-            <span>{{node.payload.shortDescription}}</span>
+            <span>{{shortDescription}}</span>
           </ds-truncatable-part>
         </div>
       </div>
diff --git a/src/app/community-list-page/community-list/community-list.component.ts b/src/app/community-list-page/community-list/community-list.component.ts
index 5819471d7e5..7ca6e67da51 100644
--- a/src/app/community-list-page/community-list/community-list.component.ts
+++ b/src/app/community-list-page/community-list/community-list.component.ts
@@ -4,7 +4,6 @@ import {
 } from '@angular/cdk/tree';
 import {
   AsyncPipe,
-  NgClass,
   NgIf,
 } from '@angular/common';
 import {
@@ -13,9 +12,13 @@ import {
   OnInit,
 } from '@angular/core';
 import { RouterLink } from '@angular/router';
-import { TranslateModule } from '@ngx-translate/core';
+import {
+  TranslateModule,
+  TranslateService,
+} from '@ngx-translate/core';
 import { take } from 'rxjs/operators';
 
+import { environment } from '../../../environments/environment';
 import { DSONameService } from '../../core/breadcrumbs/dso-name.service';
 import {
   SortDirection,
@@ -42,10 +45,15 @@ import { FlatNode } from '../flat-node.model';
   templateUrl: './community-list.component.html',
   styleUrls: ['./community-list.component.scss'],
   standalone: true,
-  imports: [NgIf, ThemedLoadingComponent, CdkTreeModule, NgClass, RouterLink, TruncatableComponent, TruncatablePartComponent, AsyncPipe, TranslateModule],
+  imports: [NgIf, ThemedLoadingComponent, CdkTreeModule, RouterLink, TruncatableComponent, TruncatablePartComponent, AsyncPipe, TranslateModule],
 })
 export class CommunityListComponent implements OnInit, OnDestroy {
 
+  /**
+   * The current language of the page
+   */
+  currentLanguage: string = environment.defaultLanguage;
+
   private expandedNodes: FlatNode[] = [];
   public loadingNode: FlatNode;
 
@@ -59,11 +67,14 @@ export class CommunityListComponent implements OnInit, OnDestroy {
   constructor(
     protected communityListService: CommunityListService,
     public dsoNameService: DSONameService,
+    public translateService: TranslateService,
   ) {
     this.paginationConfig = new FindListOptions();
     this.paginationConfig.elementsPerPage = 2;
     this.paginationConfig.currentPage = 1;
     this.paginationConfig.sort = new SortOptions('dc.title', SortDirection.ASC);
+
+    this.currentLanguage = translateService.currentLang;
   }
 
   ngOnInit() {
diff --git a/src/app/community-page/community-form/community-form.component.ts b/src/app/community-page/community-form/community-form.component.ts
index d32d9e408f2..e578465053a 100644
--- a/src/app/community-page/community-form/community-form.component.ts
+++ b/src/app/community-page/community-form/community-form.component.ts
@@ -1,28 +1,26 @@
 import {
   AsyncPipe,
   NgClass,
+  NgForOf,
   NgIf,
 } from '@angular/common';
 import {
+  ChangeDetectorRef,
   Component,
   Input,
   OnChanges,
+  OnInit,
   SimpleChange,
   SimpleChanges,
 } from '@angular/core';
+import { FormsModule } from '@angular/forms';
 import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
-import {
-  DynamicFormControlModel,
-  DynamicFormService,
-  DynamicInputModel,
-  DynamicTextAreaModel,
-} from '@ng-dynamic-forms/core';
+import { DynamicFormService } from '@ng-dynamic-forms/core';
 import {
   TranslateModule,
   TranslateService,
 } from '@ngx-translate/core';
 
-import { environment } from '../../../environments/environment';
 import { AuthService } from '../../core/auth/auth.service';
 import { ObjectCacheService } from '../../core/cache/object-cache.service';
 import { CommunityDataService } from '../../core/data/community-data.service';
@@ -34,6 +32,7 @@ import { FormComponent } from '../../shared/form/form.component';
 import { NotificationsService } from '../../shared/notifications/notifications.service';
 import { UploaderComponent } from '../../shared/upload/uploader/uploader.component';
 import { VarDirective } from '../../shared/utils/var.directive';
+import { communityFormModels } from './community-form.models';
 
 /**
  * Form used for creating and editing communities
@@ -51,10 +50,12 @@ import { VarDirective } from '../../shared/utils/var.directive';
     ComcolPageLogoComponent,
     NgIf,
     NgClass,
+    NgForOf,
     VarDirective,
+    FormsModule,
   ],
 })
-export class CommunityFormComponent extends ComColFormComponent<Community> implements OnChanges {
+export class CommunityFormComponent extends ComColFormComponent<Community> implements OnInit, OnChanges {
   /**
    * @type {Community} A new community when a community is being created, an existing Input community when a community is being edited
    */
@@ -65,44 +66,6 @@ export class CommunityFormComponent extends ComColFormComponent<Community> imple
    */
   type = Community.type;
 
-  /**
-   * The dynamic form fields used for creating/editing a community
-   * @type {(DynamicInputModel | DynamicTextAreaModel)[]}
-   */
-  formModel: DynamicFormControlModel[] = [
-    new DynamicInputModel({
-      id: 'title',
-      name: 'dc.title',
-      required: true,
-      validators: {
-        required: null,
-      },
-      errorMessages: {
-        required: 'Please enter a name for this title',
-      },
-    }),
-    new DynamicTextAreaModel({
-      id: 'description',
-      name: 'dc.description',
-      spellCheck: environment.form.spellCheck,
-    }),
-    new DynamicTextAreaModel({
-      id: 'abstract',
-      name: 'dc.description.abstract',
-      spellCheck: environment.form.spellCheck,
-    }),
-    new DynamicTextAreaModel({
-      id: 'rights',
-      name: 'dc.rights',
-      spellCheck: environment.form.spellCheck,
-    }),
-    new DynamicTextAreaModel({
-      id: 'tableofcontents',
-      name: 'dc.description.tableofcontents',
-      spellCheck: environment.form.spellCheck,
-    }),
-  ];
-
   public constructor(protected formService: DynamicFormService,
                      protected translate: TranslateService,
                      protected notificationsService: NotificationsService,
@@ -110,8 +73,20 @@ export class CommunityFormComponent extends ComColFormComponent<Community> imple
                      protected dsoService: CommunityDataService,
                      protected requestService: RequestService,
                      protected objectCache: ObjectCacheService,
-                     protected modalService: NgbModal) {
-    super(formService, translate, notificationsService, authService, requestService, objectCache, modalService);
+                     protected modalService: NgbModal,
+                     protected cdr: ChangeDetectorRef) {
+    super(formService, translate, notificationsService, authService, requestService, objectCache, modalService, cdr);
+  }
+
+  ngOnInit() {
+    this.initializeLanguage();
+
+    this.formModels.set(this.defaultLanguageCode, communityFormModels(this.defaultLanguageCode, true));
+    this.languages.forEach(lang => {
+      this.formModels.set(lang.code, communityFormModels(lang.code, false));
+    });
+
+    super.ngOnInit();
   }
 
   ngOnChanges(changes: SimpleChanges) {
diff --git a/src/app/community-page/community-form/community-form.models.ts b/src/app/community-page/community-form/community-form.models.ts
new file mode 100644
index 00000000000..8d0949da15d
--- /dev/null
+++ b/src/app/community-page/community-form/community-form.models.ts
@@ -0,0 +1,48 @@
+import {
+  DynamicFormControlModel,
+  DynamicInputModel,
+  DynamicTextAreaModel,
+} from '@ng-dynamic-forms/core';
+
+import { environment } from '../../../environments/environment';
+
+
+/**
+ * The dynamic form fields used for creating/editing a community
+ * @type {(DynamicInputModel | DynamicTextAreaModel)[]}
+ */
+export const communityFormModels = (lang: string, isDefaultLanguage: boolean): DynamicFormControlModel[] => {
+  return  [
+    new DynamicInputModel({
+      id: `title-${lang}`,
+      name: 'dc.title',
+      required: isDefaultLanguage,
+      validators: {
+        required: null,
+      },
+      errorMessages: {
+        required: 'Please enter a name for this title',
+      },
+    }),
+    new DynamicTextAreaModel({
+      id: `description-${lang}`,
+      name: 'dc.description',
+      spellCheck: environment.form.spellCheck,
+    }),
+    new DynamicTextAreaModel({
+      id: `abstract-${lang}`,
+      name: 'dc.description.abstract',
+      spellCheck: environment.form.spellCheck,
+    }),
+    new DynamicTextAreaModel({
+      id: `rights-${lang}`,
+      name: 'dc.rights',
+      spellCheck: environment.form.spellCheck,
+    }),
+    new DynamicTextAreaModel({
+      id: `tableofcontents-${lang}`,
+      name: 'dc.description.tableofcontents',
+      spellCheck: environment.form.spellCheck,
+    }),
+  ];
+};
diff --git a/src/app/community-page/community-page.component.html b/src/app/community-page/community-page.component.html
index a695e2019a3..4f412ed9fba 100644
--- a/src/app/community-page/community-page.component.html
+++ b/src/app/community-page/community-page.component.html
@@ -13,10 +13,10 @@
           <ds-comcol-page-handle [content]="communityPayload.handle" [title]="'community.page.handle'">
           </ds-comcol-page-handle>
           <!-- Introductory text -->
-          <ds-comcol-page-content [content]="communityPayload.introductoryText" [hasInnerHtml]="true">
+          <ds-comcol-page-content [content]="communityPayload.introductoryText(currentLanguage)" [hasInnerHtml]="true">
           </ds-comcol-page-content>
           <!-- News -->
-          <ds-comcol-page-content [content]="communityPayload.sidebarText" [hasInnerHtml]="true"
+          <ds-comcol-page-content [content]="communityPayload.sidebarText(currentLanguage)" [hasInnerHtml]="true"
                                   [title]="'community.page.news'">
           </ds-comcol-page-content>
         </header>
@@ -30,9 +30,9 @@
 
         <router-outlet></router-outlet>
       </section>
-      <footer *ngIf="communityPayload.copyrightText" class="border-top my-5 pt-4">
+      <footer *ngIf="communityPayload.copyrightText(currentLanguage) as copyrightText" class="border-top my-5 pt-4">
         <!-- Copyright -->
-        <ds-comcol-page-content [content]="communityPayload.copyrightText" [hasInnerHtml]="true">
+        <ds-comcol-page-content [content]="copyrightText" [hasInnerHtml]="true">
         </ds-comcol-page-content>
       </footer>
     </div>
diff --git a/src/app/community-page/community-page.component.ts b/src/app/community-page/community-page.component.ts
index d04ecbee190..ea930a2ea06 100644
--- a/src/app/community-page/community-page.component.ts
+++ b/src/app/community-page/community-page.component.ts
@@ -13,7 +13,10 @@ import {
   RouterModule,
   RouterOutlet,
 } from '@angular/router';
-import { TranslateModule } from '@ngx-translate/core';
+import {
+  TranslateModule,
+  TranslateService,
+} from '@ngx-translate/core';
 import { Observable } from 'rxjs';
 import {
   filter,
@@ -21,6 +24,7 @@ import {
   mergeMap,
 } from 'rxjs/operators';
 
+import { environment } from '../../environments/environment';
 import { AuthService } from '../core/auth/auth.service';
 import { DSONameService } from '../core/breadcrumbs/dso-name.service';
 import { AuthorizationDataService } from '../core/data/feature-authorization/authorization-data.service';
@@ -92,6 +96,11 @@ export class CommunityPageComponent implements OnInit {
    */
   logoRD$: Observable<RemoteData<Bitstream>>;
 
+  /**
+   * The current language of the page
+   */
+  currentLanguage: string = environment.defaultLanguage;
+
   /**
    * Route to the community page
    */
@@ -103,11 +112,14 @@ export class CommunityPageComponent implements OnInit {
     private authService: AuthService,
     private authorizationDataService: AuthorizationDataService,
     public dsoNameService: DSONameService,
+    public translateService: TranslateService,
   ) {
 
   }
 
   ngOnInit(): void {
+    this.currentLanguage = this.translateService.currentLang;
+
     this.communityRD$ = this.route.data.pipe(
       map((data) => data.dso as RemoteData<Community>),
       redirectOn4xx(this.router, this.authService),
diff --git a/src/app/core/breadcrumbs/dso-name.service.ts b/src/app/core/breadcrumbs/dso-name.service.ts
index 988141209f4..b86f0efc0c5 100644
--- a/src/app/core/breadcrumbs/dso-name.service.ts
+++ b/src/app/core/breadcrumbs/dso-name.service.ts
@@ -78,6 +78,10 @@ export class DSONameService {
       if (hasValue(match)) {
         name = this.factories[match](dso);
       }
+      // If name is empty we try to get a name from different metadata
+      if (isEmpty(name) && dso.metadata) {
+        name = dso.firstMetadataValue('dc.title', { language: this.translateService.currentLang });
+      }
       if (isEmpty(name)) {
         name = this.factories.Default(dso);
       }
diff --git a/src/app/core/shared/collection.model.ts b/src/app/core/shared/collection.model.ts
index b929e54ccb4..72bcb591f77 100644
--- a/src/app/core/shared/collection.model.ts
+++ b/src/app/core/shared/collection.model.ts
@@ -94,40 +94,40 @@ export class Collection extends DSpaceObject implements ChildHALResource, Handle
    * The introductory text of this Collection
    * Corresponds to the metadata field dc.description
    */
-  get introductoryText(): string {
-    return this.firstMetadataValue('dc.description');
+  public introductoryText(language: string): string {
+    return this.firstMetadataValue('dc.description', { language });
   }
 
   /**
    * The short description: HTML
    * Corresponds to the metadata field dc.description.abstract
    */
-  get shortDescription(): string {
-    return this.firstMetadataValue('dc.description.abstract');
+  public shortDescription(language: string): string {
+    return this.firstMetadataValue('dc.description.abstract', { language });
   }
 
   /**
    * The copyright text of this Collection
    * Corresponds to the metadata field dc.rights
    */
-  get copyrightText(): string {
-    return this.firstMetadataValue('dc.rights');
+  public copyrightText(language: string): string {
+    return this.firstMetadataValue('dc.rights', { language });
   }
 
   /**
    * The license of this Collection
    * Corresponds to the metadata field dc.rights.license
    */
-  get dcLicense(): string {
-    return this.firstMetadataValue('dc.rights.license');
+  public dcLicense(language: string): string {
+    return this.firstMetadataValue('dc.rights.license', { language });
   }
 
   /**
    * The sidebar text of this Collection
    * Corresponds to the metadata field dc.description.tableofcontents
    */
-  get sidebarText(): string {
-    return this.firstMetadataValue('dc.description.tableofcontents');
+  public sidebarText(language: string): string {
+    return this.firstMetadataValue('dc.description.tableofcontents', { language });
   }
 
   getParentLinkKey(): keyof this['_links'] {
diff --git a/src/app/core/shared/community.model.ts b/src/app/core/shared/community.model.ts
index 31b00398ffb..90a24ce3191 100644
--- a/src/app/core/shared/community.model.ts
+++ b/src/app/core/shared/community.model.ts
@@ -83,32 +83,32 @@ export class Community extends DSpaceObject implements ChildHALResource, HandleO
    * The introductory text of this Community
    * Corresponds to the metadata field dc.description
    */
-  get introductoryText(): string {
-    return this.firstMetadataValue('dc.description');
+  public introductoryText(language: string): string {
+    return this.firstMetadataValue('dc.description', { language });
   }
 
   /**
    * The short description: HTML
    * Corresponds to the metadata field dc.description.abstract
    */
-  get shortDescription(): string {
-    return this.firstMetadataValue('dc.description.abstract');
+  public shortDescription(language: string): string {
+    return this.firstMetadataValue('dc.description.abstract', { language });
   }
 
   /**
    * The copyright text of this Community
    * Corresponds to the metadata field dc.rights
    */
-  get copyrightText(): string {
-    return this.firstMetadataValue('dc.rights');
+  public copyrightText(language: string): string {
+    return this.firstMetadataValue('dc.rights', { language });
   }
 
   /**
    * The sidebar text of this Community
    * Corresponds to the metadata field dc.description.tableofcontents
    */
-  get sidebarText(): string {
-    return this.firstMetadataValue('dc.description.tableofcontents');
+  public sidebarText(language: string): string {
+    return this.firstMetadataValue('dc.description.tableofcontents', { language });
   }
 
   getParentLinkKey(): keyof this['_links'] {
diff --git a/src/app/shared/comcol/comcol-forms/comcol-form/comcol-form.component.html b/src/app/shared/comcol/comcol-forms/comcol-form/comcol-form.component.html
index 1d752869e5e..5663716314b 100644
--- a/src/app/shared/comcol/comcol-forms/comcol-form/comcol-form.component.html
+++ b/src/app/shared/comcol/comcol-forms/comcol-form/comcol-form.component.html
@@ -33,13 +33,58 @@
     </ng-container>
   </div>
 </div>
-<ds-form *ngIf="formModel"
-         [formId]="'comcol-form-id'"
-         [formModel]="formModel"
-         [displayCancel]="false"
-         (submitForm)="onSubmit()">
-  <button (click)="back.emit()" before class="btn btn-outline-secondary" type="button">
-    <i class="fas fa-arrow-left" aria-hidden="true"></i> {{ type.value + '.edit.return' | translate }}
-  </button>
-</ds-form>
+<div class="container-fluid">
+  <div class="row m-0">
+    <div class="translations-container">
+      <label> {{ 'collection.edit.tabs.multilingual-editor' | translate }} </label>
+    </div>
+  </div>
+</div>
+
+<div class="row m-0">
+  <div class="col-12 {{languages.length > 0 ? 'col-md-6 border-right' : 'col-md-12'}} p-0 border-end">
+    <div class="px-3 pt-3">
+      <label>{{ 'collection.edit.tabs.default-language' | translate }}: {{defaultLanguage}}</label>
+    </div>
+
+    <hr class="my-12"/>
 
+    <ds-form *ngIf="formModels.get(defaultLanguageCode)"
+             [formId]="'comcol-form-id-' + defaultLanguageCode"
+             [formModel]="formModels.get(defaultLanguageCode)"
+             [displayCancel]="false"
+             [displaySubmit]="false">
+    </ds-form>
+  </div>
+
+  <div class="col-12 col-md-6 p-0" *ngIf="languages.length > 0">
+    <div class="pt-2 px-3">
+      <select id="comcol-select-lang" class="form-control" name="comcol-select-lang" aria-label="Select language" [(ngModel)]="currentLanguageCode" (change)="changeLanguage()">
+        <option *ngFor="let language of languages" [ngValue]="language.code">{{language.label}}</option>
+      </select>
+    </div>
+
+    <hr class="my-12"/>
+
+    <ng-container *ngIf="currentAlternativeForm">
+      <ds-form [formId]="'comcol-form-id-' + currentLanguageCode"
+               [formModel]="currentAlternativeForm"
+               [displayCancel]="false"
+               [displaySubmit]="false">
+      </ds-form>
+    </ng-container>
+  </div>
+</div>
+
+<hr class="my-12 mt-0"/>
+
+<div class="row m-0">
+  <div class="col-12 d-flex justify-content-center space-children-mr form-submit">
+    <button (click)="back.emit()"  class="btn btn-outline-secondary" type="button">
+      <i class="fas fa-arrow-left" aria-hidden="true"></i> {{ type.value + '.edit.return' | translate }}
+    </button>
+    <button (click)="onSubmit()"  class="btn btn-primary" type="button">
+      <i class="fas fa-save" aria-hidden="true"></i> {{'form.submit' | translate }}
+    </button>
+  </div>
+</div>
diff --git a/src/app/shared/comcol/comcol-forms/comcol-form/comcol-form.component.scss b/src/app/shared/comcol/comcol-forms/comcol-form/comcol-form.component.scss
index e69de29bb2d..c674c211e47 100644
--- a/src/app/shared/comcol/comcol-forms/comcol-form/comcol-form.component.scss
+++ b/src/app/shared/comcol/comcol-forms/comcol-form/comcol-form.component.scss
@@ -0,0 +1,7 @@
+.form-control {
+  margin-top: 2px;
+}
+
+.form-submit {
+  gap: 20px;
+}
diff --git a/src/app/shared/comcol/comcol-forms/comcol-form/comcol-form.component.spec.ts b/src/app/shared/comcol/comcol-forms/comcol-form/comcol-form.component.spec.ts
index 2035c313fe6..30df19b3a79 100644
--- a/src/app/shared/comcol/comcol-forms/comcol-form/comcol-form.component.spec.ts
+++ b/src/app/shared/comcol/comcol-forms/comcol-form/comcol-form.component.spec.ts
@@ -16,7 +16,10 @@ import {
   DynamicFormService,
   DynamicInputModel,
 } from '@ng-dynamic-forms/core';
-import { TranslateModule } from '@ngx-translate/core';
+import {
+  TranslateModule,
+  TranslateService,
+} from '@ngx-translate/core';
 import { Operation } from 'fast-json-patch';
 import { of as observableOf } from 'rxjs';
 
@@ -28,6 +31,7 @@ import { Community } from '../../../../core/shared/community.model';
 import { hasValue } from '../../../empty.util';
 import { FormComponent } from '../../../form/form.component';
 import { AuthServiceMock } from '../../../mocks/auth.service.mock';
+import { translateServiceStub } from '../../../mocks/translate.service.mock';
 import { NotificationsService } from '../../../notifications/notifications.service';
 import { createSuccessfulRemoteDataObject$ } from '../../../remote-data.utils';
 import { NotificationsServiceStub } from '../../../testing/notifications-service.stub';
@@ -55,8 +59,8 @@ describe('ComColFormComponent', () => {
   const dcTitle = 'dc.title';
   const dcAbstract = 'dc.description.abstract';
 
-  const abstractMD = { [dcAbstract]: [{ value: 'Community description', language: null }] };
-  const newTitleMD = { [dcTitle]: [{ value: 'New Community Title', language: null }] };
+  const abstractMD = { [dcAbstract]: [{ value: 'Community description', language: 'en_US' }] };
+  const newTitleMD = { [dcTitle]: [{ value: 'New Community Title', language: 'en_US' }] };
   const formModel = [
     new DynamicInputModel({
       id: 'title',
@@ -103,6 +107,7 @@ describe('ComColFormComponent', () => {
         { provide: AuthService, useValue: new AuthServiceMock() },
         { provide: RequestService, useValue: requestServiceStub },
         { provide: ObjectCacheService, useValue: objectCacheStub },
+        { provide: TranslateService, useValue: translateServiceStub },
       ],
       schemas: [NO_ERRORS_SCHEMA],
     })
@@ -132,7 +137,7 @@ describe('ComColFormComponent', () => {
     describe('onSubmit', () => {
       beforeEach(() => {
         spyOn(comp.submitForm, 'emit');
-        comp.formModel = formModel;
+        comp.formModels.set('en_US', formModel);
       });
 
       it('should emit the new version of the community', () => {
@@ -143,37 +148,38 @@ describe('ComColFormComponent', () => {
           {
             op: 'replace',
             path: '/metadata/dc.title',
-            value: {
+            value: [{
               value: 'New Community Title',
-              language: null,
-            },
+              language: 'en_US',
+            }],
           },
           {
             op: 'replace',
             path: '/metadata/dc.description.abstract',
-            value: {
+            value: [{
               value: 'Community description',
-              language: null,
-            },
+              language: 'en_US',
+            }],
           },
         ];
 
+        const expectedDso = Object.assign({}, comp.dso, {
+          metadata: {
+            'dc.title': [{
+              value: 'New Community Title',
+              language: 'en_US',
+            }],
+            'dc.description.abstract': [{
+              value: 'Community description',
+              language: 'en_US',
+            }],
+          },
+          type: Community.type,
+        });
+
         expect(comp.submitForm.emit).toHaveBeenCalledWith(
           {
-            dso: Object.assign({}, comp.dso, {
-              metadata: {
-                'dc.title': [{
-                  value: 'New Community Title',
-                  language: null,
-                }],
-                'dc.description.abstract': [{
-                  value: 'Community description',
-                  language: null,
-                }],
-              },
-              type: Community.type,
-            },
-            ),
+            dso: expectedDso,
             operations: operations,
           },
         );
@@ -314,8 +320,16 @@ describe('ComColFormComponent', () => {
   function initComponent(dso: Community) {
     fixture = TestBed.createComponent(ComColFormComponent);
     comp = fixture.componentInstance;
-    comp.formModel = [];
+    comp.formModels.set('en_US', formModel);
+    comp.defaultLanguageCode = 'en_US';
     comp.dso = dso;
+    comp.dso.firstMetadataValue = (name, language) => {
+      if (name === 'dc.title') {
+        return newTitleMD[dcTitle][0].value;
+      } else if (name === 'dc.description.abstract') {
+        return abstractMD[dcAbstract][0].value;
+      }
+    };
     (comp as any).type = Community.type;
     comp.uploaderComponent = { uploader: {} } as any;
 
diff --git a/src/app/shared/comcol/comcol-forms/comcol-form/comcol-form.component.ts b/src/app/shared/comcol/comcol-forms/comcol-form/comcol-form.component.ts
index 0c80ce0d1d9..e63f3ef2b85 100644
--- a/src/app/shared/comcol/comcol-forms/comcol-form/comcol-form.component.ts
+++ b/src/app/shared/comcol/comcol-forms/comcol-form/comcol-form.component.ts
@@ -1,9 +1,11 @@
 import {
   AsyncPipe,
   NgClass,
+  NgForOf,
   NgIf,
 } from '@angular/common';
 import {
+  ChangeDetectorRef,
   Component,
   EventEmitter,
   Input,
@@ -12,7 +14,10 @@ import {
   Output,
   ViewChild,
 } from '@angular/core';
-import { UntypedFormGroup } from '@angular/forms';
+import {
+  FormsModule,
+  ReactiveFormsModule,
+} from '@angular/forms';
 import {
   NgbModal,
   NgbModalRef,
@@ -27,6 +32,7 @@ import {
   TranslateService,
 } from '@ngx-translate/core';
 import { Operation } from 'fast-json-patch';
+import { ReplaceOperation } from 'fast-json-patch/module/core';
 import { FileUploader } from 'ng2-file-upload';
 import {
   BehaviorSubject,
@@ -40,6 +46,8 @@ import {
   take,
 } from 'rxjs/operators';
 
+import { LangConfig } from '../../../../../config/lang-config.interface';
+import { environment } from '../../../../../environments/environment';
 import { AuthService } from '../../../../core/auth/auth.service';
 import { ObjectCacheService } from '../../../../core/cache/object-cache.service';
 import { ComColDataService } from '../../../../core/data/comcol-data.service';
@@ -83,7 +91,10 @@ import { ComcolPageLogoComponent } from '../../comcol-page-logo/comcol-page-logo
     ComcolPageLogoComponent,
     NgIf,
     NgClass,
+    NgForOf,
     VarDirective,
+    ReactiveFormsModule,
+    FormsModule,
   ],
   standalone: true,
 })
@@ -120,14 +131,34 @@ export class ComColFormComponent<T extends Collection | Community> implements On
   ERROR_KEY_PREFIX = '.form.errors.';
 
   /**
-   * The form model that represents the fields in the form
+   * The map of form model that represents the fields in the form
+   */
+  formModels: Map<string, DynamicFormControlModel[]> = new Map();
+
+  /**
+   * The form for the selected current language
+   */
+  currentAlternativeForm: DynamicFormControlModel[];
+
+  /**
+   * The default language from config
+   */
+  defaultLanguageCode: string;
+
+  /**
+   * The current page language string
    */
-  formModel: DynamicFormControlModel[];
+  defaultLanguage: string | null;
 
   /**
-   * The form group of this form
+   * The current page outlet string
    */
-  formGroup: UntypedFormGroup;
+  currentLanguageCode: string | null;
+
+  /**
+   * All languages used by application
+   */
+  languages: LangConfig[] = [];
 
   /**
    * The uploader configuration options
@@ -184,21 +215,27 @@ export class ComColFormComponent<T extends Collection | Community> implements On
                      protected authService: AuthService,
                      protected requestService: RequestService,
                      protected objectCache: ObjectCacheService,
-                     protected modalService: NgbModal){
+                     protected modalService: NgbModal,
+                     protected cdr: ChangeDetectorRef){
   }
 
   ngOnInit(): void {
     this.uploadFilesOptions.autoUpload = !this.isCreation;
 
-    if (hasValue(this.formModel)) {
-      this.formModel.forEach(
-        (fieldModel: DynamicInputModel) => {
-          fieldModel.value = this.dso.firstMetadataValue(fieldModel.name);
-        },
-      );
-      this.formGroup = this.formService.createFormGroup(this.formModel);
+    if (this.formModels.size > 0) {
+      this.formModels.forEach((formModel, language) => {
+        formModel.forEach(
+          (fieldModel: DynamicInputModel) => {
+            fieldModel.value = this.dso.firstMetadataValue(fieldModel.name, { language });
+          },
+        );
+      });
 
       this.updateFieldTranslations();
+      if (this.currentLanguageCode) {
+        this.currentAlternativeForm = this.formModels.get(this.currentLanguageCode);
+      }
+
       this.translate.onLangChange
         .subscribe(() => {
           this.updateFieldTranslations();
@@ -237,16 +274,46 @@ export class ComColFormComponent<T extends Collection | Community> implements On
    */
   onSubmit() {
     const formMetadata = {}  as MetadataMap;
-    this.formModel.forEach((fieldModel: DynamicInputModel) => {
-      const value: MetadataValue = {
-        value: fieldModel.value as string,
-        language: null,
-      } as any;
-      if (formMetadata.hasOwnProperty(fieldModel.name)) {
-        formMetadata[fieldModel.name].push(value);
-      } else {
-        formMetadata[fieldModel.name] = [value];
-      }
+    const operations: Map<string, ReplaceOperation<{value: string, language: string}[]>> = new Map();
+
+    this.formModels.forEach((formModel, language) => {
+      formModel.forEach(
+        (fieldModel: DynamicInputModel) => {
+          const value: MetadataValue = {
+            value: fieldModel.value as string,
+            language,
+          } as any;
+
+          if (formMetadata.hasOwnProperty(fieldModel.name)) {
+            formMetadata[fieldModel.name].push(value);
+          } else {
+            formMetadata[fieldModel.name] = [value];
+          }
+
+          const key = `/metadata/${fieldModel.name}`;
+
+          const keyExistAndAtLeastOneValueIsNotNull: boolean = (hasValue(fieldModel.value) || hasValue(this.dso.firstMetadataValue(fieldModel.name, { language })));
+
+          if ( keyExistAndAtLeastOneValueIsNotNull) {
+            if (operations.has(key)) {
+              const operation: Operation = operations.get(key);
+              operation.value.push({
+                value: fieldModel.value,
+                language,
+              });
+            } else {
+              operations.set(key, {
+                op: 'replace',
+                path: key,
+                value: [{
+                  value: fieldModel.value as string,
+                  language,
+                }],
+              });
+            }
+          }
+        },
+      );
     });
 
     const updatedDSO = Object.assign({}, this.dso, {
@@ -257,49 +324,58 @@ export class ComColFormComponent<T extends Collection | Community> implements On
       type: Community.type,
     });
 
-    const operations: Operation[] = [];
-    this.formModel.forEach((fieldModel: DynamicInputModel) => {
-      if (fieldModel.value !== this.dso.firstMetadataValue(fieldModel.name)) {
-        operations.push({
-          op: 'replace',
-          path: `/metadata/${fieldModel.name}`,
-          value: {
-            value: fieldModel.value,
-            language: null,
-          },
-        });
-      }
-    });
-
     if (this.isCreation) {
       this.submitForm.emit({
         dso: updatedDSO,
         uploader: hasValue(this.uploaderComponent) ? this.uploaderComponent.uploader : undefined,
-        operations: operations,
+        operations: [...operations.values()],
       });
     } else {
       this.submitForm.emit({
         dso: updatedDSO,
-        operations: operations,
+        operations: [...operations.values()],
       });
     }
   }
 
+  changeLanguage() {
+    // Because the ds-form require destroy (we cannot change formModel without destroy) we need to remove the component from template
+    this.currentAlternativeForm = null;
+    // Detect changes push the form to rerender, that cause the destroy of the form
+    this.cdr.detectChanges();
+    // And then we can add a component again by providing a new language form
+    this.currentAlternativeForm = this.formModels.get(this.currentLanguageCode);
+  }
+
+  /**
+   * Initialize language method that provide all necessary information for creation, validation, labaling & form submission
+   */
+  initializeLanguage() {
+    this.defaultLanguageCode = environment.defaultLanguage;
+    this.defaultLanguage = environment.languages.find(lang => lang.code === this.defaultLanguageCode).label;
+
+    this.languages = environment.languages.filter(lang => lang.code !== this.defaultLanguageCode && (lang.active === true));
+    this.currentLanguageCode = this.languages.length > 0 ? this.languages[0].code : null;
+  }
+
   /**
    * Used the update translations of errors and labels on init and on language change
    */
   private updateFieldTranslations() {
-    this.formModel.forEach(
-      (fieldModel: DynamicInputModel) => {
-        fieldModel.label = this.translate.instant(this.type.value + this.LABEL_KEY_PREFIX + fieldModel.id);
-        if (isNotEmpty(fieldModel.validators)) {
-          fieldModel.errorMessages = {};
-          Object.keys(fieldModel.validators).forEach((key) => {
-            fieldModel.errorMessages[key] = this.translate.instant(this.type.value + this.ERROR_KEY_PREFIX + fieldModel.id + '.' + key);
-          });
-        }
-      },
-    );
+    [this.defaultLanguageCode, ...this.languages.map(lang => lang.code)].forEach(lang => {
+      const langFormModel = this.formModels.get(lang);
+      langFormModel.forEach(
+        (fieldModel: DynamicInputModel) => {
+          fieldModel.label = this.translate.instant(this.type.value + this.LABEL_KEY_PREFIX + fieldModel.id.replace(`-${lang}`, ''));
+          if (isNotEmpty(fieldModel.validators)) {
+            fieldModel.errorMessages = {};
+            Object.keys(fieldModel.validators).forEach((key) => {
+              fieldModel.errorMessages[key] = this.translate.instant(this.type.value + this.ERROR_KEY_PREFIX + fieldModel.id.replace(`-${lang}`, '') + '.' + key);
+            });
+          }
+        },
+      );
+    });
   }
 
   /**
diff --git a/src/app/shared/mocks/translate.service.mock.ts b/src/app/shared/mocks/translate.service.mock.ts
index ecb87007e26..bae94be0452 100644
--- a/src/app/shared/mocks/translate.service.mock.ts
+++ b/src/app/shared/mocks/translate.service.mock.ts
@@ -1,4 +1,6 @@
+import { EventEmitter } from '@angular/core';
 import { TranslateService } from '@ngx-translate/core';
+import { of } from 'rxjs';
 
 export function getMockTranslateService(): TranslateService {
   return jasmine.createSpyObj('translateService', {
@@ -6,5 +8,15 @@ export function getMockTranslateService(): TranslateService {
     use: jasmine.createSpy('use'),
     instant: jasmine.createSpy('instant'),
     setDefaultLang: jasmine.createSpy('setDefaultLang'),
+    currentLang: 'en_US',
   });
 }
+
+export const translateServiceStub = {
+  get: () => of('translated-text'),
+  instant: () => 'translated-text',
+  onLangChange: new EventEmitter(),
+  onTranslationChange: new EventEmitter(),
+  onDefaultLangChange: new EventEmitter(),
+  currentLang: 'en_US',
+};
diff --git a/src/app/shared/object-grid/collection-grid-element/collection-grid-element.component.html b/src/app/shared/object-grid/collection-grid-element/collection-grid-element.component.html
index 6b5cb23252a..e4c0b9a0b91 100644
--- a/src/app/shared/object-grid/collection-grid-element/collection-grid-element.component.html
+++ b/src/app/shared/object-grid/collection-grid-element/collection-grid-element.component.html
@@ -9,7 +9,7 @@
   </span>
   <div class="card-body">
     <h4 class="card-title">{{ dsoNameService.getName(object) }}</h4>
-    <p *ngIf="object.shortDescription" class="card-text">{{object.shortDescription}}</p>
+    <p *ngIf="object.shortDescription(currentLanguage) as shortDescription" class="card-text">{{shortDescription}}</p>
     <div *ngIf="linkType !== linkTypes.None" class="text-center">
       <a [target]="(linkType === linkTypes.ExternalLink) ? '_blank' : '_self'" [attr.rel]="(linkType === linkTypes.ExternalLink) ? 'noopener noreferrer' : null" [routerLink]="['/collections/', object.id]" class="lead btn btn-primary viewButton">{{ 'search.results.view-result' | translate}}</a>
     </div>
diff --git a/src/app/shared/object-grid/collection-grid-element/collection-grid-element.component.ts b/src/app/shared/object-grid/collection-grid-element/collection-grid-element.component.ts
index 178c1bd5b9b..5c3e60f98e6 100644
--- a/src/app/shared/object-grid/collection-grid-element/collection-grid-element.component.ts
+++ b/src/app/shared/object-grid/collection-grid-element/collection-grid-element.component.ts
@@ -7,8 +7,12 @@ import {
   Input,
 } from '@angular/core';
 import { RouterLink } from '@angular/router';
-import { TranslateModule } from '@ngx-translate/core';
+import {
+  TranslateModule,
+  TranslateService,
+} from '@ngx-translate/core';
 
+import { environment } from '../../../../environments/environment';
 import { DSONameService } from '../../../core/breadcrumbs/dso-name.service';
 import { LinkService } from '../../../core/cache/builders/link.service';
 import { Collection } from '../../../core/shared/collection.model';
@@ -36,13 +40,22 @@ import { followLink } from '../../utils/follow-link-config.model';
 export class CollectionGridElementComponent extends AbstractListableElementComponent<
   Collection
 > {
+
+  /**
+   * The current language of the page
+   */
+  currentLanguage: string = environment.defaultLanguage;
+
   private _object: Collection;
 
   constructor(
     public dsoNameService: DSONameService,
     private linkService: LinkService,
+    public translateService: TranslateService,
   ) {
     super(dsoNameService);
+
+    this.currentLanguage = translateService.currentLang;
   }
 
   // @ts-ignore
diff --git a/src/app/shared/object-grid/community-grid-element/community-grid-element.component.html b/src/app/shared/object-grid/community-grid-element/community-grid-element.component.html
index c00c26d3fe6..4981934dbc9 100644
--- a/src/app/shared/object-grid/community-grid-element/community-grid-element.component.html
+++ b/src/app/shared/object-grid/community-grid-element/community-grid-element.component.html
@@ -9,7 +9,7 @@
   </span>
   <div class="card-body">
     <h4 class="card-title">{{ dsoNameService.getName(object) }}</h4>
-    <p *ngIf="object.shortDescription" class="card-text">{{object.shortDescription}}</p>
+    <p *ngIf="object.shortDescription(currentLanguage) as shortDescription" class="card-text">{{shortDescription}}</p>
     <div *ngIf="linkType !== linkTypes.None" class="text-center">
       <a [target]="(linkType === linkTypes.ExternalLink) ? '_blank' : '_self'" [attr.rel]="(linkType === linkTypes.ExternalLink) ? 'noopener noreferrer' : null" [routerLink]="['/communities/', object.id]" class="lead btn btn-primary viewButton">{{ 'search.results.view-result' | translate}}</a>
     </div>
diff --git a/src/app/shared/object-grid/community-grid-element/community-grid-element.component.ts b/src/app/shared/object-grid/community-grid-element/community-grid-element.component.ts
index c134af774e3..7b8799691b2 100644
--- a/src/app/shared/object-grid/community-grid-element/community-grid-element.component.ts
+++ b/src/app/shared/object-grid/community-grid-element/community-grid-element.component.ts
@@ -7,8 +7,12 @@ import {
   Input,
 } from '@angular/core';
 import { RouterLink } from '@angular/router';
-import { TranslateModule } from '@ngx-translate/core';
+import {
+  TranslateModule,
+  TranslateService,
+} from '@ngx-translate/core';
 
+import { environment } from '../../../../environments/environment';
 import { DSONameService } from '../../../core/breadcrumbs/dso-name.service';
 import { LinkService } from '../../../core/cache/builders/link.service';
 import { Community } from '../../../core/shared/community.model';
@@ -35,13 +39,22 @@ import { followLink } from '../../utils/follow-link-config.model';
 
 @listableObjectComponent(Community, ViewMode.GridElement)
 export class CommunityGridElementComponent extends AbstractListableElementComponent<Community> {
+
+  /**
+   * The current language of the page
+   */
+  currentLanguage: string = environment.defaultLanguage;
+
   private _object: Community;
 
   constructor(
     public dsoNameService: DSONameService,
     private linkService: LinkService,
+    public translateService: TranslateService,
   ) {
     super(dsoNameService);
+
+    this.currentLanguage = translateService.currentLang;
   }
 
   // @ts-ignore
diff --git a/src/app/shared/object-grid/search-result-grid-element/collection-search-result/collection-search-result-grid-element.component.html b/src/app/shared/object-grid/search-result-grid-element/collection-search-result/collection-search-result-grid-element.component.html
index 4a097b46dc0..9fb40b2c410 100644
--- a/src/app/shared/object-grid/search-result-grid-element/collection-search-result/collection-search-result-grid-element.component.html
+++ b/src/app/shared/object-grid/search-result-grid-element/collection-search-result/collection-search-result-grid-element.component.html
@@ -10,7 +10,7 @@
   <div class="card-body">
     <ds-badges *ngIf="showLabel" [object]="dso" [context]="context"></ds-badges>
     <h4 class="card-title">{{ dsoNameService.getName(dso) }}</h4>
-    <p *ngIf="dso.shortDescription" class="card-text">{{dso.shortDescription}}</p>
+    <p *ngIf="dso.shortDescription(currentLanguage) as shortDescription" class="card-text">{{shortDescription}}</p>
     <div *ngIf="linkType !== linkTypes.None" class="text-center">
       <a [target]="(linkType === linkTypes.ExternalLink) ? '_blank' : '_self'" [attr.rel]="(linkType === linkTypes.ExternalLink) ? 'noopener noreferrer' : null" [routerLink]="['/collections/',  dso.id]" class="lead btn btn-primary viewButton">{{ 'search.results.view-result' | translate}}</a>
     </div>
diff --git a/src/app/shared/object-grid/search-result-grid-element/collection-search-result/collection-search-result-grid-element.component.ts b/src/app/shared/object-grid/search-result-grid-element/collection-search-result/collection-search-result-grid-element.component.ts
index 8700541a6ce..84faa3e42f0 100644
--- a/src/app/shared/object-grid/search-result-grid-element/collection-search-result/collection-search-result-grid-element.component.ts
+++ b/src/app/shared/object-grid/search-result-grid-element/collection-search-result/collection-search-result-grid-element.component.ts
@@ -7,8 +7,12 @@ import {
   Input,
 } from '@angular/core';
 import { RouterLink } from '@angular/router';
-import { TranslateModule } from '@ngx-translate/core';
+import {
+  TranslateModule,
+  TranslateService,
+} from '@ngx-translate/core';
 
+import { environment } from '../../../../../environments/environment';
 import { DSONameService } from '../../../../core/breadcrumbs/dso-name.service';
 import { LinkService } from '../../../../core/cache/builders/link.service';
 import { BitstreamDataService } from '../../../../core/data/bitstream-data.service';
@@ -40,13 +44,21 @@ import { SearchResultGridElementComponent } from '../search-result-grid-element.
 export class CollectionSearchResultGridElementComponent extends SearchResultGridElementComponent< CollectionSearchResult, Collection > {
   private _dso: Collection;
 
+  /**
+   * The current language of the page
+   */
+  currentLanguage: string = environment.defaultLanguage;
+
   constructor(
     public dsoNameService: DSONameService,
+    public translateService: TranslateService,
     private linkService: LinkService,
     protected truncatableService: TruncatableService,
     protected bitstreamDataService: BitstreamDataService,
   ) {
     super(dsoNameService, truncatableService, bitstreamDataService);
+
+    this.currentLanguage = translateService.currentLang;
   }
 
   // @ts-ignore
diff --git a/src/app/shared/object-grid/search-result-grid-element/community-search-result/community-search-result-grid-element.component.html b/src/app/shared/object-grid/search-result-grid-element/community-search-result/community-search-result-grid-element.component.html
index 63b61396132..99c040f37cd 100644
--- a/src/app/shared/object-grid/search-result-grid-element/community-search-result/community-search-result-grid-element.component.html
+++ b/src/app/shared/object-grid/search-result-grid-element/community-search-result/community-search-result-grid-element.component.html
@@ -10,7 +10,7 @@
     <div class="card-body">
         <ds-badges *ngIf="showLabel" [object]="dso" [context]="context"></ds-badges>
         <h4 class="card-title">{{ dsoNameService.getName(dso) }}</h4>
-        <p *ngIf="dso.shortDescription" class="card-text">{{dso.shortDescription}}</p>
+        <p *ngIf="dso.shortDescription(currentLanguage) as shortDescription" class="card-text">{{shortDescription}}</p>
         <div *ngIf="linkType !== linkTypes.None" class="text-center">
             <a [target]="(linkType === linkTypes.ExternalLink) ? '_blank' : '_self'" [attr.rel]="(linkType === linkTypes.ExternalLink) ? 'noopener noreferrer' : null" [routerLink]="['/communities/', dso.id]" class="lead btn btn-primary viewButton">{{ 'search.results.view-result' | translate}}</a>
         </div>
diff --git a/src/app/shared/object-grid/search-result-grid-element/community-search-result/community-search-result-grid-element.component.ts b/src/app/shared/object-grid/search-result-grid-element/community-search-result/community-search-result-grid-element.component.ts
index e83182b33af..1c97440e237 100644
--- a/src/app/shared/object-grid/search-result-grid-element/community-search-result/community-search-result-grid-element.component.ts
+++ b/src/app/shared/object-grid/search-result-grid-element/community-search-result/community-search-result-grid-element.component.ts
@@ -7,8 +7,12 @@ import {
   Input,
 } from '@angular/core';
 import { RouterLink } from '@angular/router';
-import { TranslateModule } from '@ngx-translate/core';
+import {
+  TranslateModule,
+  TranslateService,
+} from '@ngx-translate/core';
 
+import { environment } from '../../../../../environments/environment';
 import { DSONameService } from '../../../../core/breadcrumbs/dso-name.service';
 import { LinkService } from '../../../../core/cache/builders/link.service';
 import { BitstreamDataService } from '../../../../core/data/bitstream-data.service';
@@ -41,15 +45,24 @@ import { SearchResultGridElementComponent } from '../search-result-grid-element.
  */
 @listableObjectComponent(CommunitySearchResult, ViewMode.GridElement)
 export class CommunitySearchResultGridElementComponent extends SearchResultGridElementComponent<CommunitySearchResult,Community> {
+
+  /**
+   * The current language of the page
+   */
+  currentLanguage: string = environment.defaultLanguage;
+
   private _dso: Community;
 
   constructor(
     public dsoNameService: DSONameService,
+    public translateService: TranslateService,
     private linkService: LinkService,
     protected truncatableService: TruncatableService,
     protected bitstreamDataService: BitstreamDataService,
   ) {
     super(dsoNameService, truncatableService, bitstreamDataService);
+
+    this.currentLanguage = translateService.currentLang;
   }
 
   // @ts-ignore
diff --git a/src/app/shared/object-list/collection-list-element/collection-list-element.component.html b/src/app/shared/object-list/collection-list-element/collection-list-element.component.html
index 1c4f68fbcce..afd99b7f41e 100644
--- a/src/app/shared/object-list/collection-list-element/collection-list-element.component.html
+++ b/src/app/shared/object-list/collection-list-element/collection-list-element.component.html
@@ -8,6 +8,6 @@
   <span class="pr-2">&nbsp;</span>
   <span *ngIf="object.archivedItemsCount >= 0" class="badge badge-pill badge-secondary align-self-center archived-items-lead">{{object.archivedItemsCount}}</span>
 </div>
-<div *ngIf="object.shortDescription" class="text-muted abstract-text">
-    {{object.shortDescription}}
+<div *ngIf="object.shortDescription(currentLanguage) as shortDescription" class="text-muted abstract-text">
+    {{shortDescription}}
 </div>
diff --git a/src/app/shared/object-list/collection-list-element/collection-list-element.component.spec.ts b/src/app/shared/object-list/collection-list-element/collection-list-element.component.spec.ts
index 6d360c3f5e2..ff6f67bb059 100644
--- a/src/app/shared/object-list/collection-list-element/collection-list-element.component.spec.ts
+++ b/src/app/shared/object-list/collection-list-element/collection-list-element.component.spec.ts
@@ -9,10 +9,12 @@ import {
 } from '@angular/core/testing';
 import { By } from '@angular/platform-browser';
 import { ActivatedRoute } from '@angular/router';
+import { TranslateService } from '@ngx-translate/core';
 
 import { DSONameService } from '../../../core/breadcrumbs/dso-name.service';
 import { Collection } from '../../../core/shared/collection.model';
 import { DSONameServiceMock } from '../../mocks/dso-name.service.mock';
+import { translateServiceStub } from '../../mocks/translate.service.mock';
 import { ActivatedRouteStub } from '../../testing/active-router.stub';
 import { CollectionListElementComponent } from './collection-list-element.component';
 
@@ -72,6 +74,7 @@ describe('CollectionListElementComponent', () => {
         { provide: DSONameService, useValue: new DSONameServiceMock() },
         { provide: 'objectElementProvider', useValue: (mockCollectionWithAbstract) },
         { provide: ActivatedRoute, useValue: new ActivatedRouteStub() },
+        { provide: TranslateService, useValue: translateServiceStub },
       ],
       schemas: [NO_ERRORS_SCHEMA],
     }).overrideComponent(CollectionListElementComponent, {
diff --git a/src/app/shared/object-list/collection-list-element/collection-list-element.component.ts b/src/app/shared/object-list/collection-list-element/collection-list-element.component.ts
index c03598d9547..3a07d1deb73 100644
--- a/src/app/shared/object-list/collection-list-element/collection-list-element.component.ts
+++ b/src/app/shared/object-list/collection-list-element/collection-list-element.component.ts
@@ -1,7 +1,10 @@
 import { NgIf } from '@angular/common';
 import { Component } from '@angular/core';
 import { RouterLink } from '@angular/router';
+import { TranslateService } from '@ngx-translate/core';
 
+import { environment } from '../../../../environments/environment';
+import { DSONameService } from '../../../core/breadcrumbs/dso-name.service';
 import { Collection } from '../../../core/shared/collection.model';
 import { ViewMode } from '../../../core/shared/view-mode.model';
 import { listableObjectComponent } from '../../object-collection/shared/listable-object/listable-object.decorator';
@@ -18,4 +21,19 @@ import { AbstractListableElementComponent } from '../../object-collection/shared
  * Component representing list element for a collection
  */
 @listableObjectComponent(Collection, ViewMode.ListElement)
-export class CollectionListElementComponent extends AbstractListableElementComponent<Collection> {}
+export class CollectionListElementComponent extends AbstractListableElementComponent<Collection> {
+
+  /**
+   * The current language of the page
+   */
+  currentLanguage: string = environment.defaultLanguage;
+
+  constructor(
+    public dsoNameService: DSONameService,
+    public translateService: TranslateService,
+  ) {
+    super(dsoNameService);
+
+    this.currentLanguage = translateService.currentLang;
+  }
+}
diff --git a/src/app/shared/object-list/community-list-element/community-list-element.component.html b/src/app/shared/object-list/community-list-element/community-list-element.component.html
index d63abd96725..666c78df989 100644
--- a/src/app/shared/object-list/community-list-element/community-list-element.component.html
+++ b/src/app/shared/object-list/community-list-element/community-list-element.component.html
@@ -8,6 +8,6 @@
   <span class="pr-2">&nbsp;</span>
   <span *ngIf="object.archivedItemsCount >= 0" class="badge badge-pill badge-secondary align-self-center archived-items-lead">{{object.archivedItemsCount}}</span>
 </div>
-<div *ngIf="object.shortDescription" class="text-muted abstract-text">
-    {{object.shortDescription}}
+<div *ngIf="object.shortDescription(currentLanguage) as shorDescription" class="text-muted abstract-text">
+    {{shorDescription}}
 </div>
diff --git a/src/app/shared/object-list/community-list-element/community-list-element.component.spec.ts b/src/app/shared/object-list/community-list-element/community-list-element.component.spec.ts
index cb34d6719c1..7322ca03c69 100644
--- a/src/app/shared/object-list/community-list-element/community-list-element.component.spec.ts
+++ b/src/app/shared/object-list/community-list-element/community-list-element.component.spec.ts
@@ -9,10 +9,12 @@ import {
 } from '@angular/core/testing';
 import { By } from '@angular/platform-browser';
 import { ActivatedRoute } from '@angular/router';
+import { TranslateService } from '@ngx-translate/core';
 
 import { DSONameService } from '../../../core/breadcrumbs/dso-name.service';
 import { Community } from '../../../core/shared/community.model';
 import { DSONameServiceMock } from '../../mocks/dso-name.service.mock';
+import { translateServiceStub } from '../../mocks/translate.service.mock';
 import { ActivatedRouteStub } from '../../testing/active-router.stub';
 import { CommunityListElementComponent } from './community-list-element.component';
 
@@ -49,6 +51,7 @@ describe('CommunityListElementComponent', () => {
         { provide: DSONameService, useValue: new DSONameServiceMock() },
         { provide: 'objectElementProvider', useValue: (mockCommunityWithAbstract) },
         { provide: ActivatedRoute, useValue: new ActivatedRouteStub() },
+        { provide: TranslateService, useValue: translateServiceStub },
       ],
       schemas: [NO_ERRORS_SCHEMA],
     }).overrideComponent(CommunityListElementComponent, {
diff --git a/src/app/shared/object-list/community-list-element/community-list-element.component.ts b/src/app/shared/object-list/community-list-element/community-list-element.component.ts
index adde4420ec8..6402b3bd670 100644
--- a/src/app/shared/object-list/community-list-element/community-list-element.component.ts
+++ b/src/app/shared/object-list/community-list-element/community-list-element.component.ts
@@ -1,7 +1,9 @@
 import { NgIf } from '@angular/common';
 import { Component } from '@angular/core';
 import { RouterLink } from '@angular/router';
+import { TranslateService } from '@ngx-translate/core';
 
+import { environment } from '../../../../environments/environment';
 import { DSONameService } from '../../../core/breadcrumbs/dso-name.service';
 import { Community } from '../../../core/shared/community.model';
 import { ViewMode } from '../../../core/shared/view-mode.model';
@@ -21,10 +23,18 @@ import { AbstractListableElementComponent } from '../../object-collection/shared
 @listableObjectComponent(Community, ViewMode.ListElement)
 export class CommunityListElementComponent extends AbstractListableElementComponent<Community> {
 
+  /**
+   * The current language of the page
+   */
+  currentLanguage: string = environment.defaultLanguage;
+
   constructor(
     public dsoNameService: DSONameService,
+    public translateService: TranslateService,
   ) {
     super(dsoNameService);
+
+    this.currentLanguage = translateService.currentLang;
   }
 
 }
diff --git a/src/app/shared/object-list/search-result-list-element/collection-search-result/collection-search-result-list-element.component.html b/src/app/shared/object-list/search-result-list-element/collection-search-result/collection-search-result-list-element.component.html
index 17b5d50d90f..63600091224 100644
--- a/src/app/shared/object-list/search-result-list-element/collection-search-result/collection-search-result-list-element.component.html
+++ b/src/app/shared/object-list/search-result-list-element/collection-search-result/collection-search-result-list-element.component.html
@@ -4,6 +4,6 @@
     <ds-badges *ngIf="showLabel" [object]="dso" [context]="context"></ds-badges>
     <a *ngIf="linkType !== linkTypes.None" [target]="(linkType === linkTypes.ExternalLink) ? '_blank' : '_self'" [attr.rel]="(linkType === linkTypes.ExternalLink) ? 'noopener noreferrer' : null" [routerLink]="['/collections/' + dso.id]" class="lead" [innerHTML]="dsoTitle"></a>
     <span *ngIf="linkType === linkTypes.None" class="lead" [innerHTML]="dsoTitle"></span>
-    <div *ngIf="dso.shortDescription" class="text-muted abstract-text" [innerHTML]="firstMetadataValue('dc.description.abstract')"></div>
+    <div *ngIf="dso.shortDescription(currentLanguage)" class="text-muted abstract-text" [innerHTML]="firstMetadataValue('dc.description.abstract')"></div>
   </div>
 </div>
diff --git a/src/app/shared/object-list/search-result-list-element/collection-search-result/collection-search-result-list-element.component.spec.ts b/src/app/shared/object-list/search-result-list-element/collection-search-result/collection-search-result-list-element.component.spec.ts
index 911c0d355fa..f88ef1c8412 100644
--- a/src/app/shared/object-list/search-result-list-element/collection-search-result/collection-search-result-list-element.component.spec.ts
+++ b/src/app/shared/object-list/search-result-list-element/collection-search-result/collection-search-result-list-element.component.spec.ts
@@ -10,12 +10,14 @@ import {
 } from '@angular/core/testing';
 import { By } from '@angular/platform-browser';
 import { ActivatedRoute } from '@angular/router';
+import { TranslateService } from '@ngx-translate/core';
 import { of as observableOf } from 'rxjs';
 
 import { APP_CONFIG } from '../../../../../config/app-config.interface';
 import { DSONameService } from '../../../../core/breadcrumbs/dso-name.service';
 import { Collection } from '../../../../core/shared/collection.model';
 import { DSONameServiceMock } from '../../../mocks/dso-name.service.mock';
+import { translateServiceStub } from '../../../mocks/translate.service.mock';
 import { CollectionSearchResult } from '../../../object-collection/shared/collection-search-result.model';
 import { ActivatedRouteStub } from '../../../testing/active-router.stub';
 import { TruncatableService } from '../../../truncatable/truncatable.service';
@@ -73,6 +75,7 @@ describe('CollectionSearchResultListElementComponent', () => {
         { provide: APP_CONFIG, useValue: environmentUseThumbs },
         { provide: ActivatedRoute, useValue: new ActivatedRouteStub() },
         { provide: ThemeService, useValue: getMockThemeService() },
+        { provide: TranslateService, useValue: translateServiceStub },
       ],
       schemas: [NO_ERRORS_SCHEMA],
     }).overrideComponent(CollectionSearchResultListElementComponent, {
diff --git a/src/app/shared/object-list/search-result-list-element/collection-search-result/collection-search-result-list-element.component.ts b/src/app/shared/object-list/search-result-list-element/collection-search-result/collection-search-result-list-element.component.ts
index 2641792b02b..d7d08562cb8 100644
--- a/src/app/shared/object-list/search-result-list-element/collection-search-result/collection-search-result-list-element.component.ts
+++ b/src/app/shared/object-list/search-result-list-element/collection-search-result/collection-search-result-list-element.component.ts
@@ -4,15 +4,24 @@ import {
 } from '@angular/common';
 import {
   Component,
+  Inject,
   OnInit,
 } from '@angular/core';
 import { RouterLink } from '@angular/router';
+import { TranslateService } from '@ngx-translate/core';
 
+import {
+  APP_CONFIG,
+  AppConfig,
+} from '../../../../../config/app-config.interface';
+import { environment } from '../../../../../environments/environment';
+import { DSONameService } from '../../../../core/breadcrumbs/dso-name.service';
 import { Collection } from '../../../../core/shared/collection.model';
 import { ViewMode } from '../../../../core/shared/view-mode.model';
 import { ThemedBadgesComponent } from '../../../object-collection/shared/badges/themed-badges.component';
 import { CollectionSearchResult } from '../../../object-collection/shared/collection-search-result.model';
 import { listableObjectComponent } from '../../../object-collection/shared/listable-object/listable-object.decorator';
+import { TruncatableService } from '../../../truncatable/truncatable.service';
 import { SearchResultListElementComponent } from '../search-result-list-element.component';
 
 @Component({
@@ -33,6 +42,20 @@ export class CollectionSearchResultListElementComponent extends SearchResultList
    */
   showThumbnails: boolean;
 
+  /**
+   * The current language of the page
+   */
+  currentLanguage: string = environment.defaultLanguage;
+
+  constructor(protected truncatableService: TruncatableService,
+              public dsoNameService: DSONameService,
+              public translateService: TranslateService,
+              @Inject(APP_CONFIG) protected appConfig?: AppConfig) {
+    super(truncatableService, dsoNameService, appConfig);
+
+    this.currentLanguage = translateService.currentLang;
+  }
+
   ngOnInit(): void {
     super.ngOnInit();
     this.showThumbnails = this.showThumbnails ?? this.appConfig.browseBy.showThumbnails;
diff --git a/src/app/shared/object-list/search-result-list-element/community-search-result/community-search-result-list-element.component.html b/src/app/shared/object-list/search-result-list-element/community-search-result/community-search-result-list-element.component.html
index f5d68031599..cf167cf02e2 100644
--- a/src/app/shared/object-list/search-result-list-element/community-search-result/community-search-result-list-element.component.html
+++ b/src/app/shared/object-list/search-result-list-element/community-search-result/community-search-result-list-element.component.html
@@ -4,6 +4,6 @@
     <ds-badges *ngIf="showLabel" [object]="dso" [context]="context"></ds-badges>
     <a *ngIf="linkType !== linkTypes.None" [target]="(linkType === linkTypes.ExternalLink) ? '_blank' : '_self'" [attr.rel]="(linkType === linkTypes.ExternalLink) ? 'noopener noreferrer' : null"  [routerLink]="['/communities/' + dso.id]" class="lead" [innerHTML]="dsoTitle"></a>
     <span *ngIf="linkType === linkTypes.None" class="lead" [innerHTML]="dsoTitle"></span>
-    <div *ngIf="dso.shortDescription" class="text-muted abstract-text" [innerHTML]="firstMetadataValue('dc.description.abstract')"></div>
+    <div *ngIf="dso.shortDescription(currentLanguage)" class="text-muted abstract-text" [innerHTML]="firstMetadataValue('dc.description.abstract')"></div>
   </div>
 </div>
diff --git a/src/app/shared/object-list/search-result-list-element/community-search-result/community-search-result-list-element.component.spec.ts b/src/app/shared/object-list/search-result-list-element/community-search-result/community-search-result-list-element.component.spec.ts
index 3ef9f33d109..37e02d2b568 100644
--- a/src/app/shared/object-list/search-result-list-element/community-search-result/community-search-result-list-element.component.spec.ts
+++ b/src/app/shared/object-list/search-result-list-element/community-search-result/community-search-result-list-element.component.spec.ts
@@ -10,12 +10,14 @@ import {
 } from '@angular/core/testing';
 import { By } from '@angular/platform-browser';
 import { ActivatedRoute } from '@angular/router';
+import { TranslateService } from '@ngx-translate/core';
 import { of as observableOf } from 'rxjs';
 
 import { APP_CONFIG } from '../../../../../config/app-config.interface';
 import { DSONameService } from '../../../../core/breadcrumbs/dso-name.service';
 import { Community } from '../../../../core/shared/community.model';
 import { DSONameServiceMock } from '../../../mocks/dso-name.service.mock';
+import { translateServiceStub } from '../../../mocks/translate.service.mock';
 import { CommunitySearchResult } from '../../../object-collection/shared/community-search-result.model';
 import { ActivatedRouteStub } from '../../../testing/active-router.stub';
 import { TruncatableService } from '../../../truncatable/truncatable.service';
@@ -73,6 +75,7 @@ describe('CommunitySearchResultListElementComponent', () => {
         { provide: APP_CONFIG, useValue: environmentUseThumbs },
         { provide: ActivatedRoute, useValue: new ActivatedRouteStub() },
         { provide: ThemeService, useValue: getMockThemeService() },
+        { provide: TranslateService, useValue: translateServiceStub },
       ],
       schemas: [NO_ERRORS_SCHEMA],
     }).overrideComponent(CommunitySearchResultListElementComponent, {
diff --git a/src/app/shared/object-list/search-result-list-element/community-search-result/community-search-result-list-element.component.ts b/src/app/shared/object-list/search-result-list-element/community-search-result/community-search-result-list-element.component.ts
index e8e3c579592..fe90f6cd5fc 100644
--- a/src/app/shared/object-list/search-result-list-element/community-search-result/community-search-result-list-element.component.ts
+++ b/src/app/shared/object-list/search-result-list-element/community-search-result/community-search-result-list-element.component.ts
@@ -4,15 +4,24 @@ import {
 } from '@angular/common';
 import {
   Component,
+  Inject,
   OnInit,
 } from '@angular/core';
 import { RouterLink } from '@angular/router';
+import { TranslateService } from '@ngx-translate/core';
 
+import {
+  APP_CONFIG,
+  AppConfig,
+} from '../../../../../config/app-config.interface';
+import { environment } from '../../../../../environments/environment';
+import { DSONameService } from '../../../../core/breadcrumbs/dso-name.service';
 import { Community } from '../../../../core/shared/community.model';
 import { ViewMode } from '../../../../core/shared/view-mode.model';
 import { ThemedBadgesComponent } from '../../../object-collection/shared/badges/themed-badges.component';
 import { CommunitySearchResult } from '../../../object-collection/shared/community-search-result.model';
 import { listableObjectComponent } from '../../../object-collection/shared/listable-object/listable-object.decorator';
+import { TruncatableService } from '../../../truncatable/truncatable.service';
 import { SearchResultListElementComponent } from '../search-result-list-element.component';
 
 @Component({
@@ -32,6 +41,21 @@ export class CommunitySearchResultListElementComponent extends SearchResultListE
    */
   showThumbnails: boolean;
 
+  /**
+   * The current language of the page
+   */
+  currentLanguage: string = environment.defaultLanguage;
+
+  constructor(protected truncatableService: TruncatableService,
+              public dsoNameService: DSONameService,
+              public translateService: TranslateService,
+              @Inject(APP_CONFIG) protected appConfig: AppConfig,
+  ) {
+    super(truncatableService, dsoNameService, appConfig);
+
+    this.currentLanguage = translateService.currentLang;
+  }
+
   ngOnInit(): void {
     super.ngOnInit();
     this.showThumbnails = this.showThumbnails ?? this.appConfig.browseBy.showThumbnails;
diff --git a/src/assets/i18n/en.json5 b/src/assets/i18n/en.json5
index 7da72f0fb3a..b634cede6bc 100644
--- a/src/assets/i18n/en.json5
+++ b/src/assets/i18n/en.json5
@@ -1148,6 +1148,10 @@
 
   "collection.edit.tabs.mapper.head": "Item Mapper",
 
+  "collection.edit.tabs.multilingual-editor": "Multilingual content editor",
+
+  "collection.edit.tabs.default-language": "Default language",
+
   "collection.edit.tabs.item-mapper.title": "Collection Edit - Item Mapper",
 
   "collection.edit.item-mapper.cancel": "Cancel",
diff --git a/src/assets/i18n/pl.json5 b/src/assets/i18n/pl.json5
index f90855f9a67..7fb01b91b64 100644
--- a/src/assets/i18n/pl.json5
+++ b/src/assets/i18n/pl.json5
@@ -755,6 +755,8 @@
   "collection.edit.head": "Edytuj kolekcję",
   "collection.edit.breadcrumbs": "Edytuj kolekcję",
   "collection.edit.tabs.mapper.head": "Item Mapper",
+  "collection.edit.tabs.multilingual-editor": "Wielojęzyczny edytor",
+  "collection.edit.tabs.default-language": "Język podstawowy",
   "collection.edit.tabs.item-mapper.title": "Edytuj kolekcję - Item Mapper",
   "collection.edit.item-mapper.cancel": "Anuluj",
   "collection.edit.item-mapper.collection": "Kolekcja: \"<b>{{name}}</b>\"",