From 62120517b1877cd786726315dbc9f49172893446 Mon Sep 17 00:00:00 2001
From: amentis <amentis@cite.gr>
Date: Thu, 23 May 2024 11:12:30 +0300
Subject: [PATCH] disabled drag contacts and disable dmp user fields when
 canEdit is false

---
 .../ui/dmp/dmp-editor-blueprint/dmp-editor.component.html | 7 +++----
 .../app/ui/dmp/dmp-editor-blueprint/dmp-editor.model.ts   | 3 ++-
 .../ui/dmp/dmp-user-field/dmp-user-field.component.html   | 8 ++++----
 .../app/ui/dmp/dmp-user-field/dmp-user-field.component.ts | 2 +-
 .../dialog/dmp-invitation-dialog.component.html           | 2 +-
 5 files changed, 11 insertions(+), 11 deletions(-)

diff --git a/dmp-frontend/src/app/ui/dmp/dmp-editor-blueprint/dmp-editor.component.html b/dmp-frontend/src/app/ui/dmp/dmp-editor-blueprint/dmp-editor.component.html
index 6da89be36..915fcd9c9 100644
--- a/dmp-frontend/src/app/ui/dmp/dmp-editor-blueprint/dmp-editor.component.html
+++ b/dmp-frontend/src/app/ui/dmp/dmp-editor-blueprint/dmp-editor.component.html
@@ -189,10 +189,10 @@
 														</div>
 														<div *ngIf="field.systemFieldType == dmpBlueprintSystemFieldTypeEnum.Contact">
 															<div cdkDropList class="col-12" (cdkDropListDropped)="dropContacts($event)">
-																<div *ngFor="let contact of formGroup.get('properties').get('contacts').controls; let contactIndex=index;" cdkDrag class="row align-items-center" [cdkDragDisabled]="formGroup.disabled" (mouseenter)="onContactHover(contactIndex)" (mouseleave)="clearHoveredContact()">
+																<div *ngFor="let contact of formGroup.get('properties').get('contacts').controls; let contactIndex=index;" cdkDrag class="row align-items-center" [cdkDragDisabled]="formGroup.disabled || !canEdit" (mouseenter)="onContactHover(contactIndex)" (mouseleave)="clearHoveredContact()">
 																	<div class="col-12 col-xl-auto pr-0">
 																		<span *ngIf="!isContactSelected(contactIndex)" style="font-size: 18px; box-sizing: border-box; display: inline-block; padding: 0.15rem 0.435rem 0.3rem 0.435rem;">{{contactIndex + 1}}</span>
-																		<mat-icon *ngIf="isContactSelected(contactIndex)" [ngClass]="{'drag-handle-disabled': formGroup.disabled}" cdkDragHandle class="drag-handle">drag_indicator</mat-icon>
+																		<mat-icon *ngIf="isContactSelected(contactIndex)" [ngClass]="{'drag-handle-disabled': formGroup.disabled || !canEdit}" cdkDragHandle class="drag-handle">drag_indicator</mat-icon>
 																	</div>
 																	<div class="col-12 col-xl-auto">
 																		<mat-button-toggle-group name="fontStyle" aria-label="Font Style" [formControl]="contact.get('contactType')">
@@ -269,8 +269,7 @@
 														</div>
 														<div *ngIf="field.systemFieldType == dmpBlueprintSystemFieldTypeEnum.User">
 															<div>
-																<app-dmp-user-field-component [form]="formGroup" [validationErrorModel]="editorModel.validationErrorModel" [sections]="selectedBlueprint.definition.sections"></app-dmp-user-field-component>
-															</div>
+																<app-dmp-user-field-component [form]="formGroup" [validationErrorModel]="editorModel.validationErrorModel" [sections]="selectedBlueprint.definition.sections" [viewOnly]="formGroup.disabled || !canEdit"></app-dmp-user-field-component>															</div>
 														</div>
 													</div>
 													<div *ngIf="field.category === dmpBlueprintSectionFieldCategoryEnum.ReferenceType">
