issue IQ-125 Feat : Reviewer flow For Observation and survey.

projects/questionset-editor-library/src/lib/components/editor/editor.component.html

@@ -1,8 +1,8 @@
 <ng-container [ngSwitch]="pageId">
   <ng-container *ngSwitchCase="'questionset_editor'">
     <div class="add-to-library mb-10">
-      <lib-header [pageId]="pageId" [publishchecklist]="publishchecklist"
-      [labelConfigData]="toolbarConfig" [buttonLoaders]="buttonLoaders" (toolbarEmitter)="toolbarEventListener($event)"> </lib-header>
+      <lib-header [pageId]="pageId" [publishchecklist]="publishchecklist" [questionSetId]="collectionId"
+      [labelConfigData]="toolbarConfig" [buttonLoaders]="buttonLoaders" (toolbarEmitter)="toolbarEventListener($event)" > </lib-header>
       <div class="h-100vh sb-bg-white">
         <div class="ui">
           <div class="ui twelve column grid m-0 ">

projects/questionset-editor-library/src/lib/components/header/header.component.html

@@ -181,9 +181,10 @@
 </div>
 
 <sui-modal *ngIf="showRequestChangesPopup" [mustScroll]="true" [isClosable]="false" [transitionDuration]="0"
-  [size]="'normal'" class="sb-modal bx-none overflow-modal" appBodyScroll #modal (dismissed)="showRequestChangesPopup = false;">
+  [size]="'normal'" class="sb-modal bx-none overflow-modal comment-modal" appBodyScroll #modal (dismissed)="showRequestChangesPopup = false;">
   <div class="sb-modal-header">
-      {{configService.labelConfig?.lbl?.addReviewComments}}
+      <h5>{{configService.labelConfig?.lbl?.addReviewComments}}</h5>
+      <i class="close icon" (click)="modal.deny('denied')"></i>
   </div>
   <form #FormControl="ngForm" class="ui form">
   <div class="sb-modal-content">
@@ -198,12 +199,12 @@
       </div>
   </div>
   <div class="sb-modal-actions">
-    <button id="submitReview" type="submit" class="sb-btn sb-btn-normal" [ngClass]="{'sb-btn-primary': FormControl.form.valid, 'sb-btn-disabled': !FormControl.form.valid}" (click)="buttonEmitter({type: actionType, comment: rejectComment}); showRequestChangesPopup = false;"
-    [disabled]="!FormControl.form.valid" libTelemetryInteract
+    <button id="submitReview" class="sb-btn sb-btn-normal" [ngClass]="{'sb-btn-primary': FormControl.form.valid, 'sb-btn-disabled': !FormControl.form.valid}" (click)="modal.deny('denied')" (click)="saveDraftComments()"
+    libTelemetryInteract
     [telemetryInteractEdata]="telemetryService.getTelemetryInteractEdata('submit_review','click','submit', telemetryService.telemetryPageId, {key: 'dialog_id', value: 'add_review_comments'})"
-    > {{configService.labelConfig?.button_labels?.submit_review_btn_label}} </button>
-    <button class="sb-btn sb-btn-normal sb-btn-outline-primary" (click)="modal.deny('denied')"
-    libTelemetryInteract [telemetryInteractEdata]="telemetryService.getTelemetryInteractEdata('cancel','click','cancel', telemetryService.telemetryPageId,  {key: 'dialog_id', value: 'add_review_comments'})">{{configService.labelConfig?.button_labels?.cancel_btn_label}}</button>
+    > {{configService.labelConfig?.button_labels?.save_draft_btn_label}} </button>
+    <button [disabled]="!FormControl.form.valid" type="submit" class="sb-btn sb-btn-normal sb-btn-outline-primary" (click)="buttonEmitter({type: actionType, comment: rejectComment}); showRequestChangesPopup = false;"
+    libTelemetryInteract [telemetryInteractEdata]="telemetryService.getTelemetryInteractEdata('cancel','click','cancel', telemetryService.telemetryPageId,  {key: 'dialog_id', value: 'add_review_comments'})">{{configService.labelConfig?.button_labels?.submit_review_btn_label}}</button>
   </div>
 </form>
 </sui-modal>

projects/questionset-editor-library/src/lib/components/header/header.component.scss

@@ -46,4 +46,4 @@
 }
 .sb-modal-fullscreen .modals.dimmer .ui.scrolling.modal{
   margin: 0 auto !important;
-}
+}

projects/questionset-editor-library/src/lib/components/header/header.component.spec.ts

@@ -1,14 +1,16 @@
-import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
+import { ComponentFixture, TestBed, tick,fakeAsync, waitForAsync } from '@angular/core/testing';
 import { HeaderComponent } from './header.component';
 import { CUSTOM_ELEMENTS_SCHEMA, EventEmitter } from '@angular/core';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 import { HttpClientTestingModule } from '@angular/common/http/testing';
 import { TelemetryInteractDirective } from '../../directives/telemetry-interact/telemetry-interact.directive';
 import { EditorService } from '../../services/editor/editor.service';
