Merge branch 'dmp-refactoring' of code-repo.d4science.org:MaDgiK-CITE/argos into dmp-refactoring

backend/core/src/main/java/org/opencdmp/service/description/DescriptionServiceImpl.java

@@ -460,7 +460,7 @@ public class DescriptionServiceImpl implements DescriptionService {
             DescriptionPersist.DescriptionPersistValidator validator = this.validatorFactory.validator(DescriptionPersist.DescriptionPersistValidator.class);
             validator.validate(this.buildDescriptionPersist(description));
             if (validator.result().isValid()) descriptionValidationResult.setResult(DescriptionValidationOutput.Valid);
-	        descriptionValidationResults.add(descriptionValidationResult);
+ 	        descriptionValidationResults.add(descriptionValidationResult);
 
         }
         return descriptionValidationResults;
@@ -1076,8 +1076,8 @@ public class DescriptionServiceImpl implements DescriptionService {
 
         if (FieldType.isTextType(fieldType)) persist.setTextValue(data.getTextValue());
         else if (FieldType.isTextListType(fieldType)) persist.setTextListValue(data.getTextListValue());
-        else if (FieldType.isDateType(fieldType))  persist.setDateValue(persist.getDateValue());
+        else if (FieldType.isDateType(fieldType))  persist.setDateValue(data.getDateValue());
-        else if (FieldType.isBooleanType(fieldType))  persist.setBooleanValue(persist.getBooleanValue());
+        else if (FieldType.isBooleanType(fieldType))  persist.setBooleanValue(data.getBooleanValue());
         else if (FieldType.isExternalIdentifierType(fieldType) && data.getExternalIdentifier() != null)  persist.setExternalIdentifier(this.buildExternalIdentifierPersist(data.getExternalIdentifier()));
         else if (FieldType.isReferenceType(fieldType) && fieldEntity != null ) {
             if (!this.conventionService.isListNullOrEmpty(data.getTextListValue()) && !this.conventionService.isListNullOrEmpty(references)){

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/core/services/prefilling-source/prefilling-source.service.ts

@@ -86,6 +86,17 @@ export class PrefillingSourceService {
 		titleFn: (item: PrefillingSource) => item.label,
 		valueAssign: (item: PrefillingSource) => item.id,
 	};
+	
+	public getSingleAutocompleteConfiguration(ids: Guid[]): SingleAutoCompleteConfiguration {
+		return {
+			initialItems: (data?: any) => this.query(this.buildAutocompleteLookup(null, null, ids && ids.length > 0 ? ids: null)).pipe(map(x => x.items)),
+			filterFn: (searchQuery: string, data?: any) => this.query(this.buildAutocompleteLookup(searchQuery, null, ids && ids.length > 0 ? ids: null)).pipe(map(x => x.items)),
+			getSelectedItem: (selectedItem: any) => this.query(this.buildAutocompleteLookup(null, null, [selectedItem])).pipe(map(x => x.items[0])),
+			displayFn: (item: PrefillingSource) => item.label,
+			titleFn: (item: PrefillingSource) => item.label,
+			valueAssign: (item: PrefillingSource) => item.id,
+		}
+	}
 
 	public multipleAutocompleteConfiguration: MultipleAutoCompleteConfiguration = {
 		initialItems: (excludedItems: any[], data?: any) => this.query(this.buildAutocompleteLookup(null, excludedItems ? excludedItems : null)).pipe(map(x => x.items)),
@@ -96,6 +107,17 @@ export class PrefillingSourceService {
 		valueAssign: (item: PrefillingSource) => item.id,
 	};
 
+	public getMltipleAutocompleteConfiguration(ids: Guid[]): MultipleAutoCompleteConfiguration {
+		return {
+			initialItems: (excludedItems: any[], data?: any) => this.query(this.buildAutocompleteLookup(null, excludedItems ? excludedItems : null, ids && ids.length > 0 ? ids: null)).pipe(map(x => x.items)),
+			filterFn: (searchQuery: string, excludedItems: any[]) => this.query(this.buildAutocompleteLookup(searchQuery, excludedItems, ids && ids.length > 0 ? ids: null)).pipe(map(x => x.items)),
+			getSelectedItems: (selectedItems: any[]) => this.query(this.buildAutocompleteLookup(null, null, selectedItems)).pipe(map(x => x.items)),
+			displayFn: (item: PrefillingSource) => item.label,
+			titleFn: (item: PrefillingSource) => item.label,
+			valueAssign: (item: PrefillingSource) => item.id,
+		}
+	}
+
 	private buildAutocompleteLookup(like?: string, excludedIds?: Guid[], ids?: Guid[]): PrefillingSourceLookup {
 		const lookup: PrefillingSourceLookup = new PrefillingSourceLookup();
 		lookup.page = { size: 100, offset: 0 };

dmp-frontend/src/app/ui/admin/description-template/description-template.routing.ts

@@ -33,7 +33,9 @@ const routes: Routes = [
 			},
 			...BreadcrumbService.generateRouteDataConfiguration({
 				title: 'BREADCRUMBS.NEW-DESCRIPTION-TEMPLATES'
-			})
+			}),
+			getFromTitleService: true,
+			usePrefix: false
 		}
 	},
 	{
@@ -51,6 +53,8 @@ const routes: Routes = [
 			authContext: {
 				permissions: [AppPermission.EditDescriptionTemplate]
 			},
+			getFromTitleService: true,
+			usePrefix: false,
 			action: 'clone'
 		}
 	},
@@ -69,6 +73,8 @@ const routes: Routes = [
 			authContext: {
 				permissions: [AppPermission.EditDescriptionTemplate]
 			},
+			getFromTitleService: true,
+			usePrefix: false,
 			action: 'new-version'
 		}
 	},
