diff --git a/resources/i18n/en.json b/resources/i18n/en.json
index 5057410ff8..ab0d82aabe 100644
--- a/resources/i18n/en.json
+++ b/resources/i18n/en.json
@@ -50,7 +50,12 @@
     "isProjectOf": "Projects",
     "isOrgUnitOf": "Org Units",
     "isAuthorOf": "Authors",
-    "isPersonOf": "Authors"
+    "isPersonOf": "Authors",
+    "isJournalOf": "Journals",
+    "isSingleJournalOf": "Journal",
+    "isVolumeOf": "Volumes",
+    "isSingleVolumeOf": "Volume",
+    "isIssueOf": "Issues"
   },
   "person": {
     "page": {
@@ -84,6 +89,28 @@
       "description": "Description"
     }
   },
+  "journal": {
+    "page": {
+      "issn": "ISSN",
+      "publisher": "Publisher",
+      "description": "Description"
+    }
+  },
+  "journalvolume": {
+    "page": {
+      "volume": "Volume",
+      "issuedate": "Issue Date",
+      "description": "Description"
+    }
+  },
+  "journalissue": {
+    "page": {
+      "number": "Number",
+      "issuedate": "Issue Date",
+      "description": "Description",
+      "keyword": "Keywords"
+    }
+  },
   "nav": {
     "home": "Home"
   },
diff --git a/src/app/+item-page/item-page.module.ts b/src/app/+item-page/item-page.module.ts
index 763f549b26..ce859e0168 100644
--- a/src/app/+item-page/item-page.module.ts
+++ b/src/app/+item-page/item-page.module.ts
@@ -25,6 +25,9 @@ import { OrgUnitPageFieldsComponent } from './simple/entity-types/orgunit/orguni
 import { PersonPageFieldsComponent } from './simple/entity-types/person/person-page-fields.component';
 import { ProjectPageFieldsComponent } from './simple/entity-types/project/project-page-fields.component';
 import { RelatedEntitiesComponent } from './simple/related-entities/related-entities-component';
