Merge remote-tracking branch 'origin/ui-redesign' into ui-redesign

dmp-frontend/src/app/ui/dashboard/drafts/drafts.component.html

@@ -21,7 +21,7 @@
 	</div>
 	<div *ngFor="let activity of datasetDrafts">
 		<div class="dataset-card">
-			<div [routerLink]="['../datasets/overview/' + activity.id]" class="pointer">
+			<a [routerLink]="['../datasets/overview/' + activity.id]" target="_blank" class="pointer">
 				<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>
@@ -43,7 +43,7 @@
 					<!-- <div class="col-auto dmp-label">{{'DATASET-LISTING.TOOLTIP.DMP' | translate}}</div> -->
 					<div class="col dmp-title">{{activity.dmp}}</div>
 				</div>
-			</div>
+			</a>
 			<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" (click)="openShareDialog(activity.dmpId, activity.dmp)"><span class="material-icons icon-align pr-2">group_add</span>{{'DATASET-LISTING.ACTIONS.INVITE-COLLABORATORS' | translate}}</a>

dmp-frontend/src/app/ui/dashboard/drafts/drafts.component.ts

@@ -153,8 +153,9 @@ export class DraftsComponent extends BaseComponent implements OnInit {
 		dialogRef.afterClosed().pipe(takeUntil(this._destroyed))
 			.subscribe(result => {
 				if (result && result.datasetProfileExist) {
-					const newDmpId = result.formControl.value.id
+					const newDmpId = result.formControl.value.id;
-					this.router.navigate(['/datasets/copy/' + result.datasetId], { queryParams: { newDmpId: newDmpId } });
+					let url = this.router.createUrlTree(['/datasets/copy/', result.datasetId, { newDmpId: newDmpId } ]);
+		      		window.open(url.toString(), '_blank');
 				}
 			});
 	}

dmp-frontend/src/app/ui/dashboard/recent-edited-activity/recent-edited-activity.component.html

@@ -22,7 +22,7 @@
 	<div *ngFor="let activity of allRecentActivities">
 		<div *ngIf="activity && activity.type === recentActivityTypeEnum.Dmp.valueOf()">
 			<div class="dmp-card">
-				<div [routerLink]="['../plans/overview/' + activity.id]" class="pointer">
+				<a [routerLink]="['../plans/overview/' + activity.id]" target="_blank" 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.modified | date: "longDate" }}</div>
@@ -48,12 +48,12 @@
 						</div>
 					</div>
 					<a class="d-flex justify-content-center pb-3 show-more" *ngIf="getDatasets(activity).length > 3" [routerLink]="['../plans/overview/' + activity.id]"><u>{{'GENERAL.ACTIONS.SHOW-MORE' | translate}}</u></a>
-				</div>
+				</a>
 				<div class="dmp-card-actions">
 					<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" *ngIf="isDraftDmp(activity)" (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" *ngIf="isDraftDmp(activity)" [routerLink]="['/datasets/new/' + activity.id]" target="_blank"><span class="material-icons icon-align">add</span>{{'DMP-LISTING.ACTIONS.ADD-DATASET-SHORT' | translate}}</a>
 					<a class="col-auto border-right pointer" *ngIf="isUserOwner(activity)" (click)="openShareDialog(activity.id, activity.title)"><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" *ngIf="isAuthenticated()" (click)="cloneClicked(activity)"><span class="material-icons icon-align pr-2">filter_none</span>{{'DMP-LISTING.ACTIONS.CLONE' | translate}}</a>
+					<a class="col-auto border-right pointer" *ngIf="isAuthenticated()" [routerLink]="['/plans/clone/' + activity.id]" target="_blank"><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>
 
@@ -79,7 +79,7 @@
 					<button *ngIf="isUserOwner(activity)" mat-menu-item (click)="newVersion(activity.id, activity.title)">
 						<mat-icon>queue</mat-icon>{{'DMP-LISTING.ACTIONS.NEW-VERSION' | translate}}
 					</button>
-					<button mat-menu-item (click)="viewVersions(getGroupId(activity), activity.title)">
+					<button mat-menu-item (click)="viewVersions(getGroupId(activity), activity.title, activity)">
 						<mat-icon>library_books</mat-icon>{{'DMP-LISTING.ACTIONS.VIEW-VERSION' | translate}}
 					</button>
 					<button mat-menu-item *ngIf="isUserOwner(activity)" (click)="deleteDmpClicked(activity)" class="menu-item">
