refactor(EditComponentConstraintsComponent): Convert to standalone (#…

…1955)
WISE-Community · Sep 23, 2024 · 534327a · 534327a
1 parent 9c421c3
commit 534327a
Show file tree

Hide file tree

Showing 20 changed files with 62 additions and 54 deletions.
diff --git a/src/app/authoring-tool/edit-common-advanced/edit-common-advanced.component.html b/src/app/authoring-tool/edit-common-advanced/edit-common-advanced.component.html
@@ -26,5 +26,5 @@
   (connectedComponentsChanged)="connectedComponentsChanged($event)"
 >
 </edit-connected-components>
-<edit-component-constraints [componentContent]="component.content"></edit-component-constraints>
+<edit-component-constraints [componentContent]="component.content" />
 <edit-component-json [component]="component"></edit-component-json>
diff --git a/src/app/authoring-tool/edit-component-advanced/edit-component-advanced.component.html b/src/app/authoring-tool/edit-component-advanced/edit-component-advanced.component.html
@@ -89,9 +89,7 @@ <h2 mat-dialog-title i18n>Advanced Settings</h2>
           : ''
       "
     >
-      <edit-component-constraints
-        [componentContent]="component.content"
-      ></edit-component-constraints>
+      <edit-component-constraints [componentContent]="component.content" />
       <edit-component-json [component]="component"></edit-component-json>
     </ng-container>
     <edit-summary-advanced

diff --git a/src/app/authoring-tool/edit-component-constraints/edit-component-constraints.component.html b/src/app/authoring-tool/edit-component-constraints/edit-component-constraints.component.html
@@ -13,23 +13,21 @@
       <mat-icon>add</mat-icon>
     </button>
   </div>
-  <div
-    *ngFor="let constraint of content.constraints; index as constraintIndex"
-    class="constraints-div"
-    fxLayoutGap="16px"
-  >
-    <b i18n>Constraint</b>
-    <button
-      mat-raised-button
-      color="primary"
-      (click)="deleteConstraint(constraintIndex)"
-      matTooltip="Delete Constraint"
-      matTooltipPosition="above"
-      i18n-matTooltip
-    >
-      <mat-icon>delete</mat-icon>
-    </button>
-    <br />
-    <component-constraint-authoring [constraint]="constraint" />
-  </div>
+  @for (constraint of content.constraints; track constraint; let constraintIndex = $index) {
+    <div class="constraints-div" fxLayoutGap="16px">
+      <b i18n>Constraint</b>
+      <button
+        mat-raised-button
+        color="primary"
+        (click)="deleteConstraint(constraintIndex)"
+        matTooltip="Delete Constraint"
+        matTooltipPosition="above"
+        i18n-matTooltip
+      >
+        <mat-icon>delete</mat-icon>
+      </button>
+      <br />
+      <component-constraint-authoring [constraint]="constraint" />
+    </div>
+  }
 </div>
diff --git a/...pp/authoring-tool/edit-component-constraints/edit-component-constraints.component.spec.ts b/...pp/authoring-tool/edit-component-constraints/edit-component-constraints.component.spec.ts
@@ -1,28 +1,23 @@
-import { provideHttpClientTesting } from '@angular/common/http/testing';
 import { ComponentFixture, TestBed } from '@angular/core/testing';
-import { MatFormFieldModule } from '@angular/material/form-field';
-import { MatIconModule } from '@angular/material/icon';
 import { TeacherProjectService } from '../../../assets/wise5/services/teacherProjectService';
 import { StudentTeacherCommonServicesModule } from '../../student-teacher-common-services.module';
 import { EditComponentConstraintsComponent } from './edit-component-constraints.component';
 import { provideHttpClient, withInterceptorsFromDi } from '@angular/common/http';
+import { ComponentContent } from '../../../assets/wise5/common/ComponentContent';
 
 describe('EditComponentConstraintsComponent', () => {
   let component: EditComponentConstraintsComponent;
   let fixture: ComponentFixture<EditComponentConstraintsComponent>;
 
   beforeEach(async () => {
     await TestBed.configureTestingModule({
-    declarations: [EditComponentConstraintsComponent],
-    imports: [MatFormFieldModule,
-        MatIconModule,
-        StudentTeacherCommonServicesModule],
-    providers: [TeacherProjectService, provideHttpClient(withInterceptorsFromDi()), provideHttpClientTesting()]
-}).compileComponents();
+      imports: [EditComponentConstraintsComponent, StudentTeacherCommonServicesModule],
+      providers: [TeacherProjectService, provideHttpClient(withInterceptorsFromDi())]
+    }).compileComponents();
 
     fixture = TestBed.createComponent(EditComponentConstraintsComponent);
     component = fixture.componentInstance;
-    component.componentContent = {};
+    component.componentContent = {} as ComponentContent;
     fixture.detectChanges();
   });
 

