-working on implementation of station config

src/app/module/pages/home/station-config/station-config.component.html

+<section class="mt-3 rounded-xl">
+  <mat-tree class="rounded-xl mr-3" [dataSource]="dataSource" [treeControl]="treeControl">
+    <!-- This is the tree node template for leaf nodes -->
+    <mat-tree-node *matTreeNodeDef="let node" matTreeNodePadding>
+      <!-- use a disabled button to provide padding for tree leaf -->
+      <button mat-icon-button disabled></button>
+      {{node.name}}
+    </mat-tree-node>
+    <!-- This is the tree node template for expandable nodes -->
+    <mat-tree-node *matTreeNodeDef="let node;when: hasChild" matTreeNodePadding>
+      <button mat-icon-button matTreeNodeToggle
+              [attr.aria-label]="'Toggle ' + node.name">
+        <mat-icon class="mat-icon-rtl-mirror">
+          {{treeControl.isExpanded(node) ? 'expand_more' : 'chevron_right'}}
+        </mat-icon>
+      </button>
+      {{node.name}}
+    </mat-tree-node>
+  </mat-tree>
+</section>
+

src/app/module/pages/home/station-config/station-config.component.spec.ts

+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import {StationConfigComponent, TreeStation} from './station-config.component';
+import {
+  ClientControllerService,
+  HostControllerService, SensorControllerService, Station,
+  StationControllerService
+} from "../../../../../../projects/generated-api/src";
+import {MatTreeModule} from "@angular/material/tree";
+import {catchError} from "rxjs";
+
+
+describe('StationConfigComponent', () => {
+  let component: StationConfigComponent;
+  let fixture: ComponentFixture<StationConfigComponent>;
+  const station:Station={name:'Test Station'}
+  let treeStation: TreeStation;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports:[MatTreeModule],
+      declarations: [ StationConfigComponent ],
+      providers: [TreeStation],
+    })
+    treeStation = TestBed.inject(TreeStation);
+  });
+
+
+  it('some test',()=>{
+    expect(true).toEqual(true);
+  })
+
+  it('should create a TreeStation instance', () => {
+    expect(treeStation).toBeTruthy();
+  });
+
+  it('add Station', () => {
+    treeStation.addStation(station);
+   try {
+     console.log('getstaion',treeStation.getStation)
+   }
+   catch (e) {
+     console.log('error',e)
+   }
+
+    console.log('staionintern',station)
+    expect(treeStation.getStation()).toEqual(station);
+  });
+});
+
+

src/app/module/pages/home/station-config/station-config.component.ts