@@ -90,7 +90,7 @@
 		</div>
 		<div *ngIf="activity && activity.type === recentActivityTypeEnum.Dataset.valueOf()">
 			<div class="dataset-card">
-				<div [routerLink]="['../datasets/overview/' + activity.id]" class="pointer">
+				<a [routerLink]="['../datasets/overview/' + activity.id]" target="_blank" class="pointer">
 					<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>
@@ -112,7 +112,7 @@
 						<!-- <div class="col-auto dmp-label">{{'DATASET-LISTING.TOOLTIP.DMP' | translate}}</div> -->
 						<div class="col dmp-title">{{ getDmp(activity) }}</div>
 					</div>
-				</div>
+				</a>
 				<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" (click)="openShareDialog(getDmpId(activity), getDmp(activity))"><span class="material-icons icon-align pr-2">group_add</span>{{'DATASET-LISTING.ACTIONS.INVITE-COLLABORATORS' | translate}}</a>

dmp-frontend/src/app/ui/dashboard/recent-edited-activity/recent-edited-activity.component.ts

@@ -141,11 +141,6 @@ export class RecentEditedActivityComponent extends BaseComponent implements OnIn
 		this.router.navigate(['/plans/edit/' + dmp.id]);
 	}
 
-	cloneClicked(dmp: DmpListingModel) {
-		let url = this.router.createUrlTree(['/plans/clone/', dmp.id]);
-		window.open(url.toString(), '_blank');
-	}
-
 	deleteDmpClicked(dmp: DmpListingModel) {
 		this.lockService.checkLockStatus(dmp.id).pipe(takeUntil(this._destroyed))
 			.subscribe(lockStatus => {
@@ -375,19 +370,20 @@ 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 }]);
+		let url = this.router.createUrlTree(['/plans/new_version/', id, { dmpLabel: label }]);
+		window.open(url.toString(), '_blank');
 	}
 
 	viewVersions(rowId: String, rowLabel: String, activity: DmpListingModel) {
-		if (activity.public && !this.isUserOwner) {
+		if (activity.public && !this.isUserOwner(activity)) {
-			this.router.navigate(['/explore-plans/versions/' + rowId], { queryParams: { groupLabel: rowLabel } });
+			let url = this.router.createUrlTree(['/explore-plans/versions/', rowId, { groupLabel: rowLabel }]);
+			window.open(url.toString(), '_blank');
+			// this.router.navigate(['/explore-plans/versions/' + rowId], { queryParams: { groupLabel: rowLabel } });
 		} else {
-			this.router.navigate(['/plans/versions/' + rowId], { queryParams: { groupLabel: rowLabel } });
+			let url = this.router.createUrlTree(['/plans/versions/', rowId, { groupLabel: rowLabel }]);
+			window.open(url.toString(), '_blank');
+			// this.router.navigate(['/plans/versions/' + rowId], { queryParams: { groupLabel: rowLabel } });
 		}
 	}
 
@@ -409,8 +405,10 @@ export class RecentEditedActivityComponent extends BaseComponent implements OnIn
 		dialogRef.afterClosed().pipe(takeUntil(this._destroyed))
 			.subscribe(result => {
 				if (result && result.datasetProfileExist) {
-					const newDmpId = result.formControl.value.id
+					const newDmpId = result.formControl.value.id;
-					this.router.navigate(['/datasets/copy/' + result.datasetId], { queryParams: { newDmpId: newDmpId } });
+					let url = this.router.createUrlTree(['/datasets/copy/', result.datasetId, { newDmpId: newDmpId }]);
+					window.open(url.toString(), '_blank');
+					// this.router.navigate(['/datasets/copy/' + result.datasetId], { queryParams: { newDmpId: newDmpId } });
 				}
 			});
 	}

dmp-frontend/src/app/ui/dashboard/recent-edited-dataset-activity/recent-edited-dataset-activity.component.html

@@ -21,7 +21,7 @@
 	</div>
 	<div *ngFor="let activity of datasetActivities">
 		<div class="dataset-card">
-			<div [routerLink]="['../datasets/overview/' + activity.id]" class="pointer">
+			<a [routerLink]="['../datasets/overview/' + activity.id]" target="_blank" class="pointer">
 				<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>