@@ -86,7 +92,9 @@ const routes: Routes = [
 			}),
 			authContext: {
 				permissions: [AppPermission.EditDescriptionTemplate]
-			}
+			},
+			getFromTitleService: true,
+			usePrefix: false
 		}
 
 	},

dmp-frontend/src/app/ui/admin/description-template/editor/description-template-editor.component.ts

@@ -42,6 +42,7 @@ import { NewEntryType, ToCEntry, ToCEntryType } from './table-of-contents/descri
 import { ConfigurationService } from '@app/core/services/configuration/configuration.service';
 import { LockService } from '@app/core/services/lock/lock.service';
 import { LockTargetType } from '@app/core/common/enum/lock-target-type';
+import { Title } from '@angular/platform-browser';
 
 
 @Component({
@@ -121,8 +122,15 @@ export class DescriptionTemplateEditorComponent extends BaseEditor<DescriptionTe
 		private fileUtils: FileUtils,
 		private matomoService: MatomoService,
 		private languageInfoService: LanguageInfoService,
-		public userService: UserService
+		public userService: UserService,
+		public titleService: Title
 	) {
+		const descriptionLabel:string = route.snapshot.data['entity']?.label;
+		if (descriptionLabel) {
+			titleService.setTitle(descriptionLabel);
+		} else {
+			titleService.setTitle('DESCRIPTION-TEMPLATE-EDITOR.TITLE-EDIT-DESCRIPTION-TEMPLATE');
+		}
 		super(dialog, language, formService, router, uiNotificationService, httpErrorHandlingService, filterService, datePipe, route, queryParamsService, lockService, authService, configurationService);
 	}
 

dmp-frontend/src/app/ui/admin/dmp-blueprint/dmp-blueprint.routing.ts

@@ -33,7 +33,9 @@ const routes: Routes = [
 			},
 			...BreadcrumbService.generateRouteDataConfiguration({
 				title: 'BREADCRUMBS.NEW-DMP-BLUEPRINT'
-			})
+			}),
+			getFromTitleService: true,
+			usePrefix: false
 		}
 	},
 	{
@@ -51,6 +53,8 @@ const routes: Routes = [
 			authContext: {
 				permissions: [AppPermission.EditDmpBlueprint]
 			},
+			getFromTitleService: true,
+			usePrefix: false,
 			action: 'clone'
 		}
 	},
@@ -69,6 +73,8 @@ const routes: Routes = [
 			authContext: {
 				permissions: [AppPermission.EditDmpBlueprint]
 			},
+			getFromTitleService: true,
+			usePrefix: false,
 			action: 'new-version'
 		}
 	},
@@ -86,7 +92,9 @@ const routes: Routes = [
 			}),
 			authContext: {
 				permissions: [AppPermission.EditDmpBlueprint]
-			}
+			},
+			getFromTitleService: true,
+			usePrefix: false
 		}
 
 	},

