From 51d0a9c2ee9a4ca26d961ca90c1b5041bab139ce Mon Sep 17 00:00:00 2001
From: Geoffrey Kwan <geoffreykwan@gmail.com>
Date: Thu, 25 Apr 2024 10:46:22 -0400
Subject: [PATCH] refactor(Authoring): Convert SelectStepAndComponent to
 standalone (#1754)

---
 .../select-step-and-component.component.html         | 10 ++++++----
 .../select-step-and-component.component.spec.ts      | 12 ++----------
 .../select-step-and-component.component.ts           |  8 +++++++-
 src/app/teacher/component-authoring.module.ts        |  3 +--
 src/messages.xlf                                     |  2 +-
 5 files changed, 17 insertions(+), 18 deletions(-)

diff --git a/src/app/authoring-tool/select-step-and-component/select-step-and-component.component.html b/src/app/authoring-tool/select-step-and-component/select-step-and-component.component.html
index d9d4f29e5a5..09264d38882 100644
--- a/src/app/authoring-tool/select-step-and-component/select-step-and-component.component.html
+++ b/src/app/authoring-tool/select-step-and-component/select-step-and-component.component.html
@@ -9,11 +9,13 @@
 <mat-form-field>
   <mat-label i18n>Component</mat-label>
   <mat-select [(ngModel)]="referenceComponent.componentId" (ngModelChange)="componentChanged()">
-    <mat-option *ngFor="let component of components; index as componentIndex"
-        [value]="component.id"
-        [disabled]="!componentToIsAllowed.get(component.id) || component.id === thisComponentId">
+    <mat-option
+      *ngFor="let component of components; index as componentIndex"
+      [value]="component.id"
+      [disabled]="!componentToIsAllowed.get(component.id) || component.id === thisComponentId"
+    >
       <span>{{ componentIndex + 1 }}. {{ component.type }} </span>
       <span *ngIf="component.id === thisComponentId" i18n>(This Component)</span>
     </mat-option>
   </mat-select>
-</mat-form-field>
\ No newline at end of file
+</mat-form-field>
diff --git a/src/app/authoring-tool/select-step-and-component/select-step-and-component.component.spec.ts b/src/app/authoring-tool/select-step-and-component/select-step-and-component.component.spec.ts
index b972db8448e..c7216a562bf 100644
--- a/src/app/authoring-tool/select-step-and-component/select-step-and-component.component.spec.ts
+++ b/src/app/authoring-tool/select-step-and-component/select-step-and-component.component.spec.ts
@@ -1,9 +1,5 @@
 import { HttpClientTestingModule } from '@angular/common/http/testing';
 import { ComponentFixture, TestBed } from '@angular/core/testing';
-import { FormsModule } from '@angular/forms';
-import { MatFormFieldModule } from '@angular/material/form-field';
-import { MatInputModule } from '@angular/material/input';
-import { MatSelectModule } from '@angular/material/select';
 import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
 import { ProjectService } from '../../../assets/wise5/services/projectService';
 import { ReferenceComponent } from '../../domain/referenceComponent';
@@ -27,14 +23,10 @@ describe('SelectStepAndComponentComponent', () => {
     await TestBed.configureTestingModule({
       imports: [
         BrowserAnimationsModule,
-        FormsModule,
         HttpClientTestingModule,
-        MatFormFieldModule,
-        MatInputModule,
-        MatSelectModule,
+        SelectStepAndComponentComponent,
         StudentTeacherCommonServicesModule
-      ],
-      declarations: [SelectStepAndComponentComponent]
+      ]
     }).compileComponents();
     fixture = TestBed.createComponent(SelectStepAndComponentComponent);
     loader = TestbedHarnessEnvironment.loader(fixture);
diff --git a/src/app/authoring-tool/select-step-and-component/select-step-and-component.component.ts b/src/app/authoring-tool/select-step-and-component/select-step-and-component.component.ts
index 51176f189c0..e309ec2e271 100644
--- a/src/app/authoring-tool/select-step-and-component/select-step-and-component.component.ts
+++ b/src/app/authoring-tool/select-step-and-component/select-step-and-component.component.ts
@@ -1,11 +1,17 @@
 import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
 import { ProjectService } from '../../../assets/wise5/services/projectService';
 import { ReferenceComponent } from '../../domain/referenceComponent';
+import { MatFormFieldModule } from '@angular/material/form-field';
+import { MatSelectModule } from '@angular/material/select';
+import { FormsModule } from '@angular/forms';
+import { CommonModule } from '@angular/common';
 
 @Component({
   selector: 'select-step-and-component',
   templateUrl: './select-step-and-component.component.html',
-  styleUrls: ['./select-step-and-component.component.scss']
+  styleUrls: ['./select-step-and-component.component.scss'],
+  standalone: true,
+  imports: [CommonModule, FormsModule, MatFormFieldModule, MatSelectModule]
 })
 export class SelectStepAndComponentComponent implements OnInit {
   @Input() allowedComponentTypes: string[] = [];
diff --git a/src/app/teacher/component-authoring.module.ts b/src/app/teacher/component-authoring.module.ts
index 3c59424b37d..51be6973894 100644
--- a/src/app/teacher/component-authoring.module.ts
+++ b/src/app/teacher/component-authoring.module.ts
@@ -168,13 +168,13 @@ import { EditAiChatAdvancedComponent } from '../../assets/wise5/components/aiCha
     PeerChatAuthoringComponent,
     ShowGroupWorkAuthoringComponent,
     ShowMyWorkAuthoringComponent,
-    SelectStepAndComponentComponent,
     SummaryAuthoring,
     TableAuthoring,
     WiseLinkAuthoringDialogComponent
   ],
   imports: [
     ConstraintAuthoringModule,
+    SelectStepAndComponentComponent,
     StudentTeacherCommonModule,
     PeerGroupingAuthoringModule,
     WiseTinymceEditorModule
@@ -246,7 +246,6 @@ import { EditAiChatAdvancedComponent } from '../../assets/wise5/components/aiCha
     PeerChatAuthoringComponent,
     ShowGroupWorkAuthoringComponent,
     ShowMyWorkAuthoringComponent,
-    SelectStepAndComponentComponent,
     SummaryAuthoring,
     TableAuthoring
   ]
diff --git a/src/messages.xlf b/src/messages.xlf
index f952e1cd361..c1e15932d69 100644
--- a/src/messages.xlf
+++ b/src/messages.xlf
@@ -1688,7 +1688,7 @@ Click &quot;Cancel&quot; to keep the invalid JSON open so you can fix it.</sourc
         <source>(This Component)</source>
         <context-group purpose="location">
           <context context-type="sourcefile">src/app/authoring-tool/select-step-and-component/select-step-and-component.component.html</context>
-          <context context-type="linenumber">16</context>
+          <context context-type="linenumber">18</context>
         </context-group>
         <context-group purpose="location">
           <context context-type="sourcefile">src/assets/wise5/components/openResponse/edit-open-response-advanced/edit-open-response-advanced.component.html</context>