From 941cca810329e53ddcb4a4b96c1927fcc813d387 Mon Sep 17 00:00:00 2001
From: "konstantina.galouni" <kgalouni@di.uoa.gr>
Date: Fri, 10 Jun 2022 17:00:36 +0300
Subject: [PATCH] form-section-inner.component.html &
 form-section.component.html: Updated comment field to use <rich-text-editor>
 instead of <input> and <mat-hint>.

---
 .../form-section-inner.component.html         | 12 ++++++----
 .../form-section/form-section.component.html  | 24 ++++++++++++-------
 2 files changed, 24 insertions(+), 12 deletions(-)

diff --git a/dmp-frontend/src/app/ui/misc/dataset-description-form/components/form-section/form-section-inner/form-section-inner.component.html b/dmp-frontend/src/app/ui/misc/dataset-description-form/components/form-section/form-section-inner/form-section-inner.component.html
index d8ee36071..2d8594873 100644
--- a/dmp-frontend/src/app/ui/misc/dataset-description-form/components/form-section/form-section-inner/form-section-inner.component.html
+++ b/dmp-frontend/src/app/ui/misc/dataset-description-form/components/form-section/form-section-inner/form-section-inner.component.html
@@ -28,10 +28,14 @@
 							<span class="mt-1" *ngIf="!compositeFieldFormGroup.get('multiplicity').value.placeholder">{{'DATASET-PROFILE-EDITOR.STEPS.FORM.COMPOSITE-FIELD.FIELDS.MULTIPLICITY-ADD-ONE-FIELD' | translate}}</span>
 						</span>
 					</div>
-					<mat-form-field *ngIf="compositeFieldFormGroup.get('hasCommentField').value" class="col-12 mb-2" [formGroup]="compositeFieldFormGroup">
-						<input matInput formControlName="commentFieldValue" placeholder="{{'DATASET-PROFILE-EDITOR.STEPS.FORM.COMPOSITE-FIELD.FIELDS.COMMENT-PLACEHOLDER' | translate}}">
-						<mat-hint>{{'DATASET-PROFILE-EDITOR.STEPS.FORM.COMPOSITE-FIELD.FIELDS.COMMENT-HINT' | translate}}</mat-hint>
-					</mat-form-field>
+					<ng-container *ngIf="compositeFieldFormGroup.get('hasCommentField').value" class="">
+<!--						<input matInput formControlName="commentFieldValue" placeholder="{{'DATASET-PROFILE-EDITOR.STEPS.FORM.COMPOSITE-FIELD.FIELDS.COMMENT-PLACEHOLDER' | translate}}">-->
+						<rich-text-editor-component [parentFormGroup]="compositeFieldFormGroup" [controlName]="'commentFieldValue'"
+													[id]="'editor1'" [placeholder]="'DATASET-PROFILE-EDITOR.STEPS.FORM.COMPOSITE-FIELD.FIELDS.COMMENT-PLACEHOLDER' | translate"
+													[wrapperClasses]="'col-12 mb-2'">
+						</rich-text-editor-component>
+<!--						<mat-hint>{{'DATASET-PROFILE-EDITOR.STEPS.FORM.COMPOSITE-FIELD.FIELDS.COMMENT-HINT' | translate}}</mat-hint>-->
+					</ng-container>
 					<!-- <div class="col"></div>
 					<button class="col-auto" mat-icon-button type="button" (click)="next(compositeField)">
 						<mat-icon>expand_more</mat-icon>
diff --git a/dmp-frontend/src/app/ui/misc/dataset-description-form/components/form-section/form-section.component.html b/dmp-frontend/src/app/ui/misc/dataset-description-form/components/form-section/form-section.component.html
index 38b422f0b..9a15c0141 100644
--- a/dmp-frontend/src/app/ui/misc/dataset-description-form/components/form-section/form-section.component.html
+++ b/dmp-frontend/src/app/ui/misc/dataset-description-form/components/form-section/form-section.component.html
@@ -40,10 +40,14 @@
 									<span class="mt-1" *ngIf="!compositeFieldFormGroup.get('multiplicity').value.placeholder">{{'DATASET-PROFILE-EDITOR.STEPS.FORM.COMPOSITE-FIELD.FIELDS.MULTIPLICITY-ADD-ONE-FIELD' | translate}}</span>
 								</span>
 							</div>