@@ -43,7 +43,7 @@
 					<!-- <div class="col-auto dmp-label">{{'DATASET-LISTING.TOOLTIP.DMP' | translate}}</div> -->
 					<div class="col dmp-title">{{activity.dmp}}</div>
 				</div>
-			</div>
+			</a>
 			<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" *ngIf="isUserOwner(activity)" (click)="openShareDialog(activity.dmpId, activity.dmp)"><span class="material-icons icon-align pr-2">group_add</span>{{'DATASET-LISTING.ACTIONS.INVITE-COLLABORATORS' | translate}}</a>

dmp-frontend/src/app/ui/dashboard/recent-edited-dataset-activity/recent-edited-dataset-activity.component.ts

@@ -167,8 +167,8 @@ export class RecentEditedDatasetActivityComponent extends BaseComponent implemen
 			.subscribe(result => {
 				if (result && result.datasetProfileExist) {
 					const newDmpId = result.formControl.value.id;
-					let url = this.router.createUrlTree(['/datasets/copy/', result.datasetId, { newDmpId: newDmpId } ])
+					let url = this.router.createUrlTree(['/datasets/copy/', result.datasetId, { newDmpId: newDmpId } ]);
-		      		window.open(url.toString(), '_blank')
+		      		window.open(url.toString(), '_blank');
 				}
 			});
 	}

dmp-frontend/src/app/ui/dashboard/recent-edited-dmp-activity/recent-edited-dmp-activity.component.html

@@ -21,7 +21,7 @@
 	</div>
 	<div *ngFor="let activity of dmpActivities">
 		<div class="dmp-card">
-			<div [routerLink]="['../plans/overview/' + activity.id]" class="pointer">
+			<a [routerLink]="['../plans/overview/' + activity.id]" target="_blank" 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>
@@ -47,12 +47,12 @@
 					</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>
+			</a>
 			<div class="dmp-card-actions">
 				<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" *ngIf="isDraftDmp(activity)" (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" *ngIf="isDraftDmp(activity)" [routerLink]="['/datasets/new/' + activity.id]" target="_blank"><span class="material-icons icon-align">add</span>{{'DMP-LISTING.ACTIONS.ADD-DATASET-SHORT' | translate}}</a>
 				<a class="col-auto border-right pointer" *ngIf="isUserOwner(activity)" (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" *ngIf="isAuthenticated()" (click)="cloneClicked(activity)"><span class="material-icons icon-align pr-2">filter_none</span>{{'DMP-LISTING.ACTIONS.CLONE' | translate}}</a>
+				<a class="col-auto border-right pointer" *ngIf="isAuthenticated()" [routerLink]="['/plans/clone/' + activity.id]" target="_blank"><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>
 
@@ -78,7 +78,7 @@
 				<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)">
+				<button mat-menu-item (click)="viewVersions(activity.groupId, activity.label, activity)">
 					<mat-icon>library_books</mat-icon>{{'DMP-LISTING.ACTIONS.VIEW-VERSION' | translate}}
 				</button>
 				<button mat-menu-item *ngIf="isUserOwner(activity)" (click)="deleteClicked(activity.id)" class="menu-item">

dmp-frontend/src/app/ui/dashboard/recent-edited-dmp-activity/recent-edited-dmp-activity.component.ts

@@ -326,19 +326,20 @@ export class RecentEditedDmpActivityComponent extends BaseComponent implements O
 		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 }]);
