fix on breadcrumbs text

dmp-frontend/src/app/core/formatting.module.ts

@@ -11,6 +11,7 @@ import { DateTimeCultureFormatPipe } from './pipes/date-time-culture-format.pipe
 import {FieldValuePipe} from "@app/core/pipes/field-value.pipe";
 import {ColumnClassPipe} from "@app/core/pipes/column-class.pipe";
 import { PipeService } from '@common/formatting/pipe.service';
+import { AppTitleCaseFormatPipe } from '@common/formatting/pipes/app-title-case-format.pipe';
 
 //
 //
@@ -20,6 +21,7 @@ import { PipeService } from '@common/formatting/pipe.service';
 
 @NgModule({
 	declarations: [
+		AppTitleCaseFormatPipe,
 		NgForLimitPipe,
 		SumarizeTextPipe,
 		TimezoneInfoDisplayPipe,
@@ -31,6 +33,7 @@ import { PipeService } from '@common/formatting/pipe.service';
 		ColumnClassPipe,
 	],
 	exports: [
+		AppTitleCaseFormatPipe,
 		NgForLimitPipe,
 		SumarizeTextPipe,
 		TimezoneInfoDisplayPipe,
@@ -45,6 +48,7 @@ import { PipeService } from '@common/formatting/pipe.service';
 		EnumUtils,
 		DatePipe,
 		PipeService,
+		AppTitleCaseFormatPipe,
 		NgForLimitPipe,
 		SumarizeTextPipe,
 		TimezoneInfoDisplayPipe,

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

@@ -15,10 +15,10 @@
 					</div>
 				</div>
 			</div>
-			<div class="col-auto header-title">
-				<div class="row">
-					<div class="col-12">
-						<p *ngIf="listingItems && listingItems.length > 0 || this.lookup.like">{{(isPublic ? 'DESCRIPTION-LISTING.TITLE-EXPLORE' : 'DESCRIPTION-LISTING.TITLE') | translate}}</p>
+			<div class="col-auto">
+				<div *ngIf="listingItems && listingItems.length > 0 || this.lookup.like" class="row">
+					<div class="col-12 header-title">
+						<p >{{(isPublic ? 'DESCRIPTION-LISTING.TITLE-EXPLORE' : 'DESCRIPTION-LISTING.TITLE') | translate}}</p>
 					</div>
 					<div class="col-12">
 						<app-navigation-breadcrumb />

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

@@ -11,10 +11,10 @@
 					</div>
 				</div>
 			</div>
-			<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 *ngIf="listingItems && listingItems.length > 0 || this.lookup.like"  class="col-12">
+				<p class="col-auto header-title">{{(isPublic ? 'GENERAL.TITLES.EXPLORE-PLANS' : 'GENERAL.TITLES.PLANS') | translate}}</p>
 			</div>
-			<div class="col-12">
+			<div *ngIf="listingItems && listingItems.length > 0 || this.lookup.like" class="col-12">
 				<app-navigation-breadcrumb />
 			</div>
 			<!-- TODO: implement filters -->

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 | titlecase }}
+                    {{ item.title | translate:item.translateParams | appTitleCaseTransform }}
                 </ng-container>
             </a>
             <ng-template #regularText>
                 <ng-container *ngIf="item.title !== HOME_SYMBOL else homeIcon">
-                    {{ item.title | translate:item.translateParams | titlecase }}
+                    {{ item.title | translate:item.translateParams | appTitleCaseTransform }}
                 </ng-container>
             </ng-template>
 

dmp-frontend/src/common/formatting/pipes/app-title-case-format.pipe.ts

@@ -0,0 +1,15 @@
+import { Pipe, PipeTransform } from "@angular/core";
+
+
+@Pipe({
+  name: 'appTitleCaseTransform'
+})
+export class AppTitleCaseFormatPipe implements PipeTransform {
+
+  transform(value: any, ...args: any[]) {
+    let foo1 =  value.split('-');
+    let foo2 = foo1.map(element => element.charAt(0).toUpperCase() + element.slice(1))
+    let foo3 = foo2.join(' ');
+    return value.split('-').map(element => element.charAt(0).toUpperCase() + element.slice(1)).join(' ');
+  }
+} 

dmp-frontend/src/common/ui/common-ui.module.ts

@@ -1,5 +1,6 @@
 import { CommonModule } from '@angular/common';
 import { NgModule } from '@angular/core';
+import { FormattingModule } from '@app/core/formatting.module';
 import { NavigationBreadcrumbComponent } from '@app/ui/misc/breadcrumb/navigation-breadcrumb.component';
 import { SecureImagePipe } from '@common/http/image/secure-image.pipe';
 import { MaterialModule } from '@common/material/material.module';
@@ -10,6 +11,7 @@ import { TranslateModule } from '@ngx-translate/core';
 		CommonModule,
 		MaterialModule,
 		TranslateModule,
+		FormattingModule
 	],
 	declarations: [
 		SecureImagePipe,