refactor(Authoring): Use component input binding

src/app/app.module.ts

@@ -62,6 +62,7 @@ export function initialize(
     RouterModule.forRoot([], {
       scrollPositionRestoration: 'enabled',
       anchorScrolling: 'enabled',
+      bindToComponentInputs: true,
       onSameUrlNavigation: 'reload'
     })
   ],

src/assets/wise5/authoringTool/node/advanced/node-advanced-authoring/node-advanced-authoring.component.ts

@@ -10,15 +10,13 @@ import { ActivatedRoute } from '@angular/router';
 export class NodeAdvancedAuthoringComponent implements OnInit {
   protected isGroupNode: boolean;
   protected nodeId: string;
-  protected projectId: number;
 
   constructor(private projectService: TeacherProjectService, private route: ActivatedRoute) {}
 
   ngOnInit(): void {
-    this.nodeId = this.route.snapshot.paramMap.get('nodeId');
     this.route.parent.params.subscribe((params) => {
-      this.projectId = Number(params.unitId);
+      this.nodeId = params.nodeId;
+      this.isGroupNode = this.projectService.getNode(this.nodeId).isGroup();
     });
-    this.isGroupNode = this.projectService.getNode(this.nodeId).isGroup();
   }
 }

src/assets/wise5/authoringTool/node/node-authoring/node-authoring.component.ts

@@ -1,4 +1,4 @@
-import { Component, OnInit } from '@angular/core';
+import { Component, Input, OnInit } from '@angular/core';
 import { Subscription, filter } from 'rxjs';
 import { TeacherDataService } from '../../../services/teacherDataService';
 import { TeacherProjectService } from '../../../services/teacherProjectService';