+import { of } from 'rxjs/internal/observable/of';
 
 describe('HeaderComponent', () => {
   let component: HeaderComponent;
   let fixture: ComponentFixture<HeaderComponent>;
+  let editorService: EditorService;
 
   beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
@@ -23,6 +25,7 @@ describe('HeaderComponent', () => {
   beforeEach(() => {
     fixture = TestBed.createComponent(HeaderComponent);
     component = fixture.componentInstance;
+    editorService = TestBed.inject(EditorService);
     // fixture.detectChanges();
   });
 
@@ -57,11 +60,24 @@ describe('HeaderComponent', () => {
     component.handleActionButtons();
     expect(component.visibility).toBeDefined();
   });
-  it('#openRequestChangePopup() should actionType defined', () => {
+  it('#openRequestChangePopup() should actionType defined', fakeAsync(() => {
+    component.questionSetId = '1234';
+    const fakeComment = 'sample comment';
+    const fakeApiResponse = {
+      result: {
+        comments: [
+          { identifier: component.questionSetId, comment: fakeComment },
+        ],
+      },
+    };
+    spyOn(editorService, 'readComment').and.returnValue(of(fakeApiResponse));
     component.openRequestChangePopup('sendForCorrections');
-    expect(component.showRequestChangesPopup).toBeTruthy();
+    tick();
     expect(component.actionType).toBe('sendForCorrections');
-  });
+    expect(component.showRequestChangesPopup).toBe(true);
+    expect(component.rejectComment).toBe(fakeComment);
+    expect(editorService.readComment).toHaveBeenCalledWith(component.questionSetId);
+  }));
   it('#buttonEmitter() should call buttonEmitter', () => {
     const data = { type: 'previewContent' };
     spyOn(component.toolbarEmitter, 'emit');

projects/questionset-editor-library/src/lib/components/header/header.component.ts

@@ -13,6 +13,7 @@ import { NgForm } from '@angular/forms';
 })
 export class HeaderComponent implements OnDestroy, OnInit {
   @Input() pageId: any;
+  @Input() questionSetId: string;
   @Input() labelConfigData: any;
   @Input() buttonLoaders: any;
   @Input() publishchecklist: any;
@@ -77,6 +78,9 @@ export class HeaderComponent implements OnDestroy, OnInit {
   openRequestChangePopup(action: string) {
     this.actionType = action;
     this.showRequestChangesPopup = true;
+    this.editorService.readComment(this.questionSetId).subscribe((res) => {
+      this.rejectComment = res.result.comments.find((item)=> item.identifier == this.questionSetId).comment;
+    })
   }
 
   buttonEmitter(action) {
@@ -103,6 +107,11 @@ export class HeaderComponent implements OnDestroy, OnInit {
     }
   }
 
+  saveDraftComments() {
+    this.editorService.updateComment(this.questionSetId,this.rejectComment)
+    .subscribe((res) => {})
+  }
+
   ngOnDestroy() {
     if (this?.modal && this?.modal?.deny) {
       this.modal.deny();

projects/questionset-editor-library/src/lib/services/config/label.config.json

@@ -39,6 +39,7 @@
        "create_new_btn_label":"Create New",
        "add_from_library_btn_label":" Add from library",
        "submit_review_btn_label":"Submit Review",
+       "save_draft_btn_label":"Save as draft",
        "delete_btn_label":"Delete",
        "next_btn_label":"Next",
        "remove_btn_label":"Remove",

projects/questionset-editor-library/src/lib/services/config/url.config.json

@@ -11,7 +11,9 @@
       "HIERARCHY_READ": "questionset/v2/hierarchy",
       "SYSYTEM_UPDATE": "questionset/v5/system/update/",
       "HIERARCHY_UPDATE": "questionset/v2/hierarchy/update",
-      "DEFAULT_PARAMS_FIELDS": "instructions,outcomeDeclaration"
+      "DEFAULT_PARAMS_FIELDS": "instructions,outcomeDeclaration",
+      "UPDATE_COMMENT":"questionset/v2/comment/update",
+      "READ_COMMENT":"questionset/v2/comment/read"
     },
     "Question": {
       "HIERARCHY_READ": "questionset/v2/hierarchy",

projects/questionset-editor-library/src/lib/services/editor/editor.service.spec.ts

@@ -486,4 +486,20 @@ describe('EditorService', () => {
     expect(config).toEqual({});
   });
 
+  it('#readComment() should read comments of questionset', async () => {
+    const publicDataService = TestBed.inject(PublicDataService);
+    spyOn(publicDataService, 'patch').and.returnValue(of(mockData.serverResponse));
+    editorService.readComment('do_113941643543011328112').subscribe(data => {
+      expect(data.responseCode).toEqual('OK');
+    });
+  });
+
+  it('#updateComment() should update comments of questionset', async () => {
+    const publicDataService = TestBed.inject(PublicDataService);
+    spyOn(publicDataService, 'patch').and.returnValue(of(mockData.serverResponse));
+    editorService.updateComment('do_113941643543011328112','sample comment').subscribe(data => {
+      expect(data.responseCode).toEqual('OK');
+    });
+  });
+
 });

projects/questionset-editor-library/src/lib/services/editor/editor.service.ts

@@ -249,7 +249,34 @@ export class EditorService {
     return this.publicDataService.post(option);
   }
 
-  submitRequestChanges(contentId, comment) {
+  updateComment(contentId,comment): Observable<any> {
+    const url = this.configService.urlConFig.URLS[this.editorConfig.config.objectType];
+    const option = {
+      url: url.UPDATE_COMMENT,
+      data: {
+        request: {
+          comments : [
+            {
+              identifier : contentId,
+              comment : comment
+            }
+          ]
+        }
+      }
+    };
+    return this.publicDataService.patch(option);
+  }
+
+  readComment(contentId:string): Observable<any> {
+    const url = this.configService.urlConFig.URLS[this.editorConfig.config.objectType];
+    const hierarchyUrl = `${url.READ_COMMENT}/${contentId}`;
+    const req = {
+      url: hierarchyUrl,
+    };
+    return this.publicDataService.get(req);
+  }
+
+  submitRequestChanges(contentId:string, comment:string) {
     let objType = this.configService.categoryConfig[this.editorConfig.config.objectType];
     objType = objType.toLowerCase();
     const url = this.configService.urlConFig.URLS[this.editorConfig.config.objectType];