add basic support for adding processors to routes

src/app/route/route.component.ts

@@ -1,15 +1,24 @@
-import { Component, inject, input, model, output } from '@angular/core';
+import { Component, computed, inject, input, model, output } from '@angular/core';
 import { FormControl, FormGroup, ReactiveFormsModule, Validators } from '@angular/forms';
 import { MatFormFieldModule } from '@angular/material/form-field';
 import { MatIconModule } from '@angular/material/icon';
 import { MatMenuModule } from '@angular/material/menu';
-import { RouteConfiguration } from '../../models/config.models';
+import { ProcessorConfiguration, RouteConfiguration } from '../../models/config.models';
 import { SchemaService } from '../../services/schema.service';
 import { JsonPipe } from '@angular/common';
+import { ProcessorComponent } from '../processor/processor.component';
+import { MatSnackBar } from '@angular/material/snack-bar';
 
 @Component({
   selector: 'app-route',
-  imports: [MatFormFieldModule, MatIconModule, ReactiveFormsModule, MatMenuModule, JsonPipe],
+  imports: [
+    MatFormFieldModule,
+    MatIconModule,
+    ReactiveFormsModule,
+    MatMenuModule,
+    JsonPipe,
+    ProcessorComponent,
+  ],
   templateUrl: './route.component.html',
   styleUrl: './route.component.css',
 })
@@ -19,12 +28,21 @@ export class RouteComponent {
   moduleIds = input<string[]>([]);
   delete = output<void>();
 
+  processors = computed(() => {
+    const route = this.route();
+    if (route) {
+      return route.processors;
+    }
+    return [];
+  });
+
   formGroup: FormGroup = new FormGroup({
     input: new FormControl('', [Validators.required]),
     output: new FormControl('', [Validators.required]),
   });
 
-  private schemaService = inject(SchemaService);
+  public schemaService = inject(SchemaService);
+  private snackBar = inject(MatSnackBar);
 
   ngOnInit(): void {
     this.formGroup.patchValue({
@@ -55,4 +73,53 @@ export class RouteComponent {
     }
     return false;
   }
+
+  addProcessor(processorType: string) {
+    const processorTemplate = this.schemaService.getSkeletonForProcessor(processorType);
+    this.route.update((route) => {
+      if (route) {
+        if (!route.processors) {
+          route.processors = [];
+        }
+        route.processors?.push(processorTemplate);
+        return {
+          ...route,
+          processors: route.processors,
+        };
+      }
+      return route;
+    });
+  }
+
+  processorUpdated(index: number, processor: ProcessorConfiguration | undefined) {
+    if (processor === undefined) {
+      console.error('processor is undefined, not updating');
+      return;
+    }
+    this.route.update((route) => {
+      if (route && route.processors) {
+        return {
+          ...route,
+          processors: route.processors,
+        };
+      }
+      return route;
+    });
+  }
+
+  deleteProcessor(index: number) {
+    this.route.update((route) => {
+      if (route && route.processors) {
+        route?.processors?.splice(index, 1);
+        return {
+          ...route,
+          processors: route.processors,
+        };
+      }
+      return route;
+    });
+    this.snackBar.open('Processor Removed', 'Dismiss', {
+      duration: 3000,
+    });
+  }
 }