@@ -29,9 +29,8 @@ export class NodeAuthoringComponent implements OnInit {
   isGroupNode: boolean;
   node: Node;
   nodeJson: any;
-  nodeId: string;
+  @Input() nodeId?: string;
   nodePosition: any;
-  projectId: number;
   subscriptions: Subscription = new Subscription();
 
   constructor(
@@ -47,10 +46,6 @@ export class NodeAuthoringComponent implements OnInit {
   ) {}
 
   ngOnInit(): void {
-    this.nodeId = this.route.snapshot.paramMap.get('nodeId');
-    this.route.parent.params.subscribe((params) => {
-      this.projectId = Number(params.unitId);
-    });
     this.setup(this.nodeId);
     this.dataService.setCurrentNodeByNodeId(this.nodeId);
     this.subscribeToShowSubmitButtonValueChanges();
@@ -210,15 +205,13 @@ export class NodeAuthoringComponent implements OnInit {
   }
 
   protected chooseComponentLocation(action: string): void {
-    this.router.navigate(
-      ['/teacher/edit/unit', this.projectId, 'node', this.nodeId, 'choose-component-location'],
-      {
-        state: {
-          action: action,
-          selectedComponents: this.getSelectedComponents()
-        }
+    this.router.navigate(['choose-component-location'], {
+      relativeTo: this.route,
+      state: {
+        action: action,
+        selectedComponents: this.getSelectedComponents()
       }
-    );
+    });
   }
 
   protected copyComponent(event: any, component: ComponentContent): void {

src/assets/wise5/authoringTool/project-authoring-parent/project-authoring-parent.component.ts

@@ -1,18 +1,17 @@
-import { Component } from '@angular/core';
-import { ActivatedRoute } from '@angular/router';
+import { Component, Input } from '@angular/core';
 import { TeacherProjectService } from '../../services/teacherProjectService';
 
 @Component({
   templateUrl: './project-authoring-parent.component.html',
   styleUrls: ['./project-authoring-parent.component.scss']
 })
 export class ProjectAuthoringParentComponent {
-  protected projectId: number;
+  @Input('unitId') protected projectId?: number;
 
-  constructor(private projectService: TeacherProjectService, private route: ActivatedRoute) {}
+  constructor(private projectService: TeacherProjectService) {}
 
   ngOnInit(): void {
-    this.projectId = Number(this.route.snapshot.paramMap.get('unitId'));
+    this.projectId = Number(this.projectId);
     this.projectService.notifyAuthorProjectBegin(this.projectId);
     window.onbeforeunload = (event) => {
       this.projectService.notifyAuthorProjectEnd(this.projectId);

src/assets/wise5/authoringTool/project-authoring/project-authoring.component.ts

@@ -1,4 +1,4 @@
-import { Component } from '@angular/core';
+import { Component, Input } from '@angular/core';
 import { DeleteNodeService } from '../../services/deleteNodeService';
 import { TeacherProjectService } from '../../services/teacherProjectService';
 import { TeacherDataService } from '../../services/teacherDataService';
@@ -19,7 +19,7 @@ export class ProjectAuthoringComponent {
   private inactiveNodes: any[];
   protected inactiveStepNodes: any[];
   protected items: any;
-  protected projectId: number;
+  @Input('unitId') protected projectId?: number;
   protected stepNodeSelected: boolean = false;
   private subscriptions: Subscription = new Subscription();
 
@@ -32,7 +32,7 @@ export class ProjectAuthoringComponent {
   ) {}
 
   ngOnInit(): void {
-    this.projectId = Number(this.route.snapshot.paramMap.get('unitId'));
+    this.projectId = Number(this.projectId);
     this.refreshProject();
     this.dataService.setCurrentNode(null);
     this.temporarilyHighlightNewNodes(history.state.newNodes);

src/assets/wise5/authoringTool/recovery-authoring/recovery-authoring.component.ts

@@ -1,10 +1,9 @@
-import { Component, OnInit } from '@angular/core';
+import { Component, Input, OnInit } from '@angular/core';
 import { Subscription } from 'rxjs';
 import { NotificationService } from '../../services/notificationService';
 import { TeacherProjectService } from '../../services/teacherProjectService';
 import { NodeRecoveryAnalysis } from '../../../../app/domain/nodeRecoveryAnalysis';
 import { isValidJSONString } from '../../common/string/string';
-import { ActivatedRoute } from '@angular/router';
 
 @Component({
   selector: 'recovery-authoring',
@@ -18,16 +17,14 @@ export class RecoveryAuthoringComponent implements OnInit {
   projectJSONString: string;
   saveButtonEnabled: boolean = false;
   private subscriptions: Subscription = new Subscription();
-  protected unitId: string;
+  @Input() protected unitId?: string;
 
   constructor(
-    private route: ActivatedRoute,
     private notificationService: NotificationService,
     private projectService: TeacherProjectService
   ) {}
 
   ngOnInit(): void {
-    this.unitId = this.route.snapshot.paramMap.get('unitId');
     this.projectJSONString = JSON.stringify(this.projectService.project, null, 4);
     this.checkProjectJSONValidity();
     this.subscribeToGlobalMessage();

src/messages.xlf

@@ -11567,15 +11567,15 @@ Click &quot;Cancel&quot; to keep the invalid JSON open so you can fix it.</sourc
 </source>
         <context-group purpose="location">
           <context context-type="sourcefile">src/assets/wise5/authoringTool/node/node-authoring/node-authoring.component.ts</context>
-          <context context-type="linenumber">258</context>
+          <context context-type="linenumber">251</context>
         </context-group>
       </trans-unit>
       <trans-unit id="5170405945214763287" datatype="html">
         <source>Are you sure you want to delete these components?
 </source>
         <context-group purpose="location">
           <context context-type="sourcefile">src/assets/wise5/authoringTool/node/node-authoring/node-authoring.component.ts</context>
-          <context context-type="linenumber">259</context>
+          <context context-type="linenumber">252</context>
         </context-group>
       </trans-unit>
       <trans-unit id="bb39841df2c03f771748c1f986e615bffa7f2593" datatype="html">