diff --git a/src/app/authoring-tool/edit-component-constraints/edit-component-constraints.component.ts b/src/app/authoring-tool/edit-component-constraints/edit-component-constraints.component.ts
@@ -1,13 +1,31 @@
 import { Component, Input } from '@angular/core';
 import { ConstraintsAuthoringComponent } from '../../../assets/wise5/authoringTool/constraint/constraints-authoring/constraints-authoring.component';
+import { CommonModule } from '@angular/common';
+import { FlexLayoutModule } from '@angular/flex-layout';
+import { MatButtonModule } from '@angular/material/button';
+import { MatTooltipModule } from '@angular/material/tooltip';
+import { MatIconModule } from '@angular/material/icon';
+import { ComponentConstraintAuthoringComponent } from '../../../assets/wise5/authoringTool/constraint/component-constraint-authoring/component-constraint-authoring.component';
+import { MatFormFieldModule } from '@angular/material/form-field';
+import { ComponentContent } from '../../../assets/wise5/common/ComponentContent';
 
 @Component({
+  imports: [
+    CommonModule,
+    ComponentConstraintAuthoringComponent,
+    FlexLayoutModule,
+    MatButtonModule,
+    MatFormFieldModule,
+    MatIconModule,
+    MatTooltipModule
+  ],
   selector: 'edit-component-constraints',
-  templateUrl: './edit-component-constraints.component.html',
-  styleUrls: ['./edit-component-constraints.component.scss']
+  standalone: true,
+  styleUrl: './edit-component-constraints.component.scss',
+  templateUrl: './edit-component-constraints.component.html'
 })
 export class EditComponentConstraintsComponent extends ConstraintsAuthoringComponent {
-  @Input() componentContent: any;
+  @Input() componentContent: ComponentContent;
 
   ngOnInit(): void {
     if (this.componentContent.constraints == null) {

diff --git a/src/app/teacher/component-authoring.module.ts b/src/app/teacher/component-authoring.module.ts
@@ -77,7 +77,6 @@ import { EditQuestionBankComponent } from '../authoring-tool/edit-question-bank/
 import { EditQuestionBankRulesComponent } from '../authoring-tool/edit-question-bank-rules/edit-question-bank-rules.component';
 import { SelectStepAndComponentComponent } from '../authoring-tool/select-step-and-component/select-step-and-component.component';
 import { EditComponentConstraintsComponent } from '../authoring-tool/edit-component-constraints/edit-component-constraints.component';
-import { ComponentConstraintAuthoringComponent } from '../../assets/wise5/authoringTool/constraint/component-constraint-authoring/component-constraint-authoring.component';
 import { EditComponentAdvancedComponent } from '../authoring-tool/edit-component-advanced/edit-component-advanced.component';
 import { ComponentAuthoringComponent } from '../../assets/wise5/authoringTool/components/component-authoring.component';
 import { WiseTinymceEditorModule } from '../../assets/wise5/directives/wise-tinymce-editor/wise-tinymce-editor.module';
@@ -108,7 +107,6 @@ import { RequiredErrorLabelComponent } from '../../assets/wise5/authoringTool/no
     EditCommonAdvancedComponent,
     EditComponentAdvancedComponent,
     EditComponentAddToNotebookButtonComponent,
-    EditComponentConstraintsComponent,
     EditComponentDefaultFeedback,
     EditComponentExcludeFromTotalScoreComponent,
     EditComponentJsonComponent,
@@ -173,8 +171,8 @@ import { RequiredErrorLabelComponent } from '../../assets/wise5/authoringTool/no
   ],
   imports: [
     ComponentAuthoringComponent,
-    ComponentConstraintAuthoringComponent,
     EditComponentAdvancedButtonComponent,
+    EditComponentConstraintsComponent,
     EditComponentPrompt,
     EditComponentWidthComponent,
     PeerGroupingAuthoringModule,

diff --git a/src/assets/wise5/common/ComponentContent.ts b/src/assets/wise5/common/ComponentContent.ts
@@ -4,6 +4,7 @@ import { DynamicPrompt } from '../directives/dynamic-prompt/DynamicPrompt';
 export interface ComponentContent {
   id: string;
   connectedComponents?: any[];
+  constraints?: any[];
   dynamicPrompt?: DynamicPrompt;
   excludeFromTotalScore?: boolean;
   maxScore?: number;

diff --git a/...dialogGuidance/edit-dialog-guidance-advanced/edit-dialog-guidance-advanced.component.html b/...dialogGuidance/edit-dialog-guidance-advanced/edit-dialog-guidance-advanced.component.html
@@ -1,2 +1,2 @@
-<edit-component-constraints [componentContent]="component.content"></edit-component-constraints>
+<edit-component-constraints [componentContent]="component.content" />
 <edit-component-json [component]="component"></edit-component-json>
diff --git a/...e5/components/discussion/edit-discussion-advanced/edit-discussion-advanced.component.html b/...e5/components/discussion/edit-discussion-advanced/edit-discussion-advanced.component.html
@@ -16,5 +16,5 @@
   (connectedComponentsChanged)="connectedComponentsChanged($event)"
 >
 </edit-discussion-connected-components>
-<edit-component-constraints [componentContent]="component.content"></edit-component-constraints>
+<edit-component-constraints [componentContent]="component.content" />
 <edit-component-json [component]="component"></edit-component-json>
diff --git a/src/assets/wise5/components/draw/edit-draw-advanced/edit-draw-advanced.component.html b/src/assets/wise5/components/draw/edit-draw-advanced/edit-draw-advanced.component.html
@@ -29,5 +29,5 @@
   (connectedComponentsChanged)="connectedComponentsChanged($event)"
 >
 </edit-draw-connected-components>
-<edit-component-constraints [componentContent]="component.content"></edit-component-constraints>
+<edit-component-constraints [componentContent]="component.content" />
 <edit-component-json [component]="component"></edit-component-json>
diff --git a/src/assets/wise5/components/graph/edit-graph-advanced/edit-graph-advanced.component.html b/src/assets/wise5/components/graph/edit-graph-advanced/edit-graph-advanced.component.html
@@ -200,5 +200,5 @@
   (connectedComponentsChanged)="connectedComponentsChanged($event)"
 >
 </edit-graph-connected-components>
-<edit-component-constraints [componentContent]="component.content"></edit-component-constraints>
+<edit-component-constraints [componentContent]="component.content" />
 <edit-component-json [component]="component"></edit-component-json>
diff --git a/src/assets/wise5/components/html/edit-html-advanced/edit-html-advanced.component.html b/src/assets/wise5/components/html/edit-html-advanced/edit-html-advanced.component.html
@@ -1,4 +1,4 @@
 <edit-component-width [componentContent]="componentContent" />
 <edit-component-rubric [componentContent]="componentContent"></edit-component-rubric>
-<edit-component-constraints [componentContent]="component.content"></edit-component-constraints>
+<edit-component-constraints [componentContent]="component.content" />
 <edit-component-json [component]="component"></edit-component-json>
diff --git a/src/assets/wise5/components/label/edit-label-advanced/edit-label-advanced.component.html b/src/assets/wise5/components/label/edit-label-advanced/edit-label-advanced.component.html
@@ -29,5 +29,5 @@
   (connectedComponentsChanged)="connectedComponentsChanged($event)"
 >
 </edit-label-connected-components>
-<edit-component-constraints [componentContent]="component.content"></edit-component-constraints>
+<edit-component-constraints [componentContent]="component.content" />
 <edit-component-json [component]="component"></edit-component-json>
diff --git a/src/assets/wise5/components/match/edit-match-advanced/edit-match-advanced.component.html b/src/assets/wise5/components/match/edit-match-advanced/edit-match-advanced.component.html
@@ -47,5 +47,5 @@
   (connectedComponentsChanged)="connectedComponentsChanged($event)"
 >
 </edit-match-connected-components>
-<edit-component-constraints [componentContent]="component.content"></edit-component-constraints>
+<edit-component-constraints [componentContent]="component.content" />
 <edit-component-json [component]="component"></edit-component-json>
diff --git a/...multipleChoice/edit-multiple-choice-advanced/edit-multiple-choice-advanced.component.html b/...multipleChoice/edit-multiple-choice-advanced/edit-multiple-choice-advanced.component.html
@@ -35,5 +35,5 @@
   (connectedComponentsChanged)="connectedComponentsChanged($event)"
 >
 </edit-multiple-choice-connected-components>
-<edit-component-constraints [componentContent]="component.content"></edit-component-constraints>
+<edit-component-constraints [componentContent]="component.content" />
 <edit-component-json [component]="component"></edit-component-json>
diff --git a/.../components/outsideURL/edit-outside-url-advanced/edit-outside-url-advanced.component.html b/.../components/outsideURL/edit-outside-url-advanced/edit-outside-url-advanced.component.html
@@ -1,4 +1,4 @@
 <edit-component-width [componentContent]="componentContent" />
 <edit-component-rubric [componentContent]="componentContent"></edit-component-rubric>
-<edit-component-constraints [componentContent]="component.content"></edit-component-constraints>
+<edit-component-constraints [componentContent]="component.content" />
 <edit-component-json [component]="component"></edit-component-json>
diff --git a/...erChat/edit-peer-chat-advanced-component/edit-peer-chat-advanced-component.component.html b/...erChat/edit-peer-chat-advanced-component/edit-peer-chat-advanced-component.component.html
@@ -1,2 +1,2 @@
-<edit-component-constraints [componentContent]="component.content"></edit-component-constraints>
+<edit-component-constraints [componentContent]="component.content" />
 <edit-component-json [component]="component"></edit-component-json>
diff --git a/...ssets/wise5/components/summary/edit-summary-advanced/edit-summary-advanced.component.html b/...ssets/wise5/components/summary/edit-summary-advanced/edit-summary-advanced.component.html
@@ -2,6 +2,6 @@
   <edit-component-width [componentContent]="componentContent" />
   <edit-component-rubric [componentContent]="componentContent"></edit-component-rubric>
   <edit-component-tags [componentContent]="componentContent"></edit-component-tags>
-  <edit-component-constraints [componentContent]="component.content"></edit-component-constraints>
+  <edit-component-constraints [componentContent]="component.content" />
   <edit-component-json [component]="component"></edit-component-json>
 </div>
diff --git a/src/assets/wise5/components/table/edit-table-advanced/edit-table-advanced.component.html b/src/assets/wise5/components/table/edit-table-advanced/edit-table-advanced.component.html
@@ -277,5 +277,5 @@
   (connectedComponentsChanged)="connectedComponentsChanged($event)"
 >
 </edit-table-connected-components>
-<edit-component-constraints [componentContent]="component.content"></edit-component-constraints>
+<edit-component-constraints [componentContent]="component.content" />
 <edit-component-json [component]="component"></edit-component-json>
diff --git a/src/messages.xlf b/src/messages.xlf
@@ -844,7 +844,7 @@
         <source> Close </source>
         <context-group purpose="location">
           <context context-type="sourcefile">src/app/authoring-tool/edit-component-advanced/edit-component-advanced.component.html</context>
-          <context context-type="linenumber">111,113</context>
+          <context context-type="linenumber">109,111</context>
         </context-group>
       </trans-unit>
       <trans-unit id="b1fa4e5073c0229ba88f70784a0aa77615380bec" datatype="html">
@@ -873,14 +873,14 @@
         <source>Constraint</source>
         <context-group purpose="location">
           <context context-type="sourcefile">src/app/authoring-tool/edit-component-constraints/edit-component-constraints.component.html</context>
-          <context context-type="linenumber">21</context>
+          <context context-type="linenumber">18</context>
         </context-group>
       </trans-unit>
       <trans-unit id="52c6c4d683a29f54ae1d4aed4f460f698bd20cf2" datatype="html">
         <source>Delete Constraint</source>
         <context-group purpose="location">
           <context context-type="sourcefile">src/app/authoring-tool/edit-component-constraints/edit-component-constraints.component.html</context>
-          <context context-type="linenumber">26</context>
+          <context context-type="linenumber">23</context>
         </context-group>
         <context-group purpose="location">
           <context context-type="sourcefile">src/assets/wise5/authoringTool/node/advanced/constraint/node-advanced-constraint-authoring.component.html</context>