+import { JournalPageFieldsComponent } from './simple/entity-types/journal/journal-page-fields.component';
+import { JournalIssuePageFieldsComponent } from './simple/entity-types/journal-issue/journal-issue-page-fields.component';
+import { JournalVolumePageFieldsComponent } from './simple/entity-types/journal-volume/journal-volume-page-fields.component';
 
 @NgModule({
   imports: [
@@ -53,13 +56,19 @@ import { RelatedEntitiesComponent } from './simple/related-entities/related-enti
     PersonPageFieldsComponent,
     RelatedEntitiesComponent,
     EntityPageFieldsComponent,
-    GenericItemPageFieldComponent
+    GenericItemPageFieldComponent,
+    JournalPageFieldsComponent,
+    JournalIssuePageFieldsComponent,
+    JournalVolumePageFieldsComponent
   ],
   entryComponents: [
     PublicationPageFieldsComponent,
     ProjectPageFieldsComponent,
     OrgUnitPageFieldsComponent,
-    PersonPageFieldsComponent
+    PersonPageFieldsComponent,
+    JournalPageFieldsComponent,
+    JournalIssuePageFieldsComponent,
+    JournalVolumePageFieldsComponent
   ]
 })
 export class ItemPageModule {
diff --git a/src/app/+item-page/simple/entity-types/journal-issue/journal-issue-page-fields.component.html b/src/app/+item-page/simple/entity-types/journal-issue/journal-issue-page-fields.component.html
new file mode 100644
index 0000000000..3f86ab912b
--- /dev/null
+++ b/src/app/+item-page/simple/entity-types/journal-issue/journal-issue-page-fields.component.html
@@ -0,0 +1,32 @@
+<h2 class="item-page-title-field">
+  <ds-metadata-values [values]="item?.filterMetadata(['dc.title'])"></ds-metadata-values>
+</h2>
+<div class="row">
+  <div class="col-xs-12 col-md-4">
+    <ds-metadata-field-wrapper>
+      <ds-thumbnail [thumbnail]="this.item.getThumbnail() | async"></ds-thumbnail>
+    </ds-metadata-field-wrapper>
+    <ds-generic-item-page-field [item]="item"
+      [fields]="['journalissue.identifier.number']"
+      [label]="'journalissue.page.number'">
+    </ds-generic-item-page-field>
+    <ds-generic-item-page-field [item]="item"
+      [fields]="['journalissue.issuedate']"
+      [label]="'journalissue.page.issuedate'">
+    </ds-generic-item-page-field>
+  </div>
+  <div class="col-xs-12 col-md-6">
+    <ds-related-entities
+      [entities]="volumes$ | async"
+      [label]="'relationships.isSingleVolumeOf' | translate">
+    </ds-related-entities>
+    <ds-generic-item-page-field [item]="item"
+      [fields]="['journalissue.identifier.description']"
+      [label]="'journalissue.page.description'">
+    </ds-generic-item-page-field>
+    <ds-generic-item-page-field [item]="item"
+      [fields]="['journalissue.identifier.keyword']"
+      [label]="'journalissue.page.keyword'">
+    </ds-generic-item-page-field>
+  </div>
+</div>
diff --git a/src/app/+item-page/simple/entity-types/journal-issue/journal-issue-page-fields.component.scss b/src/app/+item-page/simple/entity-types/journal-issue/journal-issue-page-fields.component.scss
new file mode 100644
index 0000000000..3575cae797
--- /dev/null
+++ b/src/app/+item-page/simple/entity-types/journal-issue/journal-issue-page-fields.component.scss
@@ -0,0 +1 @@
+@import '../../../../../styles/variables.scss';
diff --git a/src/app/+item-page/simple/entity-types/journal-issue/journal-issue-page-fields.component.ts b/src/app/+item-page/simple/entity-types/journal-issue/journal-issue-page-fields.component.ts
new file mode 100644
index 0000000000..2f98c187f2
--- /dev/null
+++ b/src/app/+item-page/simple/entity-types/journal-issue/journal-issue-page-fields.component.ts
@@ -0,0 +1,36 @@
+import { Component, Inject } from '@angular/core';
+import { Observable } from 'rxjs/Observable';
+import { ItemDataService } from '../../../../core/data/item-data.service';
+import { Item } from '../../../../core/shared/item.model';
+import { rendersEntityType } from '../../../../shared/entities/entity-type-decorator';
+import { ITEM } from '../../../../shared/entities/switcher/entity-type-switcher.component';
+import { ElementViewMode } from '../../../../shared/view-mode';
+import {
+  EntityPageFieldsComponent, filterRelationsByTypeLabel,
+  relationsToItems
+} from '../shared/entity-page-fields.component';
+
+@rendersEntityType('JournalIssue', ElementViewMode.Full)
+@Component({
+  selector: 'ds-journal-issue-page-fields',
+  styleUrls: ['./journal-issue-page-fields.component.scss'],
+  templateUrl: './journal-issue-page-fields.component.html'
+})
+export class JournalIssuePageFieldsComponent extends EntityPageFieldsComponent {
+  volumes$: Observable<Item[]>;
+
+  constructor(
+    @Inject(ITEM) public item: Item,
+    private ids: ItemDataService
+  ) {
+    super(item);
+  }
+  ngOnInit(): void {
+    super.ngOnInit();
+
+    this.volumes$ = this.resolvedRelsAndTypes$.pipe(
+      filterRelationsByTypeLabel('isJournalVolumeOfIssue'),
+      relationsToItems(this.item.id, this.ids)
+    );
+  }
+}
diff --git a/src/app/+item-page/simple/entity-types/journal-volume/journal-volume-page-fields.component.html b/src/app/+item-page/simple/entity-types/journal-volume/journal-volume-page-fields.component.html
new file mode 100644
index 0000000000..b1dbc5429f
--- /dev/null
+++ b/src/app/+item-page/simple/entity-types/journal-volume/journal-volume-page-fields.component.html
@@ -0,0 +1,32 @@
+<h2 class="item-page-title-field">
+  <ds-metadata-values [values]="item?.filterMetadata(['dc.title'])"></ds-metadata-values>
+</h2>
+<div class="row">
+  <div class="col-xs-12 col-md-4">
+    <ds-metadata-field-wrapper>
+      <ds-thumbnail [thumbnail]="this.item.getThumbnail() | async"></ds-thumbnail>
+    </ds-metadata-field-wrapper>
+    <ds-generic-item-page-field [item]="item"
+      [fields]="['journalvolume.identifier.volume']"
+      [label]="'journalvolume.page.volume'">
+    </ds-generic-item-page-field>
+    <ds-generic-item-page-field [item]="item"
+      [fields]="['journalvolume.issuedate']"
+      [label]="'journalvolume.page.issuedate'">
+    </ds-generic-item-page-field>
+  </div>
+  <div class="col-xs-12 col-md-6">
+    <ds-related-entities
+      [entities]="journals$ | async"
+      [label]="'relationships.isSingleJournalOf' | translate">
+    </ds-related-entities>
+    <ds-related-entities
+      [entities]="issues$ | async"
+      [label]="'relationships.isIssueOf' | translate">
+    </ds-related-entities>
+    <ds-generic-item-page-field [item]="item"
+      [fields]="['journalvolume.identifier.description']"
+      [label]="'journalvolume.page.description'">
+    </ds-generic-item-page-field>
+  </div>
+</div>
diff --git a/src/app/+item-page/simple/entity-types/journal-volume/journal-volume-page-fields.component.scss b/src/app/+item-page/simple/entity-types/journal-volume/journal-volume-page-fields.component.scss
new file mode 100644
index 0000000000..3575cae797
--- /dev/null
+++ b/src/app/+item-page/simple/entity-types/journal-volume/journal-volume-page-fields.component.scss
@@ -0,0 +1 @@
+@import '../../../../../styles/variables.scss';
diff --git a/src/app/+item-page/simple/entity-types/journal-volume/journal-volume-page-fields.component.ts b/src/app/+item-page/simple/entity-types/journal-volume/journal-volume-page-fields.component.ts
new file mode 100644
index 0000000000..cd3725018d
--- /dev/null
+++ b/src/app/+item-page/simple/entity-types/journal-volume/journal-volume-page-fields.component.ts
@@ -0,0 +1,41 @@
+import { Component, Inject } from '@angular/core';
+import { Observable } from 'rxjs/Observable';
+import { ItemDataService } from '../../../../core/data/item-data.service';
+import { Item } from '../../../../core/shared/item.model';
+import { rendersEntityType } from '../../../../shared/entities/entity-type-decorator';
+import { ITEM } from '../../../../shared/entities/switcher/entity-type-switcher.component';
+import { ElementViewMode } from '../../../../shared/view-mode';
+import {
+  EntityPageFieldsComponent, filterRelationsByTypeLabel,
+  relationsToItems
+} from '../shared/entity-page-fields.component';
+
+@rendersEntityType('JournalVolume', ElementViewMode.Full)
+@Component({
+  selector: 'ds-journal-volume-page-fields',
+  styleUrls: ['./journal-volume-page-fields.component.scss'],
+  templateUrl: './journal-volume-page-fields.component.html'
+})
+export class JournalVolumePageFieldsComponent extends EntityPageFieldsComponent {
+  journals$: Observable<Item[]>;
+  issues$: Observable<Item[]>;
+
+  constructor(
+    @Inject(ITEM) public item: Item,
+    private ids: ItemDataService
+  ) {
+    super(item);
+  }
+  ngOnInit(): void {
+    super.ngOnInit();
+
+    this.journals$ = this.resolvedRelsAndTypes$.pipe(
+      filterRelationsByTypeLabel('isJournalOfVolume'),
+      relationsToItems(this.item.id, this.ids)
+    );
+    this.issues$ = this.resolvedRelsAndTypes$.pipe(
+      filterRelationsByTypeLabel('isIssueOfJournalVolume'),
+      relationsToItems(this.item.id, this.ids)
+    );
+  }
+}
diff --git a/src/app/+item-page/simple/entity-types/journal/journal-page-fields.component.html b/src/app/+item-page/simple/entity-types/journal/journal-page-fields.component.html
new file mode 100644
index 0000000000..452e1d61ea
--- /dev/null
+++ b/src/app/+item-page/simple/entity-types/journal/journal-page-fields.component.html
@@ -0,0 +1,28 @@
+<h2 class="item-page-title-field">
+  <ds-metadata-values [values]="item?.filterMetadata(['dc.title'])"></ds-metadata-values>
+</h2>
+<div class="row">
+  <div class="col-xs-12 col-md-4">
+    <ds-metadata-field-wrapper>
+      <ds-thumbnail [thumbnail]="this.item.getThumbnail() | async"></ds-thumbnail>
+    </ds-metadata-field-wrapper>
+    <ds-generic-item-page-field [item]="item"
+      [fields]="['journal.identifier.issn']"
+      [label]="'journal.page.issn'">
+    </ds-generic-item-page-field>
+    <ds-generic-item-page-field [item]="item"
+      [fields]="['journal.publisher']"
+      [label]="'journal.page.publisher'">
+    </ds-generic-item-page-field>
+  </div>
+  <div class="col-xs-12 col-md-6">
+    <ds-related-entities
+      [entities]="volumes$ | async"
+      [label]="'relationships.isVolumeOf' | translate">
+    </ds-related-entities>
+    <ds-generic-item-page-field [item]="item"
+      [fields]="['journal.identifier.description']"
+      [label]="'journal.page.description'">
+    </ds-generic-item-page-field>
+  </div>
+</div>
diff --git a/src/app/+item-page/simple/entity-types/journal/journal-page-fields.component.scss b/src/app/+item-page/simple/entity-types/journal/journal-page-fields.component.scss
new file mode 100644
index 0000000000..3575cae797
--- /dev/null
+++ b/src/app/+item-page/simple/entity-types/journal/journal-page-fields.component.scss
@@ -0,0 +1 @@
+@import '../../../../../styles/variables.scss';
diff --git a/src/app/+item-page/simple/entity-types/journal/journal-page-fields.component.ts b/src/app/+item-page/simple/entity-types/journal/journal-page-fields.component.ts
new file mode 100644
index 0000000000..b43805ec52
--- /dev/null
+++ b/src/app/+item-page/simple/entity-types/journal/journal-page-fields.component.ts
@@ -0,0 +1,36 @@
+import { Component, Inject } from '@angular/core';
+import { Observable } from 'rxjs/Observable';
+import { ItemDataService } from '../../../../core/data/item-data.service';
+import { Item } from '../../../../core/shared/item.model';
+import { rendersEntityType } from '../../../../shared/entities/entity-type-decorator';
+import { ITEM } from '../../../../shared/entities/switcher/entity-type-switcher.component';
+import { ElementViewMode } from '../../../../shared/view-mode';
+import {
+  EntityPageFieldsComponent, filterRelationsByTypeLabel,
+  relationsToItems
+} from '../shared/entity-page-fields.component';
+
+@rendersEntityType('Journal', ElementViewMode.Full)
+@Component({
+  selector: 'ds-journal-page-fields',
+  styleUrls: ['./journal-page-fields.component.scss'],
+  templateUrl: './journal-page-fields.component.html'
+})
+export class JournalPageFieldsComponent extends EntityPageFieldsComponent {
+  volumes$: Observable<Item[]>;
+
+  constructor(
+    @Inject(ITEM) public item: Item,
+    private ids: ItemDataService
+  ) {
+    super(item);
+  }
+  ngOnInit(): void {
+    super.ngOnInit();
+
+    this.volumes$ = this.resolvedRelsAndTypes$.pipe(
+      filterRelationsByTypeLabel('isVolumeOfJournal'),
+      relationsToItems(this.item.id, this.ids)
+    );
+  }
+}
diff --git a/src/app/shared/object-list/item-list-element/entity-types/journal-issue/journal-issue-list-element.component.html b/src/app/shared/object-list/item-list-element/entity-types/journal-issue/journal-issue-list-element.component.html
new file mode 100644
index 0000000000..08011cf04e
--- /dev/null
+++ b/src/app/shared/object-list/item-list-element/entity-types/journal-issue/journal-issue-list-element.component.html
@@ -0,0 +1,20 @@
+<ds-truncatable [id]="item.id">
+  <a
+    [routerLink]="['/items/' + item.id]" class="lead"
+    [innerHTML]="getFirstValue('dc.title')"></a>
+  <span class="text-muted">
+    <ds-truncatable-part [id]="item.id" [minLines]="1">
+            <span *ngIf="item.filterMetadata(['journalvolume.identifier.volume']).length > 0"
+                  class="item-list-journal-issues">
+                    <span *ngFor="let value of getValues(['journalvolume.identifier.volume']); let last=last;">
+                        <span [innerHTML]="value"><span [innerHTML]="value"></span></span>
+                    </span>
+                <span *ngIf="item.filterMetadata(['journalissue.identifier.number']).length > 0">
+                    <span *ngFor="let value of getValues(['journalissue.identifier.number']); let last=last;">
+                        <span> - </span><span [innerHTML]="value"><span [innerHTML]="value"></span></span>
+                    </span>
+                </span>
+            </span>
+        </ds-truncatable-part>
+  </span>
+</ds-truncatable>
diff --git a/src/app/shared/object-list/item-list-element/entity-types/journal-issue/journal-issue-list-element.component.scss b/src/app/shared/object-list/item-list-element/entity-types/journal-issue/journal-issue-list-element.component.scss
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/src/app/shared/object-list/item-list-element/entity-types/journal-issue/journal-issue-list-element.component.ts b/src/app/shared/object-list/item-list-element/entity-types/journal-issue/journal-issue-list-element.component.ts
new file mode 100644
index 0000000000..8580757997
--- /dev/null
+++ b/src/app/shared/object-list/item-list-element/entity-types/journal-issue/journal-issue-list-element.component.ts
@@ -0,0 +1,14 @@
+import { Component } from '@angular/core';
+import { rendersEntityType } from '../../../../entities/entity-type-decorator';
+import { ElementViewMode } from '../../../../view-mode';
+import { EntitySearchResultComponent } from '../entity-search-result-component';
+
+@rendersEntityType('JournalIssue', ElementViewMode.SetElement)
+@Component({
+  selector: 'ds-journal-issue-list-element',
+  styleUrls: ['./journal-issue-list-element.component.scss'],
+  templateUrl: './journal-issue-list-element.component.html'
+})
+
+export class JournalIssueListElementComponent extends EntitySearchResultComponent {
+}
diff --git a/src/app/shared/object-list/item-list-element/entity-types/journal-volume/journal-volume-list-element.component.html b/src/app/shared/object-list/item-list-element/entity-types/journal-volume/journal-volume-list-element.component.html
new file mode 100644
index 0000000000..b071179950
--- /dev/null
+++ b/src/app/shared/object-list/item-list-element/entity-types/journal-volume/journal-volume-list-element.component.html
@@ -0,0 +1,20 @@
+<ds-truncatable [id]="item.id">
+  <a
+    [routerLink]="['/items/' + item.id]" class="lead"
+    [innerHTML]="getFirstValue('dc.title')"></a>
+  <span class="text-muted">
+    <ds-truncatable-part [id]="item.id" [minLines]="1">
+            <span *ngIf="item.filterMetadata(['journal.title']).length > 0"
+                  class="item-list-journal-volumes">
+                    <span *ngFor="let value of getValues(['journal.title']); let last=last;">
+                        <span [innerHTML]="value"><span [innerHTML]="value"></span></span>
+                    </span>
+            </span>
+            <span *ngIf="item.filterMetadata(['journalvolume.identifier.volume']).length > 0">
+                    <span *ngFor="let value of getValues(['journalvolume.identifier.volume']); let last=last;">
+                        <span> (</span><span [innerHTML]="value"><span [innerHTML]="value"></span></span><span>)</span>
+                    </span>
+            </span>
+        </ds-truncatable-part>
+  </span>
+</ds-truncatable>
diff --git a/src/app/shared/object-list/item-list-element/entity-types/journal-volume/journal-volume-list-element.component.scss b/src/app/shared/object-list/item-list-element/entity-types/journal-volume/journal-volume-list-element.component.scss
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/src/app/shared/object-list/item-list-element/entity-types/journal-volume/journal-volume-list-element.component.ts b/src/app/shared/object-list/item-list-element/entity-types/journal-volume/journal-volume-list-element.component.ts
new file mode 100644
index 0000000000..956afe99be
--- /dev/null
+++ b/src/app/shared/object-list/item-list-element/entity-types/journal-volume/journal-volume-list-element.component.ts
@@ -0,0 +1,14 @@
+import { Component } from '@angular/core';
+import { rendersEntityType } from '../../../../entities/entity-type-decorator';
+import { ElementViewMode } from '../../../../view-mode';
+import { EntitySearchResultComponent } from '../entity-search-result-component';
+
+@rendersEntityType('JournalVolume', ElementViewMode.SetElement)
+@Component({
+  selector: 'ds-journal-volume-list-element',
+  styleUrls: ['./journal-volume-list-element.component.scss'],
+  templateUrl: './journal-volume-list-element.component.html'
+})
+
+export class JournalVolumeListElementComponent extends EntitySearchResultComponent {
+}
diff --git a/src/app/shared/object-list/item-list-element/entity-types/journal/journal-list-element.component.html b/src/app/shared/object-list/item-list-element/entity-types/journal/journal-list-element.component.html
new file mode 100644
index 0000000000..fb5284d398
--- /dev/null
+++ b/src/app/shared/object-list/item-list-element/entity-types/journal/journal-list-element.component.html
@@ -0,0 +1,15 @@
+<ds-truncatable [id]="item.id">
+  <a
+    [routerLink]="['/items/' + item.id]" class="lead"
+    [innerHTML]="getFirstValue('dc.title')"></a>
+  <span class="text-muted">
+    <ds-truncatable-part [id]="item.id" [minLines]="1">
+            <span *ngIf="item.filterMetadata(['journal.identifier.issn']).length > 0"
+                  class="item-list-journals">
+                    <span *ngFor="let value of getValues(['journal.identifier.issn']); let last=last;">
+                        <span [innerHTML]="value"><span [innerHTML]="value"></span></span>
+                    </span>
+            </span>
+        </ds-truncatable-part>
+  </span>
+</ds-truncatable>
diff --git a/src/app/shared/object-list/item-list-element/entity-types/journal/journal-list-element.component.scss b/src/app/shared/object-list/item-list-element/entity-types/journal/journal-list-element.component.scss
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/src/app/shared/object-list/item-list-element/entity-types/journal/journal-list-element.component.ts b/src/app/shared/object-list/item-list-element/entity-types/journal/journal-list-element.component.ts
new file mode 100644
index 0000000000..d5d2cee1cc
--- /dev/null
+++ b/src/app/shared/object-list/item-list-element/entity-types/journal/journal-list-element.component.ts
@@ -0,0 +1,14 @@
+import { Component } from '@angular/core';
+import { rendersEntityType } from '../../../../entities/entity-type-decorator';
+import { ElementViewMode } from '../../../../view-mode';
+import { EntitySearchResultComponent } from '../entity-search-result-component';
+
+@rendersEntityType('Journal', ElementViewMode.SetElement)
+@Component({
+  selector: 'ds-journal-list-element',
+  styleUrls: ['./journal-list-element.component.scss'],
+  templateUrl: './journal-list-element.component.html'
+})
+
+export class JournalListElementComponent extends EntitySearchResultComponent {
+}
diff --git a/src/app/shared/shared.module.ts b/src/app/shared/shared.module.ts
index 0da82f5e2f..2dd35cb6f8 100644
--- a/src/app/shared/shared.module.ts
+++ b/src/app/shared/shared.module.ts
@@ -14,6 +14,9 @@ import { PublicationListElementComponent } from './object-list/item-list-element
 import { OrgUnitListElementComponent } from './object-list/item-list-element/entity-types/orgunit/orgunit-list-element.component';
 import { PersonListElementComponent } from './object-list/item-list-element/entity-types/person/person-list-element.component';
 import { ProjectListElementComponent } from './object-list/item-list-element/entity-types/project/project-list-element.component';
+import { JournalListElementComponent } from './object-list/item-list-element/entity-types/journal/journal-list-element.component';
+import { JournalVolumeListElementComponent } from './object-list/item-list-element/entity-types/journal-volume/journal-volume-list-element.component';
+import { JournalIssueListElementComponent } from './object-list/item-list-element/entity-types/journal-issue/journal-issue-list-element.component';
 
 import { EnumKeysPipe } from './utils/enum-keys-pipe';
 import { FileSizePipe } from './utils/file-size-pipe';
@@ -112,7 +115,10 @@ const ENTRY_COMPONENTS = [
   PublicationListElementComponent,
   PersonListElementComponent,
   OrgUnitListElementComponent,
-  ProjectListElementComponent
+  ProjectListElementComponent,
+  JournalListElementComponent,
+  JournalVolumeListElementComponent,
+  JournalIssueListElementComponent
 ];
 
 const PROVIDERS = [