From 5ff8e1fab846c0d23994ad7fa0c125d73519ee83 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Adina=20=C8=9Aeudan?= <adina@devplant.ro>
Date: Wed, 6 Jan 2021 20:14:14 +0200
Subject: [PATCH] Add/edit rule sets WIP

---
 .../rule-set-actions/rule-set-actions.component.ts     |  8 ++------
 .../add-edit-project-dialog.component.html             |  6 +++---
 .../add-edit-project-dialog.component.ts               | 10 ++++++++--
 .../add-edit-rule-set-dialog.component.ts              | 10 +++++++---
 .../rule-sets-listing-screen.component.html            |  6 +++++-
 .../project-details/project-details.component.html     |  2 +-
 6 files changed, 26 insertions(+), 16 deletions(-)

diff --git a/apps/red-ui/src/app/components/rule-set-actions/rule-set-actions.component.ts b/apps/red-ui/src/app/components/rule-set-actions/rule-set-actions.component.ts
index f286aeb13..849d3cc12 100644
--- a/apps/red-ui/src/app/components/rule-set-actions/rule-set-actions.component.ts
+++ b/apps/red-ui/src/app/components/rule-set-actions/rule-set-actions.component.ts
@@ -16,7 +16,8 @@ export class RuleSetActionsComponent implements OnInit {
 
     ngOnInit(): void {}
 
-    openAddEditRuleSetDialog(ruleSet?: RuleSetModel) {
+    openEditRuleSetDialog($event: any, ruleSet: RuleSetModel) {
+        $event.stopPropagation();
         this._dialogService.openAddEditRuleSetDialog(ruleSet, async (newRuleSet) => {
             if (newRuleSet) {
                 this.loadRuleSetsData.emit();
@@ -24,11 +25,6 @@ export class RuleSetActionsComponent implements OnInit {
         });
     }
 
-    openEditRuleSetDialog($event: any, ruleSet: RuleSetModel) {
-        $event.stopPropagation();
-        this.openAddEditRuleSetDialog(ruleSet);
-    }
-
     openDeleteRuleSetDialog($event: any, ruleSet: RuleSetModel) {
         this._dialogService.openDeleteRuleSetDialog($event, ruleSet, async () => {
             this.loadRuleSetsData.emit();
diff --git a/apps/red-ui/src/app/dialogs/add-edit-project-dialog/add-edit-project-dialog.component.html b/apps/red-ui/src/app/dialogs/add-edit-project-dialog/add-edit-project-dialog.component.html
index 966f47acc..d92c4f67a 100644
--- a/apps/red-ui/src/app/dialogs/add-edit-project-dialog/add-edit-project-dialog.component.html
+++ b/apps/red-ui/src/app/dialogs/add-edit-project-dialog/add-edit-project-dialog.component.html
@@ -19,9 +19,9 @@
             <div class="red-input-group required w-400">
                 <mat-form-field floatLabel="always">
                     <mat-label>{{ 'project-listing.add-edit-dialog.form.template' | translate }}</mat-label>
-                    <mat-select value="EFSA 1 (Vertebrate Authors)" style="width: 100%;" [disabled]="project?.hasFiles">
-                        <mat-option *ngFor="let type of ['EFSA 1 (Vertebrate Authors)']" [value]="type">
-                            {{ type }}
+                    <mat-select formControlName="ruleSet" style="width: 100%;">
+                        <mat-option *ngFor="let ruleSet of ruleSets" [value]="ruleSet.ruleSetId">
+                            {{ ruleSet.name }}
                         </mat-option>
                     </mat-select>
                 </mat-form-field>
diff --git a/apps/red-ui/src/app/dialogs/add-edit-project-dialog/add-edit-project-dialog.component.ts b/apps/red-ui/src/app/dialogs/add-edit-project-dialog/add-edit-project-dialog.component.ts
index 2fa878326..db8e19078 100644
--- a/apps/red-ui/src/app/dialogs/add-edit-project-dialog/add-edit-project-dialog.component.ts
+++ b/apps/red-ui/src/app/dialogs/add-edit-project-dialog/add-edit-project-dialog.component.ts
@@ -1,6 +1,6 @@
 import { Component, Inject } from '@angular/core';
 import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
-import { Project } from '@redaction/red-ui-http';
+import { Project, RuleSetModel } from '@redaction/red-ui-http';
 import { FormBuilder, FormGroup, Validators } from '@angular/forms';
 import { AppStateService } from '../../state/app-state.service';
 import { ProjectWrapper } from '../../state/model/project.wrapper';
@@ -23,12 +23,17 @@ export class AddEditProjectDialogComponent {
     ) {
         this.projectForm = this._formBuilder.group({
             projectName: [this.project?.projectName, Validators.required],
+            ruleSet: [{ value: this.project?.ruleSetId, disabled: this.project?.hasFiles }, Validators.required],
             description: [this.project?.description],
             dueDate: [this.project?.dueDate]
         });
         this.hasDueDate = !!this.project?.dueDate;
     }
 
+    public get ruleSets(): RuleSetModel[] {
+        return this._appStateService.ruleSets;
+    }
+
     public get changed() {
         if (!this.project) {
             return true;
@@ -77,7 +82,8 @@ export class AddEditProjectDialogComponent {
         return {
             projectName: this.projectForm.get('projectName').value,
             description: this.projectForm.get('description').value,
-            dueDate: this.hasDueDate ? this.projectForm.get('dueDate').value : undefined
+            dueDate: this.hasDueDate ? this.projectForm.get('dueDate').value : undefined,
+            ruleSetId: this.projectForm.get('ruleSet').value
         };
     }
 
diff --git a/apps/red-ui/src/app/screens/admin/rule-sets-listing-screen/add-edit-rule-set-dialog/add-edit-rule-set-dialog.component.ts b/apps/red-ui/src/app/screens/admin/rule-sets-listing-screen/add-edit-rule-set-dialog/add-edit-rule-set-dialog.component.ts
index e3618bbb6..97e5abdc1 100644
--- a/apps/red-ui/src/app/screens/admin/rule-sets-listing-screen/add-edit-rule-set-dialog/add-edit-rule-set-dialog.component.ts
+++ b/apps/red-ui/src/app/screens/admin/rule-sets-listing-screen/add-edit-rule-set-dialog/add-edit-rule-set-dialog.component.ts
@@ -3,7 +3,7 @@ import { AppStateService } from '../../../../state/app-state.service';
 import { FormBuilder, FormGroup, Validators } from '@angular/forms';
 import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
 import * as moment from 'moment';
-import { RuleSetModel } from '@redaction/red-ui-http';
+import { RuleSetControllerService, RuleSetModel } from '@redaction/red-ui-http';
 
 @Component({
     selector: 'redaction-add-edit-rule-set-dialog',
@@ -17,6 +17,7 @@ export class AddEditRuleSetDialogComponent {
     constructor(
         private readonly _appStateService: AppStateService,
         private readonly _formBuilder: FormBuilder,
+        private readonly _ruleSetController: RuleSetControllerService,
         public dialogRef: MatDialogRef<AddEditRuleSetDialogComponent>,
         @Inject(MAT_DIALOG_DATA) public ruleSet: RuleSetModel
     ) {
@@ -49,8 +50,11 @@ export class AddEditRuleSetDialogComponent {
     }
 
     async saveRuleSet() {
-        const ruleSet = this.ruleSetForm.getRawValue();
-        console.log({ ruleSet });
+        const ruleSet = {
+            ruleSetId: this.ruleSet?.ruleSetId,
+            ...this.ruleSetForm.getRawValue()
+        };
+        const res = await this._ruleSetController.createOrUpdateRuleSet(ruleSet).toPromise();
         this.dialogRef.close({ ruleSet });
     }
 }
diff --git a/apps/red-ui/src/app/screens/admin/rule-sets-listing-screen/rule-sets-listing-screen.component.html b/apps/red-ui/src/app/screens/admin/rule-sets-listing-screen/rule-sets-listing-screen.component.html
index 48b9eb244..04a9c4560 100644
--- a/apps/red-ui/src/app/screens/admin/rule-sets-listing-screen/rule-sets-listing-screen.component.html
+++ b/apps/red-ui/src/app/screens/admin/rule-sets-listing-screen/rule-sets-listing-screen.component.html
@@ -128,7 +128,11 @@
                             {{ ruleSet.dateModified | date: 'd MMM. yyyy' }}
                         </div>
 
-                        <redaction-rule-set-actions class="actions-container" (loadRuleSetsData)="loadRuleSetsData()"></redaction-rule-set-actions>
+                        <redaction-rule-set-actions
+                            class="actions-container"
+                            [ruleSet]="ruleSet"
+                            (loadRuleSetsData)="loadRuleSetsData()"
+                        ></redaction-rule-set-actions>
                     </div>
 
                     <div class="scrollbar-placeholder"></div>
diff --git a/apps/red-ui/src/app/screens/project-overview-screen/project-details/project-details.component.html b/apps/red-ui/src/app/screens/project-overview-screen/project-details/project-details.component.html
index ca7fa8730..238e3a31f 100644
--- a/apps/red-ui/src/app/screens/project-overview-screen/project-details/project-details.component.html
+++ b/apps/red-ui/src/app/screens/project-overview-screen/project-details/project-details.component.html
@@ -82,7 +82,7 @@
     </div>
     <div>
         <mat-icon svgIcon="red:template"></mat-icon>
-        <span>{{ 'EFSA 1 (Vertebrate Authors)' }} </span>
+        <span>{{ appStateService.getRuleSetById(appStateService.activeProject.ruleSetId)?.name }} </span>
     </div>
 </div>