+		let url = this.router.createUrlTree(['/plans/new_version/', id, { dmpLabel: label }]);
+		window.open(url.toString(), '_blank');
 	}
 
 	viewVersions(rowId: String, rowLabel: String, activity: DmpListingModel) {
-		if (activity.public && !this.isUserOwner) {
+		if (activity.public && !this.isUserOwner(activity)) {
-			this.router.navigate(['/explore-plans/versions/' + rowId], { queryParams: { groupLabel: rowLabel } });
+			let url = this.router.createUrlTree(['/explore-plans/versions/', rowId, { groupLabel: rowLabel }]);
+			window.open(url.toString(), '_blank');
+			// this.router.navigate(['/explore-plans/versions/' + rowId], { queryParams: { groupLabel: rowLabel } });
 		} else {
-			this.router.navigate(['/plans/versions/' + rowId], { queryParams: { groupLabel: rowLabel } });
+			let url = this.router.createUrlTree(['/plans/versions/', rowId, { groupLabel: rowLabel }]);
+			window.open(url.toString(), '_blank');
+			// this.router.navigate(['/plans/versions/' + rowId], { queryParams: { groupLabel: rowLabel } });
 		}
 	}
 

dmp-frontend/src/app/ui/dataset/listing/listing-item/dataset-listing-item.component.html

@@ -1,5 +1,5 @@
 <div class="dataset-card">
-	<a [routerLink]="isPublic ? ['/datasets/publicOverview/' + dataset.id] : ['/datasets/overview/' + dataset.id]" class="pointer">
+	<a [routerLink]="isPublic ? ['/datasets/publicOverview/' + dataset.id] : ['/datasets/overview/' + dataset.id]" target="_blank" class="pointer">
 		<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}}: {{dataset.modified | date:"longDate"}}</div>

dmp-frontend/src/app/ui/dmp/listing/listing-item/dmp-listing-item.component.html

@@ -1,5 +1,5 @@
 <div class="dmp-card">
-	<a [routerLink]="isPublic ? ['/explore-plans/publicOverview/' + dmp.id] : ['/plans/overview/' + dmp.id]" class="pointer">
+	<a [routerLink]="isPublic ? ['/explore-plans/publicOverview/' + dmp.id] : ['/plans/overview/' + dmp.id]" target="_blank" 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 }}: {{ dmp.modifiedTime | date: "longDate" }}</div>
@@ -28,9 +28,9 @@
 	</a>
 	<div class="dmp-card-actions">
 		<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" *ngIf="isDraftDmp(dmp)" (click)="addDataset(dmp.id)"><span class="material-icons icon-align">add</span>{{'DMP-LISTING.ACTIONS.ADD-DATASET-SHORT' | translate}}</a>
+		<a class="col-auto border-right pointer" *ngIf="isDraftDmp(dmp)" [routerLink]="['/datasets/new/' + dmp.id]" target="_blank"><span class="material-icons icon-align">add</span>{{'DMP-LISTING.ACTIONS.ADD-DATASET-SHORT' | translate}}</a>
 		<a class="col-auto border-right pointer" *ngIf="isUserOwner(dmp)" (click)="openShareDialog(dmp.id, dmp.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" *ngIf="isAuthenticated()" (click)="cloneClicked(dmp)"><span class="material-icons icon-align pr-2">filter_none</span>{{'DMP-LISTING.ACTIONS.CLONE' | translate}}</a>
+		<a class="col-auto border-right pointer" *ngIf="isAuthenticated()" [routerLink]="['/plans/clone/' + dmp.id]" target="_blank"><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>
 
@@ -56,7 +56,7 @@
 		<button *ngIf="isUserOwner(dmp)" mat-menu-item (click)="newVersion(dmp.id, dmp.label)">
 			<mat-icon>queue</mat-icon>{{'DMP-LISTING.ACTIONS.NEW-VERSION' | translate}}
 		</button>
-		<button mat-menu-item (click)="viewVersions(dmp.groupId, dmp.label)">
+		<button mat-menu-item (click)="viewVersions(dmp.groupId, dmp.label, dmp)">
 			<mat-icon>library_books</mat-icon>{{'DMP-LISTING.ACTIONS.VIEW-VERSION' | translate}}
 		</button>
 		<button mat-menu-item *ngIf="isUserOwner(dmp)" (click)="deleteClicked(dmp.id)" class="menu-item">

dmp-frontend/src/app/ui/dmp/listing/listing-item/dmp-listing-item.component.ts

@@ -82,16 +82,20 @@ export class DmpListingItemComponent extends BaseComponent implements OnInit {
 		this.router.navigate(['/plans/edit/' + dmpId]);
 	}
 
-	addDataset(rowId: String) {
-		this.router.navigate(['/datasets/new/' + rowId]);
-	}
-
 	showDatasets(rowId: String, rowLabel: String) {
 		this.router.navigate(['/datasets/dmp/' + rowId, { dmpLabel: rowLabel }]);
 	}
 
