From 5b93fb521c878ac8b14d81b595525a9cf696c1c8 Mon Sep 17 00:00:00 2001
From: Sofia Papacharalampous <spapacharalampous@cite.gr>
Date: Wed, 8 May 2024 11:42:38 +0300
Subject: [PATCH] added breadcrumbs on dmp listing and editor

---
 .../ui/dmp/listing/dmp-listing.component.html   | 11 ++++++++---
 .../ui/dmp/overview/dmp-overview.component.html | 17 +++++++++++++----
 .../navigation-breadcrumb.component.html        |  4 ++--
 3 files changed, 23 insertions(+), 9 deletions(-)

diff --git a/dmp-frontend/src/app/ui/dmp/listing/dmp-listing.component.html b/dmp-frontend/src/app/ui/dmp/listing/dmp-listing.component.html
index 2562f6634..7bb13e3c2 100644
--- a/dmp-frontend/src/app/ui/dmp/listing/dmp-listing.component.html
+++ b/dmp-frontend/src/app/ui/dmp/listing/dmp-listing.component.html
@@ -1,7 +1,7 @@
 <div class="main-content listing-main-container h-100">
 	<div class="container-fluid">
-		<div class="d-flex flex-direction-row">
-			<div *ngIf="hasListingItems && listingItems && listingItems.length === 0 && !hasLikeCriteria()" class="card mt-0">
+		<div class="row">
+			<div *ngIf="hasListingItems && listingItems && listingItems.length === 0 && !hasLikeCriteria()" class="col-12 card mt-0">
 				<div class="card-content info-text mb-0">
 					<p>{{'DMP-LISTING.TEXT-INFO' | translate}}</p>
 					<p class="mt-4 pt-2">{{'DMP-LISTING.TEXT-INFO-QUESTION' | translate}} <a class="zenodo-link" href="https://zenodo.org/communities/liber-dmp-cat/?page=1&size=20" target="_blank">{{'DMP-LISTING.LINK-ZENODO' | translate}}</a> {{'DMP-LISTING.GET-IDEA' | translate}}</p>
@@ -11,7 +11,12 @@
 					</div>
 				</div>
 			</div>
-			<p *ngIf="listingItems && listingItems.length > 0 || this.lookup.like" class="col-auto header-title">{{(isPublic ? 'GENERAL.TITLES.EXPLORE-PLANS' : 'GENERAL.TITLES.PLANS') | translate}}</p>
+			<div class="col-12">
+				<p *ngIf="listingItems && listingItems.length > 0 || this.lookup.like" class="col-auto header-title">{{(isPublic ? 'GENERAL.TITLES.EXPLORE-PLANS' : 'GENERAL.TITLES.PLANS') | translate}}</p>
+			</div>
+			<div class="col-12">
+				<app-navigation-breadcrumb />
+			</div>
 			<!-- TODO: implement filters -->
 			<!-- <div class="filter-btn" [style.right]="this.dialog.getDialogById('filters') ? '446px' : '0px'" [style.width]="scrollbar || this.dialog.getDialogById('filters') ? '57px' : '37px'" (click)="openFiltersDialog()">
 				<button mat-raised-button class="p-0">
diff --git a/dmp-frontend/src/app/ui/dmp/overview/dmp-overview.component.html b/dmp-frontend/src/app/ui/dmp/overview/dmp-overview.component.html
index b3404cd99..f20e4fe45 100644
--- a/dmp-frontend/src/app/ui/dmp/overview/dmp-overview.component.html
+++ b/dmp-frontend/src/app/ui/dmp/overview/dmp-overview.component.html
@@ -1,10 +1,19 @@
 <div class="main-content dmp-overview pl-5 pr-5">
 	<div class="container-fluid pl-0 pr-0">
 		<div *ngIf="dmp">
-			<a class="row mb-2 pl-1" (click)="goBack()" role="button">
-				<mat-icon class="back-icon pointer">chevron_left</mat-icon>
-				<p class="label-txt pointer">{{'DMP-OVERVIEW.ACTIONS.BACK' | translate}}</p>
-			</a>
+			<div class="row">
+				<div class="col-12 pl-2 mb-3">
+					<app-navigation-breadcrumb />
+				</div>
+			</div>
+			<div class="row">
+				<div class="col-12 mb-4 pl-1">
+					<a (click)="goBack()" role="button">
+						<mat-icon class="back-icon pointer">chevron_left</mat-icon>
+						<span class="label-txt pointer">{{'DMP-OVERVIEW.ACTIONS.BACK' | translate}}</span>
+					</a>
+				</div>
+			</div>
 			<div class="row">
 				<div class="col-12 col-lg-8 pl-2">
 					<div class="row">
diff --git a/dmp-frontend/src/app/ui/misc/breadcrumb/navigation-breadcrumb.component.html b/dmp-frontend/src/app/ui/misc/breadcrumb/navigation-breadcrumb.component.html
index 6ad691535..a08f55805 100644
--- a/dmp-frontend/src/app/ui/misc/breadcrumb/navigation-breadcrumb.component.html
+++ b/dmp-frontend/src/app/ui/misc/breadcrumb/navigation-breadcrumb.component.html
@@ -5,12 +5,12 @@
             
             <a *ngIf="(!item?.skipNavigation && !last) else regularText" [routerLink]="computePath(index)" class="text-black" disabled>
                 <ng-container *ngIf="item.title !== HOME_SYMBOL else homeIcon">
-                    {{ item.title | translate:item.translateParams }}
+                    {{ item.title | translate:item.translateParams | titlecase }}
                 </ng-container>
             </a>
             <ng-template #regularText>
                 <ng-container *ngIf="item.title !== HOME_SYMBOL else homeIcon">
-                    {{ item.title | translate:item.translateParams }}
+                    {{ item.title | translate:item.translateParams | titlecase }}
                 </ng-container>
             </ng-template>