+import {Component,  OnInit} from '@angular/core';
+import {MatTreeFlatDataSource, MatTreeFlattener, MatTreeModule} from '@angular/material/tree';
+import {MatIconModule} from '@angular/material/icon';
+import {MatButtonModule} from '@angular/material/button';
+import {FlatTreeControl} from "@angular/cdk/tree";
+import {
+  Client,
+  ClientControllerService,
+  Host,
+  HostControllerService, SensorControllerService, Station,
+  StationControllerService
+} from "../../../../../../projects/generated-api/src";
+import {combineLatest, finalize, Observable, tap} from "rxjs";
+import {StationModel} from "../../admin/stationManagement/station/station.model";
+import {map} from "rxjs/operators";
+
+
+/**
+ * Food data with nested structure.
+ * Each node has a name and an optional list of children.
+ */
+
+
+const staiton: Station = {
+  name: 'Test Station',
+  host: 'Test Host',
+  clients: ['1','2','3'],
+
+}
+
+interface TreeNode {
+  name: string;
+
+  children?: TreeNode[];
+}
+
+enum NodeType {
+  Station = 'Station',
+  Host = 'Host',
+  Client = 'Client',
+  Sensor = 'Sensor',
+}
+
+interface DateTreeNode {
+  name: string;
+  type: NodeType;
+  children?: DateTreeNode[];
+}
+
+const TREE_DATA: TreeNode[] = [
+  {
+    name: 'Fruit',
+    children: [{name: 'Apple'}, {name: 'Banana'}, {name: 'Fruit loops'}],
+  },
+  {
+    name: 'Vegetables',
+    children: [
+      {
+        name: 'Green',
+        children: [
+          {
+            name: 'Fruit',
+            children: [{name: 'Apple'}, {name: 'Banana'}, {name: 'Fruit loops'}],
+          }
+          , {name: 'Brussels sprouts'}],
+      },
+      {
+        name: 'Orange',
+        children: [{name: 'Pumpkins'}, {name: 'Carrots'}],
+      },
+    ],
+  },
+];
+
+export class TreeStation {
+  private station?:Station={name:'Test '}
+  tree_Data: TreeNode={
+    name:  "UNDEFINED",
+    children: [],
+  };
+/*
+  constructor(station: Station) {
+    this.tree_Data = {
+      name: station.name ? station.name : "UNDEFINED",
+      children: [],
+    }
+  }*/
+
+  addStation(station:Station)
+  {
+    this.station=station;
+  }
+
+  getStation():Station{
+    console.log('getstaion',this.station)
+    //@ts-ignore
+    return this.station
+  }
+
+  addHost(host: Host) {
+    this.tree_Data.children?.push({
+      name: host.name ? host.name : "UNDEFINED",
+      children: [],
+    })
+  }
+
+  addClient(client: Client) {
+    if(this.tree_Data.children?.length==0){
+      throw new Error("No Hosts available");
+    }
+    this.tree_Data.children?.push({
+      name: client.name ? client.name : "UNDEFINED",
+      children: [],
+    })
+  }
+}
+
+export class TestTreeStation {
+  private tree_Data?: TreeNode;
+
+  constructor(station: Station) {
+    this.tree_Data = {
+      name: "UNDEFINED",
+      children: [],
+    }
+  }
+}
+/** Flat node with expandable and level information */
+interface ExampleFlatNode {
+  expandable: boolean;
+  name: string;
+  type?: string;
+  level: number;
+}
+@Component({
+  selector: 'app-station-config',
+  templateUrl: './station-config.component.html',
+  styleUrls: ['./station-config.component.css']
+})
+export class StationConfigComponent  implements OnInit{
+
+  private _transformer = (node: TreeNode, level: number) => {
+    return {
+      expandable: !!node.children && node.children.length > 0,
+      name: node.name,
+      level: level,
+    };
+  };
+
+  treeControl = new FlatTreeControl<ExampleFlatNode>(
+    node => node.level,
+    node => node.expandable,
+  );
+
+  treeFlattener = new MatTreeFlattener(
+    this._transformer,
+    node => node.level,
+    node => node.expandable,
+    node => node.children,
+  );
+
+  dataSource = new MatTreeFlatDataSource(this.treeControl, this.treeFlattener);
+
+  constructor(
+    public stationController: StationControllerService,
+    private hostController: HostControllerService,
+    private clientController: ClientControllerService,
+    private sensorController: SensorControllerService,
+  ) {
+    this.dataSource.data = TREE_DATA;
+  }
+
+  ngOnInit(): void {
+   // this.fetchData();
+    this.test()
+  }
+
+  test(){
+
+    let treeNode:DateTreeNode={
+      name:"root",
+      type:NodeType.Station,
+      children:[]
+    }
+
+    let returnNode=(name:string,type:NodeType):DateTreeNode=> {return {
+      name: name ? name : 'UNDEFINED',
+      type: type,
+      children: [],
+    }};
+    let returnMultiNode=(names:string[],type:NodeType):DateTreeNode[]=> {
+      return names.map(name=>returnNode(name,type))
+    }
+
+    let returnNodeMultiNode=(p_name:string,p_type:NodeType,c_names:string[],c_type:NodeType):DateTreeNode=> {return {
+      name: p_name ? p_name : 'UNDEFINED',
+      type: p_type,
+      children: returnMultiNode(c_names,c_type),
+    }};
+    let saveClients=(client_names:string[],treeNode:DateTreeNode)=>{
+      let data:DateTreeNode[]=[]
+      let clients:Observable<Client>[]= client_names.map(name=> this.clientController.getClientById(name))
+      combineLatest(clients).pipe(
+        tap(clients=>clients.forEach(client=>data.push(returnNodeMultiNode(client.name??"",NodeType.Client,client.sensors??[],NodeType.Sensor)))),
+        finalize(()=>console.log("finally got names",data))
+      ).subscribe()
+    }
+    saveClients(["ibk_c_id_1","ibk_c_id_2","ibk_c_id_3"],treeNode)
+
+
+  }
+
+
+  fetchData(){
+      console.log("fetching data")
+      let station:Station[]
+
+      let stationTree:DateTreeNode[]=[]
+
+      let returnNode=(name:string,type:NodeType):DateTreeNode=> {return {
+      name: name ? name : 'UNDEFINED',
+      type: type,
+      children: [],
+    }};
+
+      let callClients=(station_index:number,clients:string[])=>{
+        clients.forEach((client,client_index)=>this.clientController.getClientById(client).pipe(tap(
+          x=>{console.log("station ibk_c_id_1",x)
+                    stationTree.push(returnNode(x.name??"",NodeType.Client))
+                    stationTree.at(station_index)?.children?.at(client_index)?.children?.push(returnNode(x.name??"",NodeType.Sensor))
+          }
+        )).subscribe())
+    }
+
+
+
+      this.stationController.getAll().pipe(
+        tap(stations=>
+          stations.forEach(item=>stationTree.push({
+                              name:''+item.name,
+                              type:NodeType.Station,
+                              children:item.clients?.map(x=>returnNode(x,NodeType.Client))}))),
+        finalize(
+          ()=>{
+            console.log("stationTree",stationTree)
+            stationTree.forEach((station,staion_index)=>callClients(staion_index,station.children?.map(x=>x.name??"")??[]))
+          })
+      ).subscribe()
+
+
+      this.hostController.getAll1().pipe(tap(x=>console.log(x))).subscribe()
+      let clienName:string;
+      //clienName=stationTree.at(0)?.name??""
+      clienName=stationTree.at(0)?.children?.at(0)?.name??""
+      console.log("clienName",clienName)
+
+      this.clientController.getClientById("ibk_c_id_1").pipe(tap(x=>console.log("station ibk_c_id_1",x))).subscribe();
+
+      this.clientController.getAllClients().pipe(tap(x=>console.log("all clients",x))).subscribe();
+      this.sensorController.getAllSensors().pipe(tap(x=>console.log(x))).subscribe();
+  }
+
+  hasChild = (_: number, node: ExampleFlatNode) => node.expandable;
+}