-							<mat-form-field *ngIf="compositeFieldFormGroup.get('hasCommentField').value" class="col-12 mb-2" [formGroup]="compositeFieldFormGroup">
-								<input matInput formControlName="commentFieldValue" placeholder="{{'DATASET-PROFILE-EDITOR.STEPS.FORM.COMPOSITE-FIELD.FIELDS.COMMENT-PLACEHOLDER' | translate}}">
-								<mat-hint>{{'DATASET-PROFILE-EDITOR.STEPS.FORM.COMPOSITE-FIELD.FIELDS.COMMENT-HINT' | translate}}</mat-hint>
-							</mat-form-field>
+							<ng-container *ngIf="compositeFieldFormGroup.get('hasCommentField').value" class="">
+<!--								<input matInput formControlName="commentFieldValue" placeholder="{{'DATASET-PROFILE-EDITOR.STEPS.FORM.COMPOSITE-FIELD.FIELDS.COMMENT-PLACEHOLDER' | translate}}">-->
+								<rich-text-editor-component [parentFormGroup]="compositeFieldFormGroup" [controlName]="'commentFieldValue'"
+															[id]="'editor1'" [placeholder]="'DATASET-PROFILE-EDITOR.STEPS.FORM.COMPOSITE-FIELD.FIELDS.COMMENT-PLACEHOLDER' | translate"
+															[wrapperClasses]="'col-12 mb-2'">
+								</rich-text-editor-component>
+<!--								<mat-hint>{{'DATASET-PROFILE-EDITOR.STEPS.FORM.COMPOSITE-FIELD.FIELDS.COMMENT-HINT' | translate}}</mat-hint>-->
+							</ng-container>
 							<!-- <div class="col"></div>
 							<button class="col-auto" mat-icon-button type="button" (click)="next(compositeField)">
 								<mat-icon>expand_more</mat-icon>
@@ -109,10 +113,14 @@
 									<span class="mt-1" *ngIf="!fieldsetEntry.form.get('multiplicity').value.placeholder">{{'DATASET-PROFILE-EDITOR.STEPS.FORM.COMPOSITE-FIELD.FIELDS.MULTIPLICITY-ADD-ONE-FIELD' | translate}}</span>
 								</span>
 							</div>
-							<mat-form-field *ngIf="fieldsetEntry.form.get('hasCommentField').value" class="col-12 mb-2" [formGroup]="fieldsetEntry.form">
-								<input matInput formControlName="commentFieldValue" placeholder="{{'DATASET-PROFILE-EDITOR.STEPS.FORM.COMPOSITE-FIELD.FIELDS.COMMENT-PLACEHOLDER' | translate}}">
-								<mat-hint>{{'DATASET-PROFILE-EDITOR.STEPS.FORM.COMPOSITE-FIELD.FIELDS.COMMENT-HINT' | translate}}</mat-hint>
-							</mat-form-field>
+							<ng-container *ngIf="fieldsetEntry.form.get('hasCommentField').value" class="">
+<!--								<input matInput formControlName="commentFieldValue" placeholder="{{'DATASET-PROFILE-EDITOR.STEPS.FORM.COMPOSITE-FIELD.FIELDS.COMMENT-PLACEHOLDER' | translate}}">-->
+								<rich-text-editor-component [parentFormGroup]="fieldsetEntry.form" [controlName]="'commentFieldValue'"
+															[id]="'editor1'" [placeholder]="'DATASET-PROFILE-EDITOR.STEPS.FORM.COMPOSITE-FIELD.FIELDS.COMMENT-PLACEHOLDER' | translate"
+															[wrapperClasses]="'col-12 mb-2'">
+								</rich-text-editor-component>
+<!--								<mat-hint>{{'DATASET-PROFILE-EDITOR.STEPS.FORM.COMPOSITE-FIELD.FIELDS.COMMENT-HINT' | translate}}</mat-hint>-->
+							</ng-container>
 							<!-- <div class="col"></div>
 							<button class="col-auto" mat-icon-button type="button" (click)="next(compositeField)">
 								<mat-icon>expand_more</mat-icon>