Change the tags on the dmp editor to a multiple auto select, that allow to create tags or use existing ones

dmp-backend/elastic/src/main/java/eu/eudat/elastic/entities/Tag.java

@@ -13,6 +13,14 @@ public class Tag implements ElasticEntity {
     private String id;
     private String name;
 
+    public Tag() {
+    }
+
+    public Tag(String id, String name) {
+        this.id = id;
+        this.name = name;
+    }
+
     public String getId() {
         return id;
     }

dmp-backend/web/src/main/java/eu/eudat/logic/managers/DataManagementPlanManager.java

@@ -220,7 +220,11 @@ public class DataManagementPlanManager {
         datasetEnities.stream()
                       .filter(dataset -> !dataset.getStatus().equals(Dataset.Status.DELETED) && !dataset.getStatus().equals(Dataset.Status.CANCELED))
                       .forEach(dataset -> {
-                          dataManagementPlan.getDatasets().stream().filter(datasetWizardModel -> datasetWizardModel.getId().equals(dataset.getId())).forEach(datasetWizardModel -> datasetWizardModel.setDatasetProfileDefinition(datasetManager.getPagedProfile(datasetWizardModel, dataset)));
+                          dataManagementPlan.getDatasets().stream().filter(datasetWizardModel -> datasetWizardModel.getId().equals(dataset.getId())).forEach(datasetWizardModel -> {
+                              DatasetWizardModel wizardModel = datasetManager.getSingle(datasetWizardModel.getId().toString(), principal);
+                              datasetWizardModel.setDatasetProfileDefinition(wizardModel.getDatasetProfileDefinition());
+                              datasetWizardModel.setTags(wizardModel.getTags());
+                          });
                       });
         if (isPublic) {
             dataManagementPlan.setDatasets(dataManagementPlan.getDatasets().stream().filter(dataset -> dataset.getStatus() == Dataset.Status.FINALISED.getValue()).collect(Collectors.toList()));

dmp-backend/web/src/main/java/eu/eudat/logic/mapper/elastic/DatasetMapper.java

@@ -37,6 +37,9 @@ public class DatasetMapper {
 				tags.forEach(tag -> tag.setId(UUID.randomUUID().toString()));
 				elastic.setTags(tags);
 			} else {
+				if (tags1.size() < tags.size()) {
+					tags.stream().filter(tag -> tag.getId() == null || tag.getId().equals("")).forEach(tag -> tags1.add(new Tag(UUID.randomUUID().toString(), tag.getName())));
+				}
 				elastic.setTags(tags1);
 			}
 		}

dmp-frontend/src/app/ui/dataset/dataset-wizard/dataset-wizard-editor.model.ts

@@ -61,7 +61,7 @@ export class DatasetWizardEditorModel {
 			description: [{ value: this.description, disabled: disabled }, context.getValidation('description').validators],
 			dmp: [{ value: this.dmp, disabled: disabled }, context.getValidation('dmp').validators],
 			//externalDatasets: [{ value: this.externalDatasets, disabled: disabled }, context.getValidation('externalDatasets').validators],
-			// tags: [{ value: this.tags, disabled: disabled }, context.getValidation('tags').validators],
+			tags: [{ value: this.tags, disabled: disabled }, context.getValidation('tags').validators],
 			//registries: [{ value: this.registries, disabled: disabled }, context.getValidation('registries').validators],
 			//dataRepositories: [{ value: this.dataRepositories, disabled: disabled }, context.getValidation('dataRepositories').validators],
 			//services: [{ value: this.services, disabled: disabled }, context.getValidation('services').validators],
@@ -119,11 +119,11 @@ export class DatasetWizardEditorModel {
 		// }
 		formGroup.addControl('services', formBuilder.array(servicesFormArray));
 
-		const tagsFormArray = new Array<FormGroup>();
+		// const tagsFormArray = new Array<FormGroup>();
-		this.tags.forEach(item => {
+		// this.tags.forEach(item => {
-			tagsFormArray.push(item.buildForm(context.getValidation('tags').descendantValidations, disabled));
+		// 	tagsFormArray.push(item.buildForm(context.getValidation('tags').descendantValidations, disabled));
-		});
+		// });
-		formGroup.addControl('tags', formBuilder.array(tagsFormArray));
+		// formGroup.addControl('tags', formBuilder.array(tagsFormArray));
 
 		if (this.datasetProfileDefinition) { formGroup.addControl('datasetProfileDefinition', this.datasetProfileDefinition.buildForm()); }
 		// formGroup.addControl('profile', this.profile.buildForm());

dmp-frontend/src/app/ui/dataset/dataset-wizard/external-references/dataset-external-references-editor.component.html

@@ -6,34 +6,11 @@
 				<h4 class="col-auto heading">1.4 {{'DATASET-EDITOR.FIELDS.TAGS' | translate}}</h4>
 			</div>
 		</div>
-		<app-external-item-listing *ngIf="formGroup.get('tags') && tagsTemplate && externalSourcesConfiguration" [options]="externalSourcesConfiguration.tags" placeholder="{{'DATASET-EDITOR.FIELDS.TAGS' | translate}}" [parentTemplate]='tagsTemplate' [formArray]="formGroup.get('tags')" [autoCompleteConfiguration]="tagsAutoCompleteConfiguration" (onItemChange)="tagsOnItemChange($event)">
+		<div class="tags-form">
-		</app-external-item-listing>
-		<!-- <div class="tags-form">
 			<mat-form-field appearance="outline">
-				<mat-chip-list #chipList [disabled]="viewOnly">
+				<app-multiple-auto-complete [configuration]="tagsAutoCompleteConfiguration" [formControl]="formGroup.get('tags')" placeholder="{{'DATASET-EDITOR.FIELDS.TAGS' | translate}}"></app-multiple-auto-complete>
-					<mat-chip *ngFor="let tag of formGroup.get('tags').value" [removable]="true" (removed)="removeTag(tag)">
-						{{tag.name}}
-						<mat-icon matChipRemove *ngIf="!viewOnly">cancel</mat-icon>
-					</mat-chip>
-					<input matInput [disabled]="viewOnly" placeholder="{{'DATASET-EDITOR.FIELDS.TAGS' | translate}}" [matChipInputFor]="chipList" [matChipInputSeparatorKeyCodes]="separatorKeysCodes" [matChipInputAddOnBlur]="true" (matChipInputTokenEnd)="addTag($event)">
-				</mat-chip-list>
 			</mat-form-field>
-		</div> -->
+		</div>
-
-		<ng-template #tagsTemplate let-suggestion let-i="index" let-callback="function">
-			<div class="col-12 row align-items-center">
-				<div class="col">
-					<p>
-						{{i+1}}) {{suggestion.get('name').value}}
-					</p>
-				</div>
-				<div class="col-auto">
-					<button mat-icon-button (click)="callback(i)" *ngIf='!viewOnly'>
-						<mat-icon>close</mat-icon>
-					</button>
-				</div>
-			</div>
-		</ng-template>
 	</div>
 	<!-- Data Repositories -->
 	<div class="pt-2">

dmp-frontend/src/app/ui/dataset/dataset-wizard/external-references/dataset-external-references-editor.component.ts

@@ -21,7 +21,7 @@ import { DatasetExternalServiceDialogEditorComponent } from '@app/ui/dataset/dat
 import { BaseComponent } from '@common/base/base.component';
 import { TranslateService } from '@ngx-translate/core';
 import { Observable } from 'rxjs';
-import { takeUntil } from 'rxjs/operators';
+import { takeUntil, map } from 'rxjs/operators';
 import { ENTER, COMMA } from '@angular/cdk/keycodes';
 import { MatChipInputEvent } from '@angular/material/chips';
 import { isNullOrUndefined } from 'util';
@@ -29,6 +29,7 @@ import { ExternalDataRepositoryService } from '@app/core/services/external-sourc
 import { ExternalDatasetService } from '@app/core/services/external-sources/dataset/external-dataset.service';
 import { ExternalRegistryService } from '@app/core/services/external-sources/registry/external-registry.service';
 import { ExternalServiceService } from '@app/core/services/external-sources/service/external-service.service';
+import { MultipleAutoCompleteConfiguration } from '@app/library/auto-complete/multiple/multiple-auto-complete-configuration';
 
 @Component({
 	selector: 'app-dataset-external-references-editor-component',
@@ -41,6 +42,9 @@ export class DatasetExternalReferencesEditorComponent extends BaseComponent impl
 	@Input() viewOnly = false;
 	@Output() formChanged: EventEmitter<any> = new EventEmitter();
 
+	public filteringTagsAsync = false;
+	public filteredTags: ExternalSourceItemModel[];
+
 	readonly separatorKeysCodes: number[] = [ENTER, COMMA];
 
 	externalDatasetAutoCompleteConfiguration: SingleAutoCompleteConfiguration = {
@@ -75,12 +79,12 @@ export class DatasetExternalReferencesEditorComponent extends BaseComponent impl
 		subtitleFn: (item) => item.source ? this.language.instant('TYPES.EXTERNAL-DATASET-TYPE.SOURCE:') + item.source : this.language.instant('TYPES.EXTERNAL-DATASET-TYPE.NO-SOURCE')
 	};
 
-	tagsAutoCompleteConfiguration: SingleAutoCompleteConfiguration = {
+	tagsAutoCompleteConfiguration: MultipleAutoCompleteConfiguration = {
-		filterFn: this.searchDatasetTags.bind(this),
+		filterFn: this.filterTags.bind(this),
-		initialItems: (type) => this.searchDatasetTags('', type),
+		initialItems: (excludedItems: any[]) => this.filterTags('').pipe(map(result => result.filter(resultItem => (excludedItems || []).map(x => x.id).indexOf(resultItem.id) === -1))),
-		displayFn: (item) => item ? item.name : null,
+		displayFn: (item) => this.showTag(item),
-		titleFn: (item) => item ? item.name : null,
+		titleFn: (item) => item['name'],
-		subtitleFn: (item) => item.tag ? this.language.instant('TYPES.EXTERNAL-DATASET-TYPE.SOURCE:') + item.tag : this.language.instant('TYPES.EXTERNAL-DATASET-TYPE.NO-SOURCE')
+		valueAssign: (item) => this.addTag(item)
 	};
 
 	externalSourcesConfiguration: ExternalSourcesConfiguration;
@@ -257,11 +261,17 @@ export class DatasetExternalReferencesEditorComponent extends BaseComponent impl
 		(<FormArray>this.formGroup.get('tags')).removeAt(((<FormArray>this.formGroup.get('tags')).value as any[]).indexOf(tag));
 	}
 
-	addTag(ev: MatChipInputEvent) {
+	addTag(ev: any) {
-		if (ev.value !== '' && isNullOrUndefined(((<FormArray>this.formGroup.get('tags')).value as ExternalTagEditorModel[]).find(tag => tag.name === ev.value))) {
+		let item: ExternalTagEditorModel;
-			(<FormArray>this.formGroup.get('tags')).push(new ExternalTagEditorModel('', ev.value).buildForm());
+		//this.filteredTags = this.formGroup.get('tags').value;
+		if (typeof ev === 'string') {
+			item = new ExternalTagEditorModel('', ev);
+		} else {
+			item = ev;
+		}
+		if (item.name !== '' ) {
+			return item;
 		}
-		ev.input.value = '';
 	}
 
 	isInternal(element: any): boolean {
@@ -310,4 +320,22 @@ export class DatasetExternalReferencesEditorComponent extends BaseComponent impl
 				}
 			);
 	}
+
+	filterTags(value: string): Observable<ExternalSourceItemModel[]> {
+		this.filteringTagsAsync = true;
+
+		const requestItem: RequestItem<TagCriteria> = new RequestItem();
+		const criteria: TagCriteria = new TagCriteria();
+		criteria.like = value;
+		requestItem.criteria = criteria;
+		return this.externalSourcesService.searchDatasetTags(requestItem);
+	}
+
+	showTag(ev: any) {
+		if (typeof ev === 'string') {
+			return ev;
+		} else {
+			return ev.name;
+		}
+	}
 }