Adds dashboard data on tabs

2020-06-30 19:40:01 +03:00 · 2020-06-30 19:40:01 +03:00 · 1230bd2417
parent 64078eb283
commit 1230bd2417
21 changed files with 742 additions and 103 deletions
--- a/dmp-frontend/src/app/app.component.html
+++ b/dmp-frontend/src/app/app.component.html
@ -4,7 +4,7 @@
 		<mat-sidenav #sidenav mode="side" opened class="sidenav" [fixedInViewport]="true" [fixedTopGap]="80">
 			<app-sidebar></app-sidebar>
 		</mat-sidenav>
-		<mat-sidenav-content>
+		<mat-sidenav-content class="sidenav-content">
 			<div>
 				<router-outlet (activate)='onActivate($event)' (deactivate)='onDeactivate($event)'></router-outlet>
 			</div>
--- a/dmp-frontend/src/app/app.component.scss
+++ b/dmp-frontend/src/app/app.component.scss
@ -28,6 +28,10 @@
 	opacity: 1;
 }

+.sidenav-content {
+	background-color: whitesmoke;
+}
+
 .sidebar-shadow {
  box-shadow: 0 4px 18px 0px rgba(0, 0, 0, 0.12), 0 7px 10px -5px rgba(0, 0, 0, 0.15);
  z-index: 100;
--- a/dmp-frontend/src/app/core/model/dataset/dataset-listing.ts
+++ b/dmp-frontend/src/app/core/model/dataset/dataset-listing.ts
@ -11,10 +11,13 @@ export interface DatasetListingModel {
 	registries: String;
 	services: String;
 	description: String;
-	status: Number;
+	status: number;
 	created: Date;
 	modified: Date;
 	finalizedAt: Date;
 	dmpPublishedAt?: Date;
 	version: number;
+	users: any[];
+	public: boolean;
+	isProfileLatestVersion: boolean;
 }
--- a/dmp-frontend/src/app/core/model/dmp/dmp-listing.ts
+++ b/dmp-frontend/src/app/core/model/dmp/dmp-listing.ts
@ -1,4 +1,5 @@
 import { DmpStatus } from "../../common/enum/dmp-status";
+import { DmpAssociatedProfileModel } from '../dmp-profile/dmp-associated-profile';

 export interface DmpListingModel {
 	id: string;
@ -17,7 +18,7 @@ export interface DmpListingModel {
 	groupId: string;
 	version: number;
 	datasets: any[];
-	associatedProfiles: any[];
+	associatedProfiles: DmpAssociatedProfileModel[];
 	users: any[];
 	public: boolean;
 }
--- a/dmp-frontend/src/app/core/model/dmp/dmp-overview.ts
+++ b/dmp-frontend/src/app/core/model/dmp/dmp-overview.ts
@ -1,5 +1,4 @@
 import { OrganizationModel } from "../organisation/organization";
-import { DatasetUrlListing } from "../dataset/dataset-url-listing";
 import { UserInfoListingModel } from "../user/user-info-listing";
 import { DmpAssociatedProfileModel } from "../dmp-profile/dmp-associated-profile";
 import { ResearcherModel } from "../researcher/researcher";
--- a/dmp-frontend/src/app/ui/dashboard/dashboard.component.html
+++ b/dmp-frontend/src/app/ui/dashboard/dashboard.component.html
@ -1,4 +1,4 @@
-<div class="main-content dashboard-main-container" [class.non-auth-main-container]="!this.isAuthenticated()">
+<div class="main-content dashboard-main-container h-100" [class.non-auth-main-container]="!this.isAuthenticated()">
 	<div *ngIf="this.isAuthenticated()" class="container-fluid">
 		<div *ngIf="dashboardStatisticsData?.totalDataManagementPlanCount === 0
 				&& dashboardStatisticsData?.totalDataSetCount === 0
@ -7,21 +7,21 @@
 			<div class="main-content">
 				<div class="col-md-8">
 					<div class="card" [style.display]="isVisible ? 'block' : 'none'">
-					  <a class="col-auto d-flex" (click)="closeCard()"><span class="ml-auto pt-3 material-icons clear-icon">clear</span></a>
-					  <p class="card-title mb-0">What is a DMP in ARGOS</p>
-					  <p class="card-content mb-0">A Data Management Plan (DMP) is a living document describing the datasets that are generated and/ or re-used
-						during and after a research lifetime. DMPs aim to provide researchers with essential information to re-produce,
-						re-distribute and re-purpose research results thus assuring for their validity and exploitation.</p>
-					  <p class="card-content pt-3 mb-0">
-						New with DMPs? Visit <a><u>OpenAIRE’s Guide for Researchers</u></a> to learn more about how to create one!
-					  </p>
-					  <div class="d-flex">
-						<button type="button" class="col-auto align-self-center normal-btn">Start your first DMP</button>
-						<img class="col-auto ml-auto" src="../../assets/img/laptop.png" width="116" height="139">
-					  </div>
+						<!-- <a class="col-auto d-flex" (click)="closeCard()"><span class="ml-auto pt-3 material-icons clear-icon">clear</span></a> -->
+						<p class="card-title mb-0">What is a DMP in ARGOS</p>
+						<p class="card-content mb-0">A Data Management Plan (DMP) is a living document describing the datasets that are generated and/ or re-used
+							during and after a research lifetime. DMPs aim to provide researchers with essential information to re-produce,
+							re-distribute and re-purpose research results thus assuring for their validity and exploitation.</p>
+						<p class="card-content pt-3 mb-0">
+							New with DMPs? Visit <a><u>OpenAIRE’s Guide for Researchers</u></a> to learn more about how to create one!
+						</p>
+						<div class="d-flex">
+							<button type="button" class="col-auto align-self-center normal-btn">Start your first DMP</button>
+							<img class="col-auto ml-auto" src="../../assets/img/laptop.png" width="116" height="139">
+						</div>
 					</div>
-				  </div>
-				  <div class="col-md-4">
+				</div>
+				<div class="col-md-4">
 					<div class="personal-usage">Personal usage</div>
 					<div class="counter-zero">0</div>
 					<a href="#" class="link">DMP's</a>
@ -31,7 +31,7 @@
 					<a href="#" class="link-disabled">Grants</a>
 					<div class="counter-zero">0</div>
 					<a href="#" class="link-disabled">Related organizations</a>
-				  </div>
+				</div>
 			</div>
 		</div>
 		<div *ngIf="dashboardStatisticsData?.totalDataManagementPlanCount !== 0
@ -42,48 +42,58 @@
 			<div class="main-content">
 				<div class="col">
 					<div class="card" [style.display]="isVisible ? 'block' : 'none'">
-						<a class="col-auto d-flex" (click)="closeCard()"><span
-								class="ml-auto pt-3 material-icons clear-icon">clear</span></a>
-						<p class="card-content mb-0 pt-0">A DMP in Argos consists of key information about research,
-							such as purpose,
-							objectives and researchers involved, but also about documentation of research datasets,
-							namely <b> Dataset
-								Descriptions</b>, that highlight the steps followed and the means used across data
-							management activities.</p>
+						<a class="col-auto d-flex" (click)="closeCard()"><span class="ml-auto pt-3 material-icons clear-icon">clear</span></a>
+						<p class="card-content mb-0 pt-0">
+							{{'DASHBOARD.DMP-ABOUT-BEG' | translate}}
+							<b>{{'DASHBOARD.DATASET-DESCRIPTIONS' | translate}}</b>
+							{{'DASHBOARD.DMP-ABOUT-END' | translate}}</p>
 						<div class="d-flex pt-4 pb-4 mt-3 mb-3">
-							<button type="button" class="col-auto align-self-center yellow-btn">Add Dataset
-								Description</button>
+							<button type="button" class="col-auto align-self-center yellow-btn">{{'DASHBOARD.ACTIONS.ADD-DATASET-DESCRIPTION' | translate}}</button>
 						</div>
 					</div>
 					<div class="latest-activity-title">Latest activity</div>
 					<mat-tab-group mat-align-tabs="start" class="remove-border-bottom">
 						<!-- +counter -->
 						<mat-tab label="All">
-							<div class="col-auto"><input type="text" class="d-flex ml-auto" placeholder="&nbsp;&nbsp;&#xf002;&nbsp;&nbsp;Search"></div>
+							<div class="col-auto pt-3"><input type="text" class="d-flex ml-auto" placeholder="&nbsp;&nbsp;&#xf002;&nbsp;&nbsp;Search"></div>
 							<app-recent-edited-activity></app-recent-edited-activity>
+							<div class="d-flex justify-content-center">
+								<button type="button" class="btn-load-more">{{'GENERAL.ACTIONS.LOAD-MORE' | translate}}</button>
+							</div>
+						</mat-tab>
+						<mat-tab label="{{'DASHBOARD.DRAFTS' | translate}}">
+							<!-- <app-drafts></app-drafts> -->
+						</mat-tab>
+						<mat-tab label="{{'DASHBOARD.DMPS' | translate}}">
+							<div class="col-auto pt-3"><input type="text" class="d-flex ml-auto" placeholder="&nbsp;&nbsp;&#xf002;&nbsp;&nbsp;Search"></div>
+							<app-recent-edited-activity></app-recent-edited-activity>
+							<div class="d-flex justify-content-center">
+								<button type="button" class="btn-load-more">{{'GENERAL.ACTIONS.LOAD-MORE' | translate}}</button>
+							</div>
+						</mat-tab>
+						<mat-tab label="{{'DASHBOARD.DATASET-DESCRIPTIONS' | translate}}">
+							<div class="col-auto pt-3"><input type="text" class="d-flex ml-auto" placeholder="&nbsp;&nbsp;&#xf002;&nbsp;&nbsp;Search"></div>
+							<app-recent-edited-dataset-activity></app-recent-edited-dataset-activity>
+							<div class="d-flex justify-content-center">
+								<button type="button" class="btn-load-more">{{'GENERAL.ACTIONS.LOAD-MORE' | translate}}</button>
+							</div>
 						</mat-tab>
-						<mat-tab label="Drafts"></mat-tab>
-						<mat-tab label="DMPs"></mat-tab>
-						<mat-tab label="Dataset Descriptions"></mat-tab>
 					</mat-tab-group>
-					<div class="d-flex justify-content-center">
-						<button type="button" class="btn-load-more">Load more</button>
-					</div>
 				</div>
 				<div class="col-auto">
-					<div class="personal-usage">Personal usage</div>
+					<div class="personal-usage">{{'DASHBOARD.PERSONAL-USAGE' | translate}}</div>
 					<div [ngClass]="{'counter': dashboardStatisticsData?.totalDataManagementPlanCount != 0, 'counter-zero': dashboardStatisticsData?.totalDataManagementPlanCount == 0}">
 						{{dashboardStatisticsData?.totalDataManagementPlanCount}}</div>
-					<a [routerLink]="['/plans']" class="link">DMP's</a>
+					<a [routerLink]="['/plans']" class="link">{{'DASHBOARD.DMPS' | translate}}</a>
 					<div [ngClass]="{'counter': dashboardStatisticsData?.totalDataSetCount != 0, 'counter-zero': dashboardStatisticsData?.totalDataSetCount == 0}">
 						{{dashboardStatisticsData?.totalDataSetCount}}</div>
-					<a [routerLink]="['/datasets']" class="link">Dataset Descriptions</a>
+					<a [routerLink]="['/datasets']" class="link">{{'DASHBOARD.DATASET-DESCRIPTIONS' | translate}}</a>
 					<div [ngClass]="{'counter': dashboardStatisticsData?.totalGrantCount != 0, 'counter-zero': dashboardStatisticsData?.totalGrantCount == 0}">
 						{{dashboardStatisticsData?.totalGrantCount}}</div>
-					<a href="#" class="link-disabled">Grants</a>
+					<a href="#" class="link-disabled">{{'DASHBOARD.GRANTS' | translate}}</a>
 					<div [ngClass]="{'counter': dashboardStatisticsData?.totalOrganisationCount != 0, 'counter-zero': dashboardStatisticsData?.totalOrganisationCount == 0}">
 						{{dashboardStatisticsData?.totalOrganisationCount}}</div>
-					<a href="#" class="link-disabled">Related organizations</a>
+					<a href="#" class="link-disabled">{{'DASHBOARD.RELATED-ORGANISATIONS' | translate}}</a>
 				</div>
 			</div>

--- a/dmp-frontend/src/app/ui/dashboard/dashboard.component.scss
+++ b/dmp-frontend/src/app/ui/dashboard/dashboard.component.scss
@ -1,7 +1,7 @@
 .main-content {
 	background-color: #f5f5f5;
 	padding-top: 3.68rem;
-	padding-bottom: 10rem;
+	padding-bottom: 3rem;
 	// padding-left: 3.31rem;
 	padding-left: 1rem;
 	margin: 0;
--- a/dmp-frontend/src/app/ui/dashboard/dashboard.module.ts
+++ b/dmp-frontend/src/app/ui/dashboard/dashboard.module.ts
@ -16,6 +16,7 @@ import { CommonUiModule } from '@common/ui/common-ui.module';
 import { ConfirmationDialogModule } from '@common/modules/confirmation-dialog/confirmation-dialog.module';
 import { GuestModule } from '../guest/guest.module';
 import { GuestComponent } from '../guest/guest.component';
+import { RecentEditedDatasetActivityComponent } from './recent-edited-dataset-activity/recent-edited-dataset-activity.component';

@NgModule({
 	imports: [
@ -35,7 +36,8 @@ import { GuestComponent } from '../guest/guest.component';
 		RecentEditedActivityComponent,
 		DraftsComponent,
 		DmpInfoCounterComponent,
-		DatasetInfoCounterComponent
+		DatasetInfoCounterComponent,
+		RecentEditedDatasetActivityComponent
 	],
 	entryComponents: [
 		QuickWizardCreateAdd
--- a/dmp-frontend/src/app/ui/dashboard/recent-edited-activity/recent-edited-activity.component.css
+++ b/dmp-frontend/src/app/ui/dashboard/recent-edited-activity/recent-edited-activity.component.css
@ -171,6 +171,9 @@ input[type="text"] {
 	color: #f16868;
 }

+.pointer {
+	cursor: pointer;
+}

 /* th {
  text-transform: uppercase;
--- a/dmp-frontend/src/app/ui/dashboard/recent-edited-activity/recent-edited-activity.component.html
+++ b/dmp-frontend/src/app/ui/dashboard/recent-edited-activity/recent-edited-activity.component.html
@ -1,51 +1,77 @@
 <div *ngIf="dmpActivities != null">
 	<div *ngFor="let activity of dmpActivities">
 		<!-- if dmp -->
-		<div *ngIf="true" class="dmp-card">
-			<div class="d-flex flex-direction-row">
-				<div class="col-auto dmp-label">{{ 'DMP-LISTING.DMP' | translate }}</div>
-				<div class="col-auto ml-auto edited-date">{{ 'DMP-LISTING.EDITED' | translate }}: {{ activity.modifiedTime | date: "longDate" }}</div>
+		<div class="dmp-card">
+			<div [routerLink]="['../plans/overview/' + activity.id]" class="pointer">
+				<div class="d-flex flex-direction-row">
+					<div class="col-auto dmp-label">{{ 'DMP-LISTING.DMP' | translate }}</div>
+					<div class="col-auto ml-auto edited-date">{{ 'DMP-LISTING.EDITED' | translate }}: {{ activity.modifiedTime | date: "longDate" }}</div>
+				</div>
+				<div class="col-auto" [ngClass]="{'dmp-title': !isDraft, 'dmp-title-draft': isDraft}">{{activity.label}}</div>
+				<div class="dmp-subtitle">
+					<span class="col-auto">{{ roleDisplay(activity.users) }}</span>
+					<span>.</span>
+					<span class="col-auto" *ngIf="activity.status === 1 && activity.public === true"><span class="material-icons icon-align">public</span>{{'TYPES.DMP-VISIBILITY.PUBLIC' | translate}}</span>
+					<span *ngIf="activity.status === 1 && activity.public === false" class="col-auto"><span class="material-icons icon-align">done</span>{{ enumUtils.toDmpStatusString(activity.status) }}</span>
+					<span *ngIf="activity.status === 0" class=" col-auto draft"><span class="material-icons icon-align">create</span>{{ enumUtils.toDmpStatusString(activity.status) }}</span>
+					<span>.</span>
+					<span class="col-auto">{{'DMP-LISTING.VERSION' | translate}} {{activity.version}}</span>
+					<span>.</span>
+					<span class="col">{{ 'DMP-LISTING.GRANT' | translate }}: {{activity.grant}}</span>
+				</div>
+				<div class="col-auto dmp-dataset-descriptions-title">{{'DMP-LISTING.CONTAINED-DATASETS' | translate}}: ({{activity.datasets.length}})
+				</div>
+				<div *ngFor="let dataset of activity.datasets; let i = index; let last = last" [ngClass]="{'pb-3': i === activity.datasets.length - 1}">
+					<div *ngIf="i < 3">
+						<div class="col-auto dmp-dataset-descriptions-name" *ngIf="!last">{{dataset.label}},</div>
+						<div class="col-auto dmp-dataset-descriptions-name" *ngIf="last">{{dataset.label}}</div>
+					</div>
+				</div>
+				<a class="d-flex justify-content-center pb-3 show-more" *ngIf="activity.datasets.length > 3" [routerLink]="['../plans/overview/' + activity.id]"><u>{{'GENERAL.ACTIONS.SHOW-MORE' | translate}}</u></a>
 			</div>
-			<div class="col-auto" [ngClass]="{'dmp-title': !isDraft, 'dmp-title-draft': isDraft}">{{activity.label}}</div>
-			<div class="dmp-subtitle">
-				<span class="col-auto">Owner</span>
-				<span>.</span>
-				<span class="col-auto" *ngIf="activity.status === 1 && activity.public === true"><span class="material-icons icon-align">public</span>{{'TYPES.DMP-VISIBILITY.PUBLIC' | translate}}</span>
-				<span *ngIf="activity.status === 1 && activity.public === false" class="col-auto"><span class="material-icons icon-align">done</span>{{ enumUtils.toDmpStatusString(activity.status) }}</span>
-				<span *ngIf="activity.status === 0" class=" col-auto draft"><span class="material-icons icon-align">create</span>{{ enumUtils.toDmpStatusString(activity.status) }}</span>
-				<span>.</span>
-				<span class="col-auto">Version 1</span>
-				<span>.</span>
-				<span class="col">{{ 'DMP-LISTING.GRANT' | translate }}: {{activity.grant}}</span>
-			</div>
-			<div class="col-auto dmp-dataset-descriptions-title">Contained Dataset Descriptions (5)
-			</div>
-			<!-- <div *ngFor="; let i = index" > -->
-			<!-- <div *ngIf="i < 3"></div> -->
-			<div class="col-auto dmp-dataset-descriptions-name">Dataset description: Horizon 2020
-				for Grant DMP of Dataset description</div>
-			<!-- </div> -->
-			<a href="#" class="d-flex justify-content-center pt-3 pb-3 show-more"><u>Show
-					more</u></a>
 			<div class="dmp-card-actions">
-				<a href="#" class="col-auto border-right"><span
-						class="material-icons icon-align pr-2">open_in_new</span>Export</a>
-				<a href="#" class="col-auto border-right"><span
-						class="material-icons icon-align">add</span>Add dataset description</a>
-				<a href="#" class="col-auto border-right"><span
-						class="material-icons icon-align pr-2">group_add</span>Invite
-					collaborators</a>
-				<a href="#" class="col-auto border-right"><span
-						class="material-icons icon-align pr-2">filter_none</span>Clone</a>
-				<a href="#" class="col-auto"><span
-						class="material-icons icon-align pl-2">more_horiz</span></a>
+				<a class="col-auto border-right pointer" [matMenuTriggerFor]="exportMenu"><span class="material-icons icon-align pr-2">open_in_new</span>{{'DMP-LISTING.ACTIONS.EXPORT' | translate}}</a>
+				<a class="col-auto border-right pointer" (click)="addDataset(activity.id)"><span class="material-icons icon-align">add</span>{{'DMP-LISTING.ACTIONS.ADD-DATASET-SHORT' | translate}}</a>
+				<a class="col-auto border-right pointer" (click)="openShareDialog(activity.id, activity.label)"><span class="material-icons icon-align pr-2">group_add</span>{{'DMP-LISTING.ACTIONS.INVITE-SHORT' | translate}}</a>
+				<a class="col-auto border-right pointer" (click)="cloneClicked(activity)"><span class="material-icons icon-align pr-2">filter_none</span>{{'DMP-LISTING.ACTIONS.CLONE' | translate}}</a>
+				<a class="col-auto pointer" [matMenuTriggerFor]="actionsMenu"><span class="material-icons icon-align pl-2">more_horiz</span></a>
 			</div>
+
+			<mat-menu #exportMenu="matMenu" xPosition="before">
+				<button mat-menu-item (click)="downloadPDF(activity.id)">
+					<i class="fa fa-file-pdf-o pr-2"></i>
+					<span>{{'GENERAL.FILE-TYPES.PDF' | translate}}</span>
+				</button>
+				<button mat-menu-item (click)="downloadDocx(activity.id)">
+					<i class="fa fa-file-word-o pr-2"></i>
+					<span>{{'GENERAL.FILE-TYPES.DOC' | translate}}</span>
+				</button>
+				<button mat-menu-item (click)="downloadXml(activity.id)">
+					<i class="fa fa-file-code-o pr-2"></i>
+					<span>{{'GENERAL.FILE-TYPES.XML' | translate}}</span>
+				</button>
+				<button mat-menu-item (click)="downloadJson(activity.id)">
+					<i class="fa fa-file-o pr-2"></i>
+					<span>{{'GENERAL.FILE-TYPES.JSON' | translate}}</span>
+				</button>
+			</mat-menu>
+			<mat-menu #actionsMenu="matMenu" xPosition="before">
+				<button *ngIf="isUserOwner(activity)" mat-menu-item (click)="newVersion(activity.id, activity.label)">
+					<mat-icon>queue</mat-icon>{{'DMP-LISTING.ACTIONS.NEW-VERSION' | translate}}
+				</button>
+				<button mat-menu-item (click)="viewVersions(activity.groupId, activity.label)">
+					<mat-icon>library_books</mat-icon>{{'DMP-LISTING.ACTIONS.VIEW-VERSION' | translate}}
+				</button>
+				<button mat-menu-item *ngIf="isDraftDmp(activity) && isUserOwner(activity)" (click)="deleteClicked()" class="menu-item">
+					<mat-icon>delete</mat-icon>{{ 'DMP-LISTING.ACTIONS.DELETE' | translate }}
+				</button>
+			</mat-menu>
 		</div>
 	</div>
 </div>

 <!-- if dataset -->
-<div *ngIf="true" class="dataset-card">
+<!-- <div *ngIf="true" class="dataset-card">
 	<div class="d-flex flex-direction-row">
 		<div class="col-auto dataset-label">Dataset Description</div>
 		<div class="col-auto ml-auto edited-date">Edited: 9 May 2020</div>
@ -56,7 +82,6 @@
 		<span class="col-auto">Owner</span>
 		<span>.</span>
 		<span class="col-auto"><span class="material-icons icon-align">done</span>Finalized</span>
-		<!-- <span><span class="material-icons">create</span>Draft</span> -->
 		<span>.</span>
 		<span class="col-auto">Grant: NEANIAS Project</span>
 	</div>
@ -67,16 +92,15 @@
 			DMP plan</div>
 	</div>
 	<div class="dataset-card-actions">
-		<a href="#" class="col-auto border-right"><span
-				class="material-icons icon-align pr-2">open_in_new</span>Export</a>
-		<a href="#" class="col-auto border-right"><span
-				class="material-icons icon-align pr-2">group_add</span>Invite
+		<a href="#" class="col-auto border-right"><span class="material-icons icon-align pr-2">open_in_new</span>Export</a>
+		<a href="#" class="col-auto border-right"><span class="material-icons icon-align pr-2">group_add</span>Invite
 			collaborators</a>
-		<a href="#" class="col-auto"><span
-				class="material-icons icon-align pl-2">more_horiz</span></a>
+		<a href="#" class="col-auto"><span class="material-icons icon-align pl-2">more_horiz</span></a>
 	</div>
-</div>
+</div> -->

+
+<!-- Old version of dashboard -->
 <!-- <div class="card">
 	<div class="card-header card-header-plain">
 		<div class="card-desc">
--- a/dmp-frontend/src/app/ui/dashboard/recent-edited-activity/recent-edited-activity.component.ts
+++ b/dmp-frontend/src/app/ui/dashboard/recent-edited-activity/recent-edited-activity.component.ts
@ -15,6 +15,11 @@ import { BaseComponent } from '@common/base/base.component';
 import { TranslateService } from '@ngx-translate/core';
 import * as FileSaver from 'file-saver';
 import { takeUntil } from 'rxjs/operators';
+import { DmpInvitationDialogComponent } from '@app/ui/dmp/invitation/dmp-invitation.component';
+import { DmpStatus } from '@app/core/common/enum/dmp-status';
+import { DatasetService } from '@app/core/services/dataset/dataset.service';
+import { DatasetListingModel } from '@app/core/model/dataset/dataset-listing';
+import { Role } from '@app/core/common/enum/role';

@Component({
 	selector: 'app-recent-edited-activity',
@ -23,6 +28,8 @@ import { takeUntil } from 'rxjs/operators';
 })
 export class RecentEditedActivityComponent extends BaseComponent implements OnInit {
 	dmpActivities: DmpListingModel[];
+	datasetActivities: DatasetListingModel[];
+	// allRecentActivities: RecentActivity[] = [];
 	recentActivityTypeEnum = RecentActivityType;
 	isDraft: boolean;

@ -31,6 +38,7 @@ export class RecentEditedActivityComponent extends BaseComponent implements OnIn
 		public enumUtils: EnumUtils,
 		private authentication: AuthService,
 		private dmpService: DmpService,
+		private datasetService: DatasetService,
 		private language: TranslateService,
 		private dialog: MatDialog,
 		private uiNotificationService: UiNotificationService
@ -48,14 +56,42 @@ export class RecentEditedActivityComponent extends BaseComponent implements OnIn
 				.getPaged(dmpDataTableRequest, "listing")
 				.subscribe(response => {
 					this.dmpActivities = response.data;
+					// this.dmpActivities.forEach(dmpActivity => {
+					// 	const recentActivity: RecentActivity = {
+					// 		activityData: dmpActivity,
+					// 		activityType: RecentActivityType.Dmp
+					// 	};
+					// 	this.allRecentActivities.push(recentActivity)
+					// })
 				});
-		}
+
+			// const datasetDataTableRequest: DataTableRequest<DatasetCriteria> = new DataTableRequest(0, 5, { fields: fields });
+			// datasetDataTableRequest.criteria = new DatasetCriteria();
+			// datasetDataTableRequest.criteria.like = "";
+			// this.datasetService
+			// 	.getPaged(datasetDataTableRequest)
+			// 	.subscribe(response => {
+			// 		this.datasetActivities = response.data;
+			// 		this.datasetActivities.forEach(datasetActivity => {
+			// 			const recentActivity: RecentActivity = {
+			// 				activityData: datasetActivity,
+			// 				activityType: RecentActivityType.Dataset
+			// 			};
+			// 			this.allRecentActivities.push(recentActivity)
+			// 		})
+			// 	});
+			}
 	}

 	public isAuthenticated(): boolean {
 		return !!this.authentication.current();
 	}

+	isUserOwner(activity: DmpListingModel): boolean {
+		const principal: Principal = this.authentication.current();
+		if (principal) return principal.id === activity.users.find(x => x.role === Role.Owner).id;
+	}
+
 	editClicked(dmp: DmpListingModel) {
 		this.router.navigate(['/plans/edit/' + dmp.id]);
 	}
@ -87,6 +123,22 @@ export class RecentEditedActivityComponent extends BaseComponent implements OnIn
 		});
 	}

+	openShareDialog(rowId: any, rowName: any) {
+		const dialogRef = this.dialog.open(DmpInvitationDialogComponent, {
+			// height: '250px',
+			// width: '700px',
+			restoreFocus: false,
+			data: {
+				dmpId: rowId,
+				dmpName: rowName
+			}
+		});
+	}
+
+	isDraftDmp(activity: DmpListingModel) {
+		return activity.status == DmpStatus.Draft;
+	}
+
 	onCallbackSuccess(): void {
 		this.uiNotificationService.snackBarNotification(this.language.instant('GENERAL.SNACK-BAR.SUCCESSFUL-UPDATE'), SnackBarNotificationLevel.Success);
 		this.router.navigate(['/plans']);
@ -210,6 +262,22 @@ export class RecentEditedActivityComponent extends BaseComponent implements OnIn
 		return filename;
 	}

+	addDataset(activityId: String) {
+		this.router.navigate(['/datasets/new/' + activityId]);
+	}
+
+	newVersion(id: String, label: String) {
+		this.router.navigate(['/plans/new_version/' + id, { dmpLabel: label }]);
+	}
+
+	viewVersions(rowId: String, rowLabel: String, activity: DmpListingModel) {
+		if (activity.public && !this.isUserOwner) {
+			this.router.navigate(['/explore-plans/versions/' + rowId], { queryParams: { groupLabel: rowLabel } });
+		} else {
+			this.router.navigate(['/plans/versions/' + rowId], { queryParams: { groupLabel: rowLabel } });
+		}
+	}
+
 	// advancedClicked(dmp: DmpListingModel) {
 	// 	const dialogRef = this.dialog.open(ExportMethodDialogComponent, {
 	// 		maxWidth: '500px',
--- a/dmp-frontend/src/app/ui/dashboard/recent-edited-dataset-activity/recent-edited-dataset-activity.component.html
+++ b/dmp-frontend/src/app/ui/dashboard/recent-edited-dataset-activity/recent-edited-dataset-activity.component.html
@ -0,0 +1,63 @@
+
+<div *ngIf="datasetActivities != null">
+	<div *ngFor="let activity of datasetActivities">
+		<div class="dataset-card">
+			<div>
+			<!-- <div [routerLink]="['../datasets/overview/' + activity.id]"> -->
+				<div class="d-flex flex-direction-row">
+					<div class="col-auto dataset-label">{{'DATASET-LISTING.DATASET-DESCRIPTION' | translate}}</div>
+					<div class="col-auto ml-auto edited-date">{{'DATASET-LISTING.STATES.EDITED' | translate}}: {{activity.modified | date:"longDate"}}</div>
+				</div>
+				<div class="col-auto dataset-title">{{'DATASET-LISTING.DATASET-DESCRIPTION' | translate}}: {{activity.label}}</div>
+				<div class="dataset-subtitle">
+					<span class="col-auto">{{ roleDisplay(activity.users) }}</span>
+					<span>.</span>
+					<span class="col-auto" *ngIf="activity.status === 1 && activity.public === true"><span class="material-icons icon-align">public</span>{{'DATASET-LISTING.STATES.PUBLIC' | translate}}</span>
+					<span *ngIf="activity.status === 1 && activity.public === false" class="col-auto"><span class="material-icons icon-align">done</span>{{ enumUtils.toDmpStatusString(activity.status) }}</span>
+					<span *ngIf="activity.status === 0" class=" col-auto draft"><span class="material-icons icon-align">create</span>{{ enumUtils.toDmpStatusString(activity.status) }}</span>
+					<span>.</span>
+					<span class="col">{{'DATASET-LISTING.COLUMNS.GRANT' | translate}}: {{activity.grant}}</span>
+				</div>
+				<div class="d-flex flex-direction-row pt-3 pb-3">
+					<div class="col-auto dataset-subtitle">{{'DATASET-LISTING.TOOLTIP.PART-OF' | translate}}</div>
+					<div class="col-auto dmp-label">{{'DATASET-LISTING.TOOLTIP.DMP' | translate}}</div>
+					<div class="col-auto dmp-title">{{'DATASET-LISTING.TOOLTIP.DMP-FOR' | translate}}: {{activity.dmp}}</div>
+				</div>
+			</div>
+			<div class="dataset-card-actions">
+				<a class="col-auto border-right pointer" [matMenuTriggerFor]="exportMenu"><span class="material-icons icon-align pr-2">open_in_new</span>{{'DATASET-LISTING.ACTIONS.EXPORT' | translate}}</a>
+				<a class="col-auto border-right pointer"><span class="material-icons icon-align pr-2">group_add</span>{{'DATASET-LISTING.ACTIONS.INVITE-COLLABORATORS' | translate}}</a>
+				<a class="col-auto pointer" [matMenuTriggerFor]="actionsMenu"><span class="material-icons icon-align pl-2">more_horiz</span></a>
+				<!-- <a class="col-auto" [matMenuTriggerFor]="actionsMenu" *ngIf="!publicMode"><span class="material-icons icon-align pl-2">more_horiz</span></a> -->
+			</div>
+			<mat-menu #actionsMenu="matMenu">
+				<button mat-menu-item (click)="openDmpSearchDialogue()" class="menu-item">
+					<mat-icon>file_copy</mat-icon>{{'DATASET-WIZARD.ACTIONS.COPY-DATASET' | translate}}
+				</button>
+				<button mat-menu-item (click)="openConfirm(activity.id)" class="menu-item">
+					<mat-icon>delete</mat-icon>{{ 'DATASET-WIZARD.ACTIONS.DELETE' | translate }}
+				</button>
+				<!-- <button mat-menu-item *ngIf="needsUpdate(activity)" class="menu-item" (click)="openUpdateDatasetProfileDialogue(activity.id);">
+					<mat-icon>update</mat-icon>
+					{{ 'DATASET-WIZARD.ACTIONS.UPDATE-DATASET-PROFILE' | translate }}
+				</button> -->
+			</mat-menu>
+
+			<mat-menu #exportMenu="matMenu" xPosition="before">
+				<button mat-menu-item (click)="downloadPDF(activity)">
+					<i class="fa fa-file-pdf-o pr-2"></i>
+					<span>{{'GENERAL.FILE-TYPES.PDF' | translate}}</span>
+				</button>
+				<button mat-menu-item (click)="downloadDOCX(activity)">
+					<i class="fa fa-file-word-o pr-2"></i>
+					<span>{{'GENERAL.FILE-TYPES.DOC' | translate}}</span>
+				</button>
+				<button mat-menu-item (click)="downloadXML(activity)">
+					<i class="fa fa-file-code-o pr-2"></i>
+					<span>{{'GENERAL.FILE-TYPES.XML' | translate}}</span>
+				</button>
+			</mat-menu>
+		</div>
+	</div>
+</div>
+
--- a/dmp-frontend/src/app/ui/dashboard/recent-edited-dataset-activity/recent-edited-dataset-activity.component.scss
+++ b/dmp-frontend/src/app/ui/dashboard/recent-edited-dataset-activity/recent-edited-dataset-activity.component.scss
@ -0,0 +1,176 @@
+.latest-activity-title {
+	text-align: left;
+	font-weight: 300;
+	font-family: "Roboto", sans-serif;
+	font-size: 1.25rem;
+	letter-spacing: 0px;
+	color: #212121;
+	opacity: 0.6;
+	padding-bottom: 1.2rem;
+}
+
+.dmp-card,
+.dataset-card {
+	min-width: 712px;
+	/* min-height: 308px; */
+	background: #ffffff 0% 0% no-repeat padding-box;
+	box-shadow: 0px 3px 6px #0000001a;
+	border-radius: 4px;
+	opacity: 1;
+	margin-top: 2.43rem;
+	margin-bottom: 1rem;
+}
+
+.remove-border-bottom ::ng-deep .mat-tab-header {
+	border-bottom: none;
+}
+
+input[type="text"] {
+	background: #fafafa 0% 0% no-repeat padding-box;
+	border: 1px solid #d1d1d1;
+	border-radius: 4px;
+	opacity: 1;
+	width: 347px;
+	height: 56px;
+	font-family: Arial, FontAwesome;
+	padding-left: 15px;
+}
+
+.edited-date {
+	text-align: left;
+	font-weight: 300;
+	font-family: "Roboto", sans-serif;
+	line-height: 2.4;
+	letter-spacing: 0px;
+	color: #212121;
+	opacity: 0.6;
+}
+
+.dmp-label {
+	background: #129d99 0% 0% no-repeat padding-box;
+	border-radius: 4px 0px;
+	opacity: 1;
+	width: 67px;
+	height: 37px;
+	color: #ffffff;
+	line-height: 2.4;
+	opacity: 0.75;
+}
+
+.dataset-label {
+	width: 158px;
+	height: 37px;
+	background: #f7dd72 0% 0% no-repeat padding-box;
+	border-radius: 4px 0px;
+	text-align: left;
+	line-height: 2.8;
+	font-size: 0.875rem;
+	letter-spacing: 0px;
+	color: #212121;
+	opacity: 0.75;
+}
+
+.dmp-title,
+.dataset-title {
+	text-align: left;
+	font-weight: 500;
+	font-family: "Roboto", sans-serif;
+	font-size: 1rem;
+	opacity: 0.81;
+	padding-top: 0.75rem;
+	padding-bottom: 0.55rem;
+	color: #212121;
+}
+
+.dataset-subtitle,
+.dmp-subtitle {
+	display: flex;
+	flex-direction: row;
+	text-align: left;
+	font-weight: 400;
+	font-family: "Roboto", sans-serif;
+	font-size: 0.875rem;
+	opacity: 1;
+	align-items: center;
+	color: #848484;
+}
+
+.dmp-title-draft {
+	text-align: left;
+	font-weight: 500;
+	font-family: "Roboto", sans-serif;
+	font-size: 1rem;
+	opacity: 0.81;
+	padding-top: 0.75rem;
+	padding-bottom: 0.55rem;
+	color: #f16868;
+}
+
+.icon-align {
+	display: inline-flex;
+	vertical-align: middle;
+	padding-bottom: 0.4rem;
+}
+
+.dataset-card-actions,
+.dmp-card-actions {
+	display: flex;
+	flex-direction: row;
+	border-top: 1px solid #dbdbdb;
+	line-height: 4;
+	color: #848484;
+}
+
+.dataset-card-actions a,
+.dmp-card-actions a {
+	color: #848484 !important;
+	text-decoration: none !important;
+}
+
+.dataset-card-actions a:hover,
+.dmp-card-actions a:hover {
+	color: #129d99 !important;
+}
+
+.dmp-dataset-descriptions-title {
+	color: #000000;
+	opacity: 0.6;
+	padding-top: 1.5rem;
+	padding-bottom: 0.8rem;
+}
+
+.dmp-dataset-descriptions-name {
+	color: #000000;
+	opacity: 0.6;
+	font-weight: 700;
+}
+
+.show-more {
+	color: black !important;
+}
+
+.show-more:hover {
+	color: #129d99 !important;
+}
+
+.btn-load-more {
+	border: 2px solid #212121;
+	border-radius: 30px;
+	opacity: 1;
+	width: 132px;
+	height: 40px;
+	margin-top: 4.125rem;
+}
+
+.btn-load-more:hover {
+	background-color: black;
+	color: white;
+}
+
+.draft {
+	color: #f16868;
+}
+
+.pointer {
+	cursor: pointer;
+}
--- a/dmp-frontend/src/app/ui/dashboard/recent-edited-dataset-activity/recent-edited-dataset-activity.component.ts
+++ b/dmp-frontend/src/app/ui/dashboard/recent-edited-dataset-activity/recent-edited-dataset-activity.component.ts
@ -0,0 +1,224 @@
+import { Component, OnInit } from '@angular/core';
+import { DatasetListingModel } from '@app/core/model/dataset/dataset-listing';
+import { DatasetService } from '@app/core/services/dataset/dataset.service';
+import { DataTableRequest } from '@app/core/model/data-table/data-table-request';
+import { DatasetCriteria } from '@app/core/query/dataset/dataset-criteria';
+import { AuthService } from '@app/core/services/auth/auth.service';
+import { BaseComponent } from '@common/base/base.component';
+import { Principal } from '@app/core/model/auth/principal';
+import { TranslateService } from '@ngx-translate/core';
+import { EnumUtils } from '@app/core/services/utilities/enum-utils.service';
+import { FormControl } from '@angular/forms';
+import { DatasetCopyDialogueComponent } from '@app/ui/dataset/dataset-wizard/dataset-copy-dialogue/dataset-copy-dialogue.component';
+import { MatDialog } from '@angular/material';
+import { takeUntil } from 'rxjs/operators';
+import { Router } from '@angular/router';
+import { DatasetWizardService } from '@app/core/services/dataset-wizard/dataset-wizard.service';
+import * as FileSaver from 'file-saver';
+import { ConfirmationDialogComponent } from '@common/modules/confirmation-dialog/confirmation-dialog.component';
+import { ValidationErrorModel } from '@common/forms/validation/error-model/validation-error-model';
+import { UiNotificationService } from '@app/core/services/notification/ui-notification-service';
+import { SnackBarNotificationLevel } from '@common/modules/notification/ui-notification-service';
+import { DatasetStatus } from '@app/core/common/enum/dataset-status';
+
+@Component({
+	selector: 'app-recent-edited-dataset-activity',
+	templateUrl: './recent-edited-dataset-activity.component.html',
+	styleUrls: ['./recent-edited-dataset-activity.component.scss']
+})
+export class RecentEditedDatasetActivityComponent extends BaseComponent implements OnInit {
+
+	datasetActivities: DatasetListingModel[];
+	// publicMode = false;
+
+	constructor(
+		private authentication: AuthService,
+		private datasetService: DatasetService,
+		private language: TranslateService,
+		public enumUtils: EnumUtils,
+		public dialog: MatDialog,
+		public router: Router,
+		private datasetWizardService: DatasetWizardService,
+		private uiNotificationService: UiNotificationService
+	) {
+		super();
+	}
+
+	ngOnInit() {
+		if (this.isAuthenticated()) {
+			const fields: Array<string> = ["-modified"];
+			const datasetDataTableRequest: DataTableRequest<DatasetCriteria> = new DataTableRequest(0, 5, { fields: fields });
+			datasetDataTableRequest.criteria = new DatasetCriteria();
+			datasetDataTableRequest.criteria.like = "";
+			this.datasetService
+				.getPaged(datasetDataTableRequest)
+				.subscribe(response => {
+					this.datasetActivities = response.data;
+				});
+		}
+	}
+
+	public isAuthenticated(): boolean {
+		return !!this.authentication.current();
+	}
+
+	roleDisplay(value: any) {
+		const principal: Principal = this.authentication.current();
+		let role: number;
+		if (principal) {
+			value.forEach(element => {
+				if (principal.id === element.id) {
+					role = element.role;
+				}
+			});
+		}
+		if (role === 0) {
+			return this.language.instant('DMP-LISTING.OWNER');
+		}
+		else if (role === 1) {
+			return this.language.instant('DMP-LISTING.MEMBER');
+		}
+		else {
+			return this.language.instant('DMP-LISTING.OWNER');
+		}
+	}
+
+	openDmpSearchDialogue(dataset: DatasetListingModel) {
+		const formControl = new FormControl();
+		const dialogRef = this.dialog.open(DatasetCopyDialogueComponent, {
+			width: '500px',
+			restoreFocus: false,
+			data: {
+				formControl: formControl,
+				datasetId: dataset.id,
+				datasetProfileId: dataset.profile,
+				datasetProfileExist: false,
+				confirmButton: this.language.instant('DATASET-WIZARD.DIALOGUE.COPY'),
+				cancelButton: this.language.instant('DATASET-WIZARD.DIALOGUE.CANCEL')
+			}
+		});
+
+		dialogRef.afterClosed().pipe(takeUntil(this._destroyed))
+			.subscribe(result => {
+				if (result && result.datasetProfileExist) {
+					const newDmpId = result.formControl.value.id
+					this.router.navigate(['/datasets/copy/' + result.datasetId], { queryParams: { newDmpId: newDmpId } });
+				}
+			});
+	}
+
+	openConfirm(id: string): void {
+		const dialogRef = this.dialog.open(ConfirmationDialogComponent, {
+			maxWidth: '300px',
+			restoreFocus: false,
+			data: {
+				message: this.language.instant('GENERAL.CONFIRMATION-DIALOG.DELETE-ITEM'),
+				confirmButton: this.language.instant('GENERAL.CONFIRMATION-DIALOG.ACTIONS.DELETE'),
+				cancelButton: this.language.instant('GENERAL.CONFIRMATION-DIALOG.ACTIONS.CANCEL'),
+				isDeleteConfirmation: true
+			}
+		});
+		dialogRef.afterClosed().pipe(takeUntil(this._destroyed)).subscribe(result => {
+			if (result) {
+				this.datasetWizardService.delete(id)
+					.pipe(takeUntil(this._destroyed))
+					.subscribe(
+						complete => this.onCallbackSuccess(),
+						error => this.onCallbackError(error)
+					);
+			}
+		});
+	}
+
+	getFilenameFromContentDispositionHeader(header: string): string {
+		const regex: RegExp = new RegExp(/filename[^;=\n]*=((['"]).*?\2|[^;\n]*)/g);
+
+		const matches = header.match(regex);
+		let filename: string;
+		for (let i = 0; i < matches.length; i++) {
+			const match = matches[i];
+			if (match.includes('filename="')) {
+				filename = match.substring(10, match.length - 1);
+				break;
+			} else if (match.includes('filename=')) {
+				filename = match.substring(9);
+				break;
+			}
+		}
+		return filename;
+	}
+
+	downloadPDF(dataset: DatasetListingModel): void {
+		this.datasetWizardService.downloadPDF(dataset.id as string)
+			.pipe(takeUntil(this._destroyed))
+			.subscribe(response => {
+				const blob = new Blob([response.body], { type: 'application/pdf' });
+				const filename = this.getFilenameFromContentDispositionHeader(response.headers.get('Content-Disposition'));
+
+				FileSaver.saveAs(blob, filename);
+			});
+	}
+
+	downloadDOCX(dataset: DatasetListingModel): void {
+		this.datasetWizardService.downloadDOCX(dataset.id as string)
+			.pipe(takeUntil(this._destroyed))
+			.subscribe(response => {
+				const blob = new Blob([response.body], { type: 'application/msword' });
+				const filename = this.getFilenameFromContentDispositionHeader(response.headers.get('Content-Disposition'));
+
+				FileSaver.saveAs(blob, filename);
+			});
+
+	}
+
+	downloadXML(dataset: DatasetListingModel): void {
+		this.datasetWizardService.downloadXML(dataset.id as string)
+			.pipe(takeUntil(this._destroyed))
+			.subscribe(response => {
+				const blob = new Blob([response.body], { type: 'application/xml' });
+				const filename = this.getFilenameFromContentDispositionHeader(response.headers.get('Content-Disposition'));
+
+				FileSaver.saveAs(blob, filename);
+			});
+	}
+
+	onCallbackSuccess(id?: String): void {
+		this.uiNotificationService.snackBarNotification(this.language.instant('GENERAL.SNACK-BAR.SUCCESSFUL-UPDATE'), SnackBarNotificationLevel.Success);
+		id ? this.router.navigate(['/reload']).then(() => { this.router.navigate(['/datasets', 'edit', id]); }) : this.router.navigate(['/datasets']);
+	}
+
+	onCallbackError(error: any) {
+		this.setErrorModel(error.error);
+	}
+
+	openUpdateDatasetProfileDialogue(id: string) {
+		const dialogRef = this.dialog.open(ConfirmationDialogComponent, {
+			restoreFocus: false,
+			data: {
+				message: this.language.instant('DATASET-EDITOR.VERSION-DIALOG.QUESTION'),
+				confirmButton: this.language.instant('GENERAL.CONFIRMATION-DIALOG.ACTIONS.CONFIRM'),
+				cancelButton: this.language.instant('GENERAL.CONFIRMATION-DIALOG.ACTIONS.CANCEL'),
+				isDeleteConfirmation: false
+			}
+		});
+		dialogRef.afterClosed().pipe(takeUntil(this._destroyed)).subscribe(result => {
+			if (result) {
+				this.uiNotificationService.snackBarNotification(this.language.instant('DATASET-WIZARD.MESSAGES.SUCCESS-UPDATE-DATASET-PROFILE'), SnackBarNotificationLevel.Success);
+				this.router.navigate(['/datasets/profileupdate/' + id]);
+			}
+		});
+	}
+
+	public setErrorModel(validationErrorModel: ValidationErrorModel) {
+	}
+
+	needsUpdate(activity: DatasetListingModel) {
+		if (activity.isProfileLatestVersion || (activity.status === DatasetStatus.Finalized)
+			|| (activity.isProfileLatestVersion == undefined && activity.status == undefined)) {
+			return false;
+		}
+		else {
+			return true;
+		}
+	}
+}
--- a/dmp-frontend/src/app/ui/dmp/listing/dmp-listing.component.ts
+++ b/dmp-frontend/src/app/ui/dmp/listing/dmp-listing.component.ts
@ -62,7 +62,6 @@ export class DmpListingComponent extends BaseComponent implements OnInit, IBread
 	}

 	ngOnInit() {
-		console.log(this.router.url);
 		this.isPublic = this.router.url.startsWith('/explore-plans');
 		if (!this.isPublic && isNullOrUndefined(this.authService.current())) {
 			this.router.navigateByUrl("/explore-plans");
--- a/dmp-frontend/src/app/ui/guest/guest.component.ts
+++ b/dmp-frontend/src/app/ui/guest/guest.component.ts
@ -54,7 +54,6 @@ export class GuestComponent implements OnInit {
    const dialogRef = this.dialog.open(SignInDialogComponent);

    dialogRef.afterClosed().subscribe(result => {
-      console.log(`Dialog result: ${result}`);
    });
  }

--- a/dmp-frontend/src/app/ui/navbar/navbar.component.html
+++ b/dmp-frontend/src/app/ui/navbar/navbar.component.html
@ -20,7 +20,7 @@
 					</mat-menu>
 				</div>

-				<app-search></app-search>
+				<!-- <app-search></app-search> -->

 				<ul class="navbar-nav">
 					<!-- Login -->
--- a/dmp-frontend/src/assets/i18n/en.json
+++ b/dmp-frontend/src/assets/i18n/en.json
@ -77,6 +77,7 @@
 		"ACTIONS": {
 			"VIEW-ALL": "View All",
 			"SHOW-MORE": "Show more",
+			"LOAD-MORE": "Load more",
 			"SHOW-LESS": "Show less",
 			"LOG-IN": "Log in"
 		},
@ -392,6 +393,8 @@
 		"MEMBER": "Member",
 		"CREATOR": "Creator",
 		"EDITED": "Edited",
+		"VERSION": "Version",
+		"CONTAINED-DATASETS": "Contained Dataset Descriptions",
 		"COLUMNS": {
 			"NAME": "Name",
 			"GRANT": "Grant",
@ -412,6 +415,7 @@
 			"INVITE": "Invite Contributors",
 			"INVITE-SHORT": "Invite",
 			"ADD-DATASET": "Add Dataset Description To DMP",
+			"ADD-DATASET-DESCRIPTION": "Add dataset description",
 			"ADD-DATASET-SHORT": "Add Dataset",
 			"DATASETS": "List All DMP Dataset Descriptions",
 			"NEW-VERSION": "New Version",
@ -553,6 +557,7 @@
 	},
 	"DATASET-LISTING": {
 		"TITLE": "Dataset Descriptions",
+		"DATASET-DESCRIPTION": "Dataset Description",
 		"SELECT-DATASETS-TO-CLONE": "Select which datasets to include in the new DMP. Selected datasets will be editable.",
 		"SELECT-DATASETS-NONE": "Not available Dataset Descriptions for this DMP.",
 		"COLUMNS": {
@ -578,7 +583,13 @@
 			"MAKE-IT-PUBLIC": "Make it public",
 			"VIEW": "View",
 			"NEW": "New Dataset Description",
-			"CREATE-NEW": "Create new Dataset Description"
+			"CREATE-NEW": "Create new Dataset Description",
+			"EXPORT": "Export",
+			"INVITE-COLLABORATORS": "Invite collaborators"
+		},
+		"STATES": {
+			"EDITED": "Edited",
+			"PUBLIC": "Public"
 		},
 		"TOOLTIP": {
 			"DATASET-STATUS": {
@ -588,7 +599,9 @@
 			"DMP": "DMP",
 			"GRANT": "Grant",
 			"TEMPLATES-INVOLVED": "Dataset Description Template",
-			"VERSION": "DMP Version"
+			"VERSION": "DMP Version",
+			"PART-OF": "Part of",
+			"DMP-FOR": "DMP for"
 		}
 	},
 	"DATASET-PUBLIC-LISTING": {
@ -1110,7 +1123,19 @@
 		"MY-DATASETS": "My Dataset Descriptions",
 		"DATASETS": "Dataset Descriptions",
 		"SEARCH": "SEARCH...",
-		"DATA-MANAGEMENT-PLANS": "DATA MANAGEMENT PLANS"
+		"DATA-MANAGEMENT-PLANS": "DATA MANAGEMENT PLANS",
+		"PERSONAL-USAGE": "Personal Usage",
+		"DMPS": "DMPs",
+		"DATASET-DESCRIPTIONS": "Dataset Descriptions",
+		"GRANTS": "Grants",
+		"RELATED-ORGANISATIONS": "Related Organisations",
+		"DRAFTS": "Drafts",
+		"DMP-ABOUT-BEG": "A DMP in Argos consists of key information about research, such as purpose, objectives and researchers involved, but also about documentation of research datasets, namely",
+		"DMP-ABOUT-END": ", that highlight the steps followed and the means used across data management activities.",
+		"ACTIONS": {
+			"ADD-DATASET-DESCRIPTION": "Add Dataset Description",
+			"ADD-DMP-DESCRIPTION": "Add DMP Description"
+		}
 	},
 	"USER-DIALOG": {
 		"USER-PROFILE": "My Profile",
--- a/dmp-frontend/src/assets/i18n/es.json
+++ b/dmp-frontend/src/assets/i18n/es.json
@ -392,6 +392,8 @@
 		"MEMBER": "Miembro",
 		"CREATOR": "Creator",
 		"EDITED": "Editado en",
+		"VERSION": "Versión",
+		"CONTAINED-DATASETS": "Descripción del Dataset contenidos",
 		"COLUMNS": {
 			"NAME": "Nombre",
 			"GRANT": "Subvención",
@ -411,8 +413,8 @@
 			"EDIT": "Editar",
 			"INVITE": "Invitar a participantes",
 			"INVITE-SHORT": "Invitar",
-			"ADD-DATASET": "Añadir la descripción del Dataset al PGD",
 			"ADD-DATASET-SHORT": "Añadir Dataset",
+			"ADD-DATASET-DESCRIPTION": "Añadir la descripción del Dataset",
 			"DATASETS": "List All PGD Dataset Descriptions",
 			"NEW-VERSION": "Nueva versión",
 			"START-NEW-VERSION": "Inicio Nueva versión",
@ -553,6 +555,7 @@
 	},
 	"DATASET-LISTING": {
 		"TITLE": "Descripciones del Dataset",
+		"DATASET-DESCRIPTION": "Descripción  del Dataset",
 		"SELECT-DATASETS-TO-CLONE": "Seleccione qué datasets incluye en el nuevo PDG. Los datasets será editables.",
 		"SELECT-DATASETS-NONE": "Las descripciones del Dataset no está disponibles para este PGD.",
 		"COLUMNS": {
@ -578,7 +581,13 @@
 			"MAKE-IT-PUBLIC": "Hacer público",
 			"VIEW": "Vista",
 			"NEW": "Nueva descripción del Dataset",
-			"CREATE-NEW": "Crear una nueva descripción del Dataset"
+			"CREATE-NEW": "Crear una nueva descripción del Dataset",
+			"EXPORT": "Exportar",
+			"INVITE-COLLABORATORS": "Invitar a colaboradores"
+		},
+		"STATES": {
+			"EDITED": "Editado",
+			"PUBLIC": "Publicado"
 		},
 		"TOOLTIP": {
 			"DATASET-STATUS": {
@ -1101,7 +1110,17 @@
 		"MY-DATASETS": "Mis descripciones del Dataset",
 		"DATASETS": "descripciones del Dataset",
 		"SEARCH": "BUSCAR...",
-		"DATA-MANAGEMENT-PLANS": "PLANES DE GESTIÓN DE DATOS"
+		"DATA-MANAGEMENT-PLANS": "PLANES DE GESTIÓN DE DATOS",
+		"PERSONAL-USAGE": "Uso Personal",
+		"DMPS": "DMPs",
+		"DATASET-DESCRIPTIONS": "Descripciones del dataset",
+		"GRANTS": "Subvenciones",
+		"RELATED-ORGANISATIONS": "Organizaciones Relacionadas",
+		"DRAFTS": "Borradores",
+		"ACTIONS": {
+			"ADD-DATASET-DESCRIPTION": "Agregar Dataset Descripción",
+			"ADD-DMP-DESCRIPTION": "Agregar DMP Descripción"
+		}
 	},
 	"USER-DIALOG": {
 		"USER-PROFILE": "Mi perfil",
--- a/dmp-frontend/src/assets/i18n/gr.json
+++ b/dmp-frontend/src/assets/i18n/gr.json
@ -392,6 +392,8 @@
 		"MEMBER": "Μέλος",
 		"CREATOR": "Συντάκτης",
 		"EDITED": "Επεξεργάστηκε",
+		"VERSION": "Έκδοση",
+		"CONTAINED-DATASETS": "Δεδομένα που συμπεριλαμβάνει",
 		"COLUMNS": {
 			"NAME": "Τίτλος",
 			"GRANT": "Επιχορήγηση",
@ -412,7 +414,8 @@
 			"INVITE": "Πρόσκληση Συνεργατών",
 			"INVITE-SHORT": "Πρόσκληση",
 			"ADD-DATASET": "Προσθήκη Περιγραφής Συνόλου Δεδομένων στο Σχέδιο Διαχείρισης Δεδομένων",
-			"ADD-DATASET-SHORT": "Προσθήκη Περιγραφής Συνόλου Δεδομένων",
+			"ADD-DATASET-SHORT": "Προσθήκη Συνόλου Δεδομένων",
+			"ADD-DATASET-DESCRIPTION": "Προσθήκη Περιγραφής Συνόλου Δεδομένων",
 			"DATASETS": "Κατάλογος όλων των Περιγραφών Συνόλου Δεδομένων",
 			"NEW-VERSION": "Νέα Έκδοση",
 			"START-NEW-VERSION": "Νέα Έκδοση",
@ -549,6 +552,7 @@
 	},
 	"DATASET-LISTING": {
 		"TITLE": "Περιγραφές Συνόλων Δεδομένων",
+		"DATASET-DESCRIPTION": "Περιγραφή Δεδομένων",
 		"SELECT-DATASETS-TO-CLONE": "Επιλογή των συνόλων δεδομένων που θα συμπεριληφθούν στο νέο Σχέδιο Διαχείρισης Δεδομένων. Τα επιλεγμένα σύνολα δεδομένα θα είναι επεξεργάσιμα.",
 		"SELECT-DATASETS-NONE": "Μη διαθέσιμες Περιγραφές Συνόλου Δεδομένων για αυτό το Σχέδιο Διαχείρισης Δεδομένων",
 		"COLUMNS": {
@ -574,7 +578,13 @@
 			"MAKE-IT-PUBLIC": "Δημοσιοποιήστε",
 			"VIEW": "Προβολή",
 			"NEW": "Νέα Περιγραφή Συνόλου Δεδομένων",
-			"CREATE-NEW": "Δημιουργία νέας Περιγραφής Συνόλου Δεδομένων"
+			"CREATE-NEW": "Δημιουργία νέας Περιγραφής Συνόλου Δεδομένων",
+			"EXPORT": "Εξαγωγή",
+			"INVITE-COLLABORATORS": "Προσκάλεσε συνεργάτες"
+		},
+		"STATES": {
+			"EDITED": "Επεξεργάστηκε",
+			"PUBLIC": "Δημοσιευμένο"
 		},
 		"TOOLTIP": {
 			"DATASET-STATUS": {
@ -1088,7 +1098,17 @@
 		"MY-DATASETS": "Οι Περιγραφές Συνόλων Δεδομένων μου",
 		"DATASETS": "Περιγραφές Συνόλων Δεδομένων",
 		"SEARCH": "ΑΝΑΖΗΤΗΣΗ...",
-		"DATA-MANAGEMENT-PLANS": "ΣΧΕΔΙΑ ΔΙΑΧΕΙΡΙΣΗΣ ΔΕΔΟΜΕΝΩΝ"
+		"DATA-MANAGEMENT-PLANS": "ΣΧΕΔΙΑ ΔΙΑΧΕΙΡΙΣΗΣ ΔΕΔΟΜΕΝΩΝ",
+		"PERSONAL-USAGE": "Προσωπική Χρήση",
+		"DMPS": "DMPs",
+		"DATASET-DESCRIPTIONS": "Περιγραφές Dataset",
+		"GRANTS": "Grants",
+		"RELATED-ORGANISATIONS": "Σχετικοί Οργανισμοί",
+		"DRAFTS": "Προσχέδια",
+		"ACTIONS": {
+			"ADD-DATASET-DESCRIPTION": "Προσθήκη Περιγραφή Dataset",
+			"ADD-DMP-DESCRIPTION": "Προσθήκη Περιγραφή DMP"
+		}
 	},
 	"USER-DIALOG": {
 		"USER-PROFILE": "Το Προφίλ μου",
--- a/dmp-frontend/src/styles.scss
+++ b/dmp-frontend/src/styles.scss
@ -163,7 +163,7 @@
 .main-content {
 	background-color: #f5f5f5;
 	padding-top: 3.68rem;
-	padding-bottom: 10rem;
+	padding-bottom: 3rem;
 	// padding-left: 3.31rem;
 	padding-left: 1rem;
 	margin: 0;