refactor(DialogGuidance): Create DialogGuidanceComponent class (#936)

- Refactor DialogGuidanceFeedbackService.getFeedbackText() to take in the
new DialogGuidanceComponent instead of DialogGuidanceStudentComponent
- Lower-case variable names

src/app/services/dialogGuidanceFeedbackService.spec.ts

@@ -1,37 +1,31 @@
 import { TestBed } from '@angular/core/testing';
-import { DialogGuidanceStudentComponent } from '../../assets/wise5/components/dialogGuidance/dialog-guidance-student/dialog-guidance-student.component';
 import { FeedbackRule } from '../../assets/wise5/components/common/feedbackRule/FeedbackRule';
 import { DialogGuidanceFeedbackService } from '../../assets/wise5/services/dialogGuidanceFeedbackService';
 import { StudentDataService } from '../../assets/wise5/services/studentDataService';
+import { DialogGuidanceComponent } from '../../assets/wise5/components/dialogGuidance/DialogGuidanceComponent';
+import { DialogGuidanceContent } from '../../assets/wise5/components/dialogGuidance/DialogGuidanceContent';
 
 let service: DialogGuidanceFeedbackService;
 let studentDataService: StudentDataService;
-let component: DialogGuidanceStudentComponent;
 let feedbackRuleV1: FeedbackRule;
 let feedbackRuleV2_1: FeedbackRule;
 
 class StudentDataServiceMock {
   getLatestSubmitComponentState() {}
 }
 
-class DialogGuidanceStudentComponentMock {
-  nodeId = 'node1';
-  componentId = 'componentA';
-  isVersion1() {}
-  isVersion2() {}
-}
+const content = {} as DialogGuidanceContent;
+const component = new DialogGuidanceComponent(content, 'node1');
 
 describe('DialogGuidanceFeedbackService', () => {
   beforeEach(() => {
     TestBed.configureTestingModule({
       imports: [],
       providers: [
         DialogGuidanceFeedbackService,
-        { provide: StudentDataService, useClass: StudentDataServiceMock },
-        { provide: DialogGuidanceStudentComponent, useClass: DialogGuidanceStudentComponentMock }
+        { provide: StudentDataService, useClass: StudentDataServiceMock }
       ]
     });
-    component = TestBed.inject(DialogGuidanceStudentComponent);
     service = TestBed.inject(DialogGuidanceFeedbackService);
     studentDataService = TestBed.inject(StudentDataService);
     feedbackRuleV1 = new FeedbackRule();

src/assets/wise5/common/ComponentContent.ts

@@ -7,6 +7,7 @@ export interface ComponentContent {
   dynamicPrompt?: DynamicPrompt;
   excludeFromTotalScore?: boolean;
   maxScore?: number;
+  maxSubmitCount?: number;
   prompt?: string;
   questionBank?: QuestionBank;
   rubric?: string;

src/assets/wise5/common/ComponentFactory.spec.ts

@@ -1,3 +1,4 @@
+import { DialogGuidanceComponent } from '../components/dialogGuidance/DialogGuidanceComponent';
 import { MultipleChoiceComponent } from '../components/multipleChoice/MultipleChoiceComponent';
 import { Component } from './Component';
 import { ComponentContent } from './ComponentContent';
@@ -11,6 +12,11 @@ describe('ComponentFactory', () => {
 function getComponent() {
   describe('getComponent()', () => {
     const componentTypes = [
+      {
+        type: 'DialogGuidance',
+        instance: DialogGuidanceComponent,
+        message: 'should return DialogGuidanceComponent if content.type is DialogGuidance'
+      },
       {
         type: 'MultipleChoice',
         instance: MultipleChoiceComponent,

src/assets/wise5/common/ComponentFactory.ts

@@ -1,10 +1,13 @@
+import { DialogGuidanceComponent } from '../components/dialogGuidance/DialogGuidanceComponent';
 import { MultipleChoiceComponent } from '../components/multipleChoice/MultipleChoiceComponent';
 import { Component } from './Component';
 import { ComponentContent } from './ComponentContent';
 
 export class ComponentFactory {
   getComponent(content: ComponentContent, nodeId: string): Component {
-    if (content.type === 'MultipleChoice') {
+    if (content.type === 'DialogGuidance') {
+      return new DialogGuidanceComponent(content, nodeId);
+    } else if (content.type === 'MultipleChoice') {
       return new MultipleChoiceComponent(content, nodeId);
     } else {
       return new Component(content, nodeId);

src/assets/wise5/components/component-student.component.ts

@@ -449,7 +449,7 @@ export abstract class ComponentStudent {
   }
 
   getMaxSubmitCount(): number {
-    return this.componentContent.maxSubmitCount;
+    return this.component.content.maxSubmitCount;
   }
 
   setIsSubmit(isSubmit: boolean): void {

src/assets/wise5/components/dialogGuidance/DialogGuidanceComponent.ts

@@ -0,0 +1,48 @@
+import { Component } from '../../common/Component';
+import { FeedbackRule } from '../common/feedbackRule/FeedbackRule';
+import { DialogGuidanceContent } from './DialogGuidanceContent';
+
+export class DialogGuidanceComponent extends Component {
+  content: DialogGuidanceContent;
+
+  getFeedbackRules(): FeedbackRule[] {
+    return this.content.feedbackRules;
+  }
+
+  getComputerAvatarInitialResponse(): string {
+    return this.content.computerAvatarSettings.initialResponse;
+  }
+
+  isComputerAvatarEnabled(): boolean {
+    return this.content.isComputerAvatarEnabled;
+  }
+
+  getItemId(): string {
+    return this.content.itemId;
+  }
+
+  isComputerAvatarPromptAvailable(): boolean {
+    const computerAvatarPrompt = this.content.computerAvatarSettings.prompt;
+    return computerAvatarPrompt != null && computerAvatarPrompt !== '';
+  }
+
+  isMultipleFeedbackTextsForSameRuleAllowed(): boolean {
+    return !this.isVersion1();
+  }
+
+  isOnlyOneComputerAvatarAvailable(): boolean {
+    return this.content.computerAvatarSettings.ids.length === 1;
+  }
+
+  isUseGlobalComputerAvatar(): boolean {
+    return this.content.computerAvatarSettings.useGlobalComputerAvatar;
+  }
+
+  isVersion1(): boolean {
+    return this.content.version == null;
+  }
+
+  isVersion2(): boolean {
+    return this.content.version === 2;
+  }
+}

src/assets/wise5/components/dialogGuidance/DialogGuidanceContent.ts

@@ -0,0 +1,11 @@
+import { ComponentContent } from '../../common/ComponentContent';
+import { FeedbackRule } from '../common/feedbackRule/FeedbackRule';
+import { ComputerAvatarSettings } from './ComputerAvatarSettings';
+
+export interface DialogGuidanceContent extends ComponentContent {
+  computerAvatarSettings?: ComputerAvatarSettings;
+  feedbackRules: FeedbackRule[];
+  isComputerAvatarEnabled?: boolean;
+  itemId: string;
+  version?: number;
+}

src/assets/wise5/components/dialogGuidance/dialog-guidance-student/dialog-guidance-student.component.spec.ts

@@ -23,7 +23,7 @@ import { CRaterScore } from '../../common/cRater/CRaterScore';
 import { DialogResponsesComponent } from '../dialog-responses/dialog-responses.component';
 import { DialogGuidanceService } from '../dialogGuidanceService';
 import { DialogGuidanceStudentComponent } from './dialog-guidance-student.component';
-import { Component } from '../../../common/Component';
+import { DialogGuidanceComponent } from '../DialogGuidanceComponent';
 
 let component: DialogGuidanceStudentComponent;
 let fixture: ComponentFixture<DialogGuidanceStudentComponent>;
@@ -64,7 +64,7 @@ describe('DialogGuidanceStudentComponent', () => {
         feedback: 'Default Feedback'
       }
     ];
-    component.component = new Component(componentContent, null);
+    component.component = new DialogGuidanceComponent(componentContent, null);
     spyOn(component, 'subscribeToSubscriptions').and.callFake(() => {});
     spyOn(component, 'isNotebookEnabled').and.returnValue(false);
     fixture.detectChanges();