diff --git a/dmp-frontend/src/app/ui/dmp/dmp-editor-blueprint/dmp-editor.model.ts b/dmp-frontend/src/app/ui/dmp/dmp-editor-blueprint/dmp-editor.model.ts
index 177329329..ce05a6a66 100644
--- a/dmp-frontend/src/app/ui/dmp/dmp-editor-blueprint/dmp-editor.model.ts
+++ b/dmp-frontend/src/app/ui/dmp/dmp-editor-blueprint/dmp-editor.model.ts
@@ -93,7 +93,8 @@ export class DmpEditorModel extends BaseEditorModel implements DmpPersist {
 			users: this.formBuilder.array(
 				(this.users ?? []).map(
 					(item, index) => item.buildForm({
-						rootPath: `users[${index}].`
+						rootPath: `users[${index}].`,
+						disabled: disabled
 					})
 				), context.getValidation('users').validators
 			),
diff --git a/dmp-frontend/src/app/ui/dmp/dmp-user-field/dmp-user-field.component.html b/dmp-frontend/src/app/ui/dmp/dmp-user-field/dmp-user-field.component.html
index 1906960bd..8b769a12f 100644
--- a/dmp-frontend/src/app/ui/dmp/dmp-user-field/dmp-user-field.component.html
+++ b/dmp-frontend/src/app/ui/dmp/dmp-user-field/dmp-user-field.component.html
@@ -2,7 +2,7 @@
 
 	<div cdkDropList (cdkDropListDropped)="dropUsers($event)" *ngIf="enableSorting===true; else sortingDisabled" class="row">
 		<div class="col-12">
-			<div *ngFor="let user of form.get('users').controls; let userIndex = index" cdkDrag class="row align-items-center user-fields" [cdkDragDisabled]="form.disabled" (mouseenter)="onUserHover(userIndex)" (mouseleave)="clearHoveredUser()">
+			<div *ngFor="let user of form.get('users').controls; let userIndex = index" cdkDrag class="row align-items-center user-fields" [cdkDragDisabled]="viewOnly" (mouseenter)="onUserHover(userIndex)" (mouseleave)="clearHoveredUser()">
 				<ng-container *ngTemplateOutlet="userForm; context: {$implicit: user, index: userIndex}"></ng-container>
 			</div>
 		</div>
@@ -20,7 +20,7 @@
 
 	<div class="row">
 		<div class="col">
-			<button mat-icon-button (click)="addUser()" [disabled]="form.disabled">
+			<button mat-icon-button (click)="addUser()" [disabled]="viewOnly">
 				<mat-icon>add</mat-icon>
 			</button>
 		</div>
@@ -32,7 +32,7 @@
 
 	<div class="col-12 col-xl-auto pb-1">
 		<span *ngIf="!isUserSelected(userIndex)" style="font-size: 18px; box-sizing: border-box; display: inline-block; padding: 0.85rem 0.435rem 0 0.435rem;">{{userIndex + 1}}</span>
-		<mat-icon *ngIf="isUserSelected(userIndex)" [ngClass]="{'drag-handle-disabled': form.disabled}" cdkDragHandle class="drag-handle">drag_indicator</mat-icon>
+		<mat-icon *ngIf="isUserSelected(userIndex)" [ngClass]="{'drag-handle-disabled': viewOnly}" cdkDragHandle class="drag-handle">drag_indicator</mat-icon>
 	</div>
 	<div class="col-12 col-xl-auto">
 		<mat-button-toggle-group name="fontStyle" aria-label="Font Style" [formControl]="user.get('userType')" class="w-100">
@@ -87,7 +87,7 @@
 		</mat-form-field>
 	</div>
 	<div class="col-12 col-xl-auto">
-		<button mat-icon-button class="action-list-icon" matTooltip="{{'DMP-EDITOR.ACTIONS.REMOVE-USER' | translate}}" (click)="removeUser(userIndex)" [disabled]="form.disabled">
+		<button mat-icon-button class="action-list-icon" matTooltip="{{'DMP-EDITOR.ACTIONS.REMOVE-USER' | translate}}" (click)="removeUser(userIndex)" [disabled]="viewOnly">
 			<mat-icon>delete</mat-icon>
 		</button>
 	</div>
diff --git a/dmp-frontend/src/app/ui/dmp/dmp-user-field/dmp-user-field.component.ts b/dmp-frontend/src/app/ui/dmp/dmp-user-field/dmp-user-field.component.ts
index 50365d230..810aef4b5 100644
--- a/dmp-frontend/src/app/ui/dmp/dmp-user-field/dmp-user-field.component.ts
+++ b/dmp-frontend/src/app/ui/dmp/dmp-user-field/dmp-user-field.component.ts
@@ -25,7 +25,7 @@ export class DmpUserFieldComponent extends BaseComponent implements OnInit {
 	@Input() placeholder: string;
 	@Input() sections: DmpBlueprintDefinitionSection[] = null;
 	@Input() initializeUsers: boolean = false;
-
+	@Input() viewOnly: boolean = false;
 	@Input() enableSorting: boolean = true;
 	hoveredUser:number = -1;
 	hasTemplatesSections: DmpBlueprintDefinitionSection[] = null;
diff --git a/dmp-frontend/src/app/ui/dmp/invitation/dialog/dmp-invitation-dialog.component.html b/dmp-frontend/src/app/ui/dmp/invitation/dialog/dmp-invitation-dialog.component.html
index d969e2a63..cd2bd846e 100644
--- a/dmp-frontend/src/app/ui/dmp/invitation/dialog/dmp-invitation-dialog.component.html
+++ b/dmp-frontend/src/app/ui/dmp/invitation/dialog/dmp-invitation-dialog.component.html
@@ -9,7 +9,7 @@
 	</div>
 	<div mat-dialog-content class="row">
 		<div>
-			<app-dmp-user-field-component [form]="formGroup" [validationErrorModel]="editorModel.validationErrorModel" [sections]="selectedBlueprint.definition.sections" [initializeUsers]="true" [enableSorting]="false"></app-dmp-user-field-component>
+			<app-dmp-user-field-component [form]="formGroup" [validationErrorModel]="editorModel.validationErrorModel" [sections]="selectedBlueprint.definition.sections" [viewOnly]="false" [initializeUsers]="true" [enableSorting]="false"></app-dmp-user-field-component>
 		</div>
 		<div class="col mt-2">
 			<button mat-raised-button *ngIf="hasValue()" (click)="send()" type="button" class="invite-btn">{{'DMP-USER-INVITATION-DIALOG.ACTIONS.INVITE' | translate}}</button>