-	viewVersions(rowId: String, rowLabel: String) {
+	viewVersions(rowId: String, rowLabel: String, dmp: DmpListingModel) {
-		this.router.navigate(['/plans/versions/' + rowId], { queryParams: { groupLabel: rowLabel } });
+		if (dmp.public && !this.isUserOwner(dmp)) {
+			let url = this.router.createUrlTree(['/explore-plans/versions/', rowId, { groupLabel: rowLabel }]);
+			window.open(url.toString(), '_blank');
+			// this.router.navigate(['/explore-plans/versions/' + rowId], { queryParams: { groupLabel: rowLabel } });
+		} else {
+			let url = this.router.createUrlTree(['/plans/versions/', rowId, { groupLabel: rowLabel }]);
+			window.open(url.toString(), '_blank');
+			// this.router.navigate(['/plans/versions/' + rowId], { queryParams: { groupLabel: rowLabel } });
+		}
 	}
 
 	// itemClicked() {
@@ -145,7 +149,8 @@ export class DmpListingItemComponent extends BaseComponent implements OnInit {
 	}
 
 	newVersion(id: String, label: String) {
-		this.router.navigate(['/plans/new_version/' + id, { dmpLabel: label }]);
+		let url = this.router.createUrlTree(['/plans/new_version/', id, { dmpLabel: label }]);
+		window.open(url.toString(), '_blank');
 	}
 
 	downloadXml(id: string) {

dmp-frontend/src/app/ui/dmp/overview/dmp-overview.component.html

@@ -52,7 +52,7 @@
 						</div>
 					</div>
 					<div class="row">
-						<button *ngIf="isAuthenticated()" (click)="cloneClicked(dmp)" mat-mini-fab
+						<button *ngIf="isAuthenticated()" (click)="cloneClicked(dmp)" mat-mini-fab 
 							class="mr-3 d-flex justify-content-center align-items-center"
 							matTooltip="{{'DMP-LISTING.ACTIONS.CLONE' | translate}}" matTooltipPosition="above">
 							<mat-icon class="mat-mini-fab-icon">content_copy</mat-icon>
@@ -88,7 +88,7 @@
 					<div class="row header">{{'DMP-OVERVIEW.DATASETS-USED' | translate}}</div>
 					<div class="d-flex flex-column">
 						<div *ngFor="let dataset of dmp.datasets">
-							<div class="row" (click)="datasetClicked(dataset.id)">
+							<a class="row" [routerLink]="['/datasets/overview/' + dataset.id]" target="_blank">
 								<button mat-raised-button class="mb-2 mr-2 pl-0 pr-0">
 									<div matTooltip="{{ dataset.label }}"
 										class="col-auto dataset-btn">
@@ -96,15 +96,14 @@
 										<mat-icon>launch</mat-icon>
 									</div>
 								</button>
-							</div>
+							</a>
 						</div>
 					</div>
 					<div class="row mt-2 add-dataset-txt">
-						<button class="add-dataset-btn" *ngIf="isDraftDmp(dmp)"
+						<a class="add-dataset-btn" *ngIf="isDraftDmp(dmp)" [routerLink]="['/datasets/new/' + dmp.id]" target="_blank">
-							(click)="addDataset(dmp.id)">
 							<mat-icon>add</mat-icon>
 							{{'DMP-LISTING.ACTIONS.ADD-DATASET-SHORT' | translate}}
-						</button>
+					</a>
 					</div>
 				</div>
 				<div class="col-md-4 col-lg-4 p-0">

dmp-frontend/src/app/ui/dmp/overview/dmp-overview.module.ts

@@ -7,6 +7,7 @@ import { UrlListingModule } from '@app/library/url-listing/url-listing.module';
 import { DmpOverviewComponent } from '@app/ui/dmp/overview/dmp-overview.component';
 import { CommonFormsModule } from '@common/forms/common-forms.module';
 import { CommonUiModule } from '@common/ui/common-ui.module';
+import { RouterModule } from '@angular/router';
 
 @NgModule({
 	imports: [
@@ -16,7 +17,8 @@ import { CommonUiModule } from '@common/ui/common-ui.module';
 		ConfirmationDialogModule,
 		ExportMethodDialogModule,
 		FormattingModule,
-		AutoCompleteModule
+		AutoCompleteModule,
+		RouterModule 
 	],
 	declarations: [
 		DmpOverviewComponent