dmp-frontend/src/app/ui/admin/dmp-blueprint/editor/dmp-blueprint-editor.component.ts

@@ -46,6 +46,7 @@ import { DmpBlueprintEditorModel, FieldInSectionEditorModel } from './dmp-bluepr
 import { DmpBlueprintEditorResolver } from './dmp-blueprint-editor.resolver';
 import { DmpBlueprintEditorService } from './dmp-blueprint-editor.service';
 import { DmpBlueprintVersionStatus } from '@app/core/common/enum/dmp-blueprint-version-status';
+import { Title } from '@angular/platform-browser';
 
 
 @Component({
@@ -134,8 +135,15 @@ export class DmpBlueprintEditorComponent extends BaseEditor<DmpBlueprintEditorMo
 		public descriptionTemplateService: DescriptionTemplateService,
 		public referenceTypeService: ReferenceTypeService,
 		public semanticsService: SemanticsService,
-		public prefillingSourceService: PrefillingSourceService
+		public prefillingSourceService: PrefillingSourceService,
+		public titleService: Title
 	) {
+		const descriptionLabel:string = route.snapshot.data['entity']?.label;
+		if (descriptionLabel) {
+			titleService.setTitle(descriptionLabel);
+		} else {
+			titleService.setTitle('DMP-BLUEPRINT-EDITOR.TITLE-EDIT-BLUEPRINT');
+		}
 		super(dialog, language, formService, router, uiNotificationService, httpErrorHandlingService, filterService, datePipe, route, queryParamsService, lockService, authService, configurationService);
 	}
 

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

@@ -86,10 +86,13 @@
 						</div>
 						<div class="col-auto dmp-label ml-1">{{'DESCRIPTION-EDITOR.DMP' | translate}}</div>
 					</div>
-					<div class="row stepper-title"> <div class="col-auto"><span>{{'DESCRIPTION-EDITOR.TOC.TITLE' | translate}}</span></div></div>
+					<div class="row stepper-title">
+						<div class="col-12 pl-0 mb-1"><span>{{'DESCRIPTION-EDITOR.TOC.TITLE' | translate}}</span></div>
+						<div class="col-12 pl-0"><app-navigation-breadcrumb /></div>
+					</div>
 					<div class="row stepper-options" id="stepper-options">
 						<div class="col-12">
-							<div class="container stepper-list">
+							<div class="container stepper-list ml-1">
 								<div class="row" *ngIf="!descriptionInfoValid()">
 									<div (click)="table0fContents.onToCentrySelected()" class="col-12 main-info" [ngClass]="{'active': this.step === 0, 'text-danger': countErrorsOfBaseInfoPage > 0}">{{'DESCRIPTION-EDITOR.TOC.MAIN-INFO' | translate}} <span *ngIf="countErrorsOfBaseInfoPage > 0">({{ countErrorsOfBaseInfoPage }})</span></div>
 								</div>

dmp-frontend/src/app/ui/description/editor/description-editor.model.ts

@@ -714,10 +714,10 @@ export class DescriptionFieldIndicator {
 
 		switch (type) {
 			case DescriptionTemplateFieldType.FREE_TEXT:
-			case DescriptionTemplateFieldType.BOOLEAN_DECISION:
 			case DescriptionTemplateFieldType.TEXT_AREA:
 			case DescriptionTemplateFieldType.UPLOAD:
 			case DescriptionTemplateFieldType.RICH_TEXT_AREA:
+			case DescriptionTemplateFieldType.RADIO_BOX:
 				this.type = "textValue";
 				break;
 			case DescriptionTemplateFieldType.DATASET_IDENTIFIER:
@@ -728,7 +728,7 @@ export class DescriptionFieldIndicator {
 				this.type = "dateValue";
 				break;
 			case DescriptionTemplateFieldType.CHECK_BOX:
-			case DescriptionTemplateFieldType.RADIO_BOX:
+			case DescriptionTemplateFieldType.BOOLEAN_DECISION:
 				this.type = "booleanValue";
 				break;
 			case DescriptionTemplateFieldType.INTERNAL_ENTRIES_DESCRIPTIONS:

dmp-frontend/src/app/ui/description/editor/description-editor.resolver.ts

@@ -6,6 +6,7 @@ import { DescriptionTemplate, DescriptionTemplateBaseFieldData, DescriptionTempl
 import { Description, DescriptionExternalIdentifier, DescriptionField, DescriptionPropertyDefinition, DescriptionPropertyDefinitionFieldSet, DescriptionPropertyDefinitionFieldSetItem, DescriptionReference, DescriptionReferenceData, DescriptionTag } from '@app/core/model/description/description';
 import { DescriptionTemplatesInSection, DmpBlueprint, DmpBlueprintDefinition, DmpBlueprintDefinitionSection } from '@app/core/model/dmp-blueprint/dmp-blueprint';
 import { Dmp, DmpDescriptionTemplate } from '@app/core/model/dmp/dmp';
+import { PrefillingSource } from '@app/core/model/prefilling-source/prefilling-source';
 import { ReferenceType } from '@app/core/model/reference-type/reference-type';
 import { Reference } from '@app/core/model/reference/reference';
 import { Tag } from '@app/core/model/tag/tag';
@@ -127,6 +128,7 @@ export class DescriptionEditorResolver extends BaseEditorResolver {
 			// (prefix ? prefix + '.' : '') + [nameof<Dmp>(x => x.blueprint), nameof<DmpBlueprint>(x => x.definition), nameof<DmpBlueprintDefinition>(x => x.sections), nameof<DmpBlueprintDefinitionSection>(x => x.descriptionTemplates), nameof<DescriptionTemplatesInSection>(x => x.label)].join('.'),
 			// (prefix ? prefix + '.' : '') + [nameof<Dmp>(x => x.blueprint), nameof<DmpBlueprint>(x => x.definition), nameof<DmpBlueprintDefinition>(x => x.sections), nameof<DmpBlueprintDefinitionSection>(x => x.descriptionTemplates), nameof<DescriptionTemplatesInSection>(x => x.minMultiplicity)].join('.'),
 			(prefix ? prefix + '.' : '') + [nameof<Dmp>(x => x.blueprint), nameof<DmpBlueprint>(x => x.definition), nameof<DmpBlueprintDefinition>(x => x.sections), nameof<DmpBlueprintDefinitionSection>(x => x.descriptionTemplates), nameof<DescriptionTemplatesInSection>(x => x.maxMultiplicity)].join('.'),
+			(prefix ? prefix + '.' : '') + [nameof<Dmp>(x => x.blueprint), nameof<DmpBlueprint>(x => x.definition), nameof<DmpBlueprintDefinition>(x => x.sections), nameof<DmpBlueprintDefinitionSection>(x => x.prefillingSources), nameof<PrefillingSource>(x => x.id)].join('.'),
 
 			(prefix ? prefix + '.' : '') + [nameof<Dmp>(x => x.dmpDescriptionTemplates), nameof<DmpDescriptionTemplate>(x => x.id)].join('.'),
 			(prefix ? prefix + '.' : '') + [nameof<Dmp>(x => x.dmpDescriptionTemplates), nameof<DmpDescriptionTemplate>(x => x.sectionId)].join('.'),

dmp-frontend/src/app/ui/description/editor/description-editor.routing.ts

@@ -19,8 +19,9 @@ const routes: Routes = [
 			'entity': DescriptionEditorResolver
 		},
 		data: {
+			breadcrumbs: true,
 			...BreadcrumbService.generateRouteDataConfiguration({
-				title: 'BREADCRUMBS.EDIT-DESCRIPTION'
+				hideNavigationItem: true
 			}),
 			getFromTitleService: true,
 			usePrefix: false
@@ -40,10 +41,11 @@ const routes: Routes = [
 			'entity': DescriptionEditorResolver
 		},
 		data: {
+			breadcrumbs: true,
 			...BreadcrumbService.generateRouteDataConfiguration({
-				title: 'BREADCRUMBS.EDIT-DESCRIPTION'
+				hideNavigationItem: true
 			}),
-			title: 'DESCRIPTION-EDITOR.TITLE-EDIT-DESCRIPTION'
+			title: 'DESCRIPTION-EDITOR.TITLE-EDIT-DESCRIPTION',
 			// ,
 			// authContext: {
 			// 	permissions: [AppPermission.EditDescription]
@@ -59,10 +61,13 @@ const routes: Routes = [
 			'entity': DescriptionEditorResolver
 		},
 		data: {
+			breadcrumbs: true,
 			...BreadcrumbService.generateRouteDataConfiguration({
-				title: 'BREADCRUMBS.EDIT-DESCRIPTION'
+				hideNavigationItem: true
 			}),
-			title: 'DESCRIPTION-EDITOR.TITLE-NEW'
+			title: 'DESCRIPTION-EDITOR.TITLE-NEW',
+			getFromTitleService: true,
+			usePrefix: false
 			// ,
 			// authContext: {
 			// 	permissions: [AppPermission.EditDescription]
@@ -78,10 +83,13 @@ const routes: Routes = [
 			'entity': DescriptionEditorResolver
 		},
 		data: {
+			breadcrumbs: true,
 			...BreadcrumbService.generateRouteDataConfiguration({
-				title: 'BREADCRUMBS.EDIT-DESCRIPTION'
+				hideNavigationItem: true
 			}),
-			title: 'DESCRIPTION-EDITOR.TITLE-NEW'
+			title: 'DESCRIPTION-EDITOR.TITLE-NEW',
+			getFromTitleService: true,
+			usePrefix: false
 			// ,
 			// authContext: {
 			// 	permissions: [AppPermission.EditDescription]

dmp-frontend/src/app/ui/description/editor/prefill-description/prefill-description.component.html

@@ -41,7 +41,7 @@
 			<mat-form-field class="col-md-12">
 				<app-single-auto-complete [required]="true" [formControl]="prefillForm.get('prefillingSourceId')"
 											placeholder="{{'PREFILL-DESCRIPTION-DIALOG.PREFILLING-SOURCE' | translate}}"
-										  	[configuration]="prefillingSourceService.singleAutocompleteConfiguration" (optionSelected)="changePreffillingSource($event)">
+										  	[configuration]="singlePrefillingSourceAutoCompleteConfiguration" (optionSelected)="changePreffillingSource($event)">
 				</app-single-auto-complete>
 				<mat-error *ngIf="prefillForm.get('prefillingSourceId').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
 			</mat-form-field>
@@ -53,7 +53,7 @@
 			<mat-form-field class="col-md-12">
 				<app-single-auto-complete [required]="true" [formControl]="prefillForm.get('data')"
 										  placeholder="{{'PREFILL-DESCRIPTION-DIALOG.SEARCH' | translate}}"
-										  [configuration]="prefillAutoCompleteConfiguration">
+										  [configuration]="prefillObjectAutoCompleteConfiguration">
 				</app-single-auto-complete>
 			</mat-form-field>
 		</div>

dmp-frontend/src/app/ui/description/editor/prefill-description/prefill-description.component.ts

@@ -28,7 +28,8 @@ import { DescriptionPrefillingRequestEditorModel } from "./prefill-description-e
 export class PrefillDescriptionDialogComponent extends BaseComponent implements OnInit {
 
 	progressIndication = false;
-	prefillAutoCompleteConfiguration: SingleAutoCompleteConfiguration;
+	singlePrefillingSourceAutoCompleteConfiguration: SingleAutoCompleteConfiguration;
+	prefillObjectAutoCompleteConfiguration: SingleAutoCompleteConfiguration;
 	prefillSelected: boolean = false;
 	prefillForm: UntypedFormGroup;
 
@@ -49,13 +50,16 @@ export class PrefillDescriptionDialogComponent extends BaseComponent implements
 	}
 
 	ngOnInit() {
+		const availablePrefillingSourcesIds = this.dmp.blueprint.definition.sections.filter(x => x.id === this.dmpSectionId)[0].prefillingSources?.map(x => x.id) || null;
+		this.singlePrefillingSourceAutoCompleteConfiguration = this.prefillingSourceService.getSingleAutocompleteConfiguration(availablePrefillingSourcesIds);
+
 		this.progressIndicationService.getProgressIndicationObservable().pipe(takeUntil(this._destroyed)).subscribe(x => {
 			setTimeout(() => { this.progressIndication = x; });
 		});
 		const editorModel = new DescriptionPrefillingRequestEditorModel();
 		this.prefillForm = editorModel.buildForm(null, false);
 
-		this.prefillAutoCompleteConfiguration = {
+		this.prefillObjectAutoCompleteConfiguration = {
 			filterFn: this.searchDescriptions.bind(this),
 			loadDataOnStart: false,
 			displayFn: (item: Prefilling) => (item.label.length > 60) ? (item.label.substr(0, 60) + "...") : item.label,

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

@@ -15,7 +15,16 @@
 					</div>
 				</div>
 			</div>
-			<p *ngIf="listingItems && listingItems.length > 0 || this.lookup.like" class="col-auto header-title">{{(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 />
+					</div>
+				</div>
+			</div>
 			<div *ngIf="listingItems && listingItems.length > 0 && !isPublic || this.lookup.like" class="ml-auto">
 				<div class="col-auto">
 					<button mat-raised-button class="add-description align-self-center yellow-btn" (click)="addNewDescription()">

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

@@ -1,10 +1,17 @@
 <div class="main-content pl-5 pr-5">
 	<div class="container-fluid pl-0 pr-0">
 		<div *ngIf="description">
-			<a class="row mb-2 pl-1" (click)="goBack()" role="button">
+			<div class="row">
-				<mat-icon class="back-icon pointer">chevron_left</mat-icon>
+				<div class="col-12 pl-2 mb-3">
-				<p class="label-txt pointer">{{'DESCRIPTION-OVERVIEW.ACTIONS.BACK' | translate}}</p>
+					<app-navigation-breadcrumb />
-			</a>
+				</div>
+				<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">{{'DESCRIPTION-OVERVIEW.ACTIONS.BACK' | translate}}</span>
+					</a>
+				</div>
+			</div>
 			<div class="row">
 				<div class="col-12 col-lg-8 pl-2">
 					<div class="row">

dmp-frontend/src/app/ui/description/overview/description-overview.routing.ts

@@ -1,6 +1,7 @@
 import { NgModule } from '@angular/core';
 import { RouterModule, Routes } from '@angular/router';
 import { DescriptionOverviewComponent } from './description-overview.component';
+import { BreadcrumbService } from '@app/ui/misc/breadcrumb/breadcrumb.service';
 
 const routes: Routes = [
 	{
@@ -8,6 +9,9 @@ const routes: Routes = [
 		component: DescriptionOverviewComponent,
 		data: {
 			breadcrumb: true,
+			...BreadcrumbService.generateRouteDataConfiguration({
+				hideNavigationItem: true
+			}),
 			title: 'GENERAL.TITLES.DATASET-OVERVIEW'
 		},
 	},
@@ -16,6 +20,9 @@ const routes: Routes = [
 		component: DescriptionOverviewComponent,
 		data: {
 			breadcrumb: true,
+			...BreadcrumbService.generateRouteDataConfiguration({
+				hideNavigationItem: true
+			}),
 			title: 'GENERAL.TITLES.DATASET-OVERVIEW'
 		},
 	}

dmp-frontend/src/app/ui/dmp/dmp-editor-blueprint/dmp-editor.component.html

@@ -33,6 +33,11 @@
 			<!-- First Step -->
 			<div class="row" id="editor-form" *ngIf="this.step === 0 && this.isNew">
 				<div class="col-12 blueprint-section">
+					<div class="row stepper-title m-0 p-0">
+						<div class="col-12">
+							<app-navigation-breadcrumb />
+						</div>
+					</div>
 					<div class="row">
 						<div class="heading2 col-12">{{'DMP-EDITOR.FIELDS.TITLE' | translate}} *</div>
 						<div class="col-12">
@@ -81,8 +86,11 @@
 				<!-- <div class="col-auto dmp-stepper" *ngIf="this.step != 0"> -->
 				<div class="col-12 col-md-3 pr-md-0" *ngIf="this.step != 0">
 					<div class="row stepper-title">
+						<div class="col-12 pl-0 mb-1">
+							<span class="font-weight-bold">{{'DMP-EDITOR.TITLE' | translate}}</span>
+						</div>
 						<div class="col-12 pl-0">
-							<span>{{'DMP-EDITOR.TITLE' | translate}}</span>
+							<app-navigation-breadcrumb />
 						</div>
 					</div>
 					<div class="row stepper-options">

dmp-frontend/src/app/ui/dmp/dmp-editor-blueprint/dmp-editor.routing.ts

@@ -16,8 +16,9 @@ const routes: Routes = [
 		canActivate: [AuthGuard],
 		canDeactivate: [PendingChangesGuard],
 		data: {
+			breadcrumb: true,
 			...BreadcrumbService.generateRouteDataConfiguration({
-				title: 'BREADCRUMBS.NEW-DMP'
+				hideNavigationItem: true
 			}),
 			authContext: {
 				permissions: [AppPermission.NewDmp]
@@ -33,8 +34,9 @@ const routes: Routes = [
 			'entity': DmpEditorResolver
 		},
 		data: {
+			breadcrumb: true,
 			...BreadcrumbService.generateRouteDataConfiguration({
-				title: 'BREADCRUMBS.EDIT-DMP'
+				hideNavigationItem: true
 			}),
 			getFromTitleService: true,
 			usePrefix: false

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 class="row">
-			<div *ngIf="hasListingItems && listingItems && listingItems.length === 0 && !hasLikeCriteria()" class="card mt-0">
+			<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 *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 *ngIf="listingItems && listingItems.length > 0 || this.lookup.like" 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">

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

@@ -1,10 +1,17 @@
 <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">
+			<div class="row">
-				<mat-icon class="back-icon pointer">chevron_left</mat-icon>
+				<div class="col-12 pl-2 mb-3">
-				<p class="label-txt pointer">{{'DMP-OVERVIEW.ACTIONS.BACK' | translate}}</p>
+					<app-navigation-breadcrumb />
-			</a>
+				</div>
+				<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">

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

@@ -1,6 +1,7 @@
 import { NgModule } from '@angular/core';
 import { RouterModule, Routes } from '@angular/router';
 import { DmpOverviewComponent } from './dmp-overview.component';
+import { BreadcrumbService } from '@app/ui/misc/breadcrumb/breadcrumb.service';
 
 const routes: Routes = [
 	{
@@ -8,6 +9,9 @@ const routes: Routes = [
 		component: DmpOverviewComponent,
 		data: {
 			breadcrumb: true,
+			...BreadcrumbService.generateRouteDataConfiguration({
+				hideNavigationItem: true
+			}),
 			title: 'GENERAL.TITLES.PLAN-OVERVIEW'
 		},
 	},
@@ -16,6 +20,9 @@ const routes: Routes = [
 		component: DmpOverviewComponent,
 		data: {
 			breadcrumb: true,
+			...BreadcrumbService.generateRouteDataConfiguration({
+				hideNavigationItem: true
+			}),
 			title: 'GENERAL.TITLES.PLAN-OVERVIEW'
 		},
 	}

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 | appTitleCaseTransform }}
                 </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 | appTitleCaseTransform }}
                 </ng-container>
             </ng-template>
 

dmp-frontend/src/assets/i18n/en.json

@@ -169,6 +169,7 @@
 		"EDIT-DESCRIPTION-TEMPLATE-TYPE": "Edit",
 		"DMP-BLUEPRINTS": "Plan Blueprints",
 		"NEW-DMP-BLUEPRINT": "New",
+		"EDIT-DMP": "Edit",
 		"EDIT-DMP-BLUEPRINT": "Edit",
 		"NEW-DESCRIPTION-TEMPLATES": "New",
 		"EDIT-DESCRIPTION-TEMPLATES": "Edit",
@@ -367,6 +368,7 @@
 			"NEW-PROFILE-VERSION": "New Version Of ",
 			"NEW-PROFILE-CLONE": "New Clone Of "
 		},
+		"TITLE-EDIT-DESCRIPTION-TEMPLATE": "Edit Description Template",
 		"FIELDS": {
 			"DATASET-TITLE": "Description Template Name",
 			"DATASET-DESCRIPTION": "Description"
@@ -1412,6 +1414,7 @@
 			"CLONE": "Clone Plan Blueprint",
 			"NEW-VERSION": "Create New Version of Plan Blueprint"
 		},
+		"TITLE-EDIT-BLUEPRINT": "Editing Blueprint",
 		"SECTIONS-REQUIRED": "Required",
 		"FIELDS-REQUIRED": "Required",
 		"SYSTEM-FIELDS-REQUIRED": "Title, Description, Language and  Access are required",

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,