Add Debug card in configuration

Fixed slave: stateTopic Button (clipboard)

Author: volkmarnissen

src/app/configure/configure.component.html

@@ -66,8 +66,9 @@
       </form>
 
     </mat-card>
+    <div class="flexcols">
 
-    <mat-card class="width250pt card">
+    <mat-card class="width350pt card">
       <mat-card-header>
         <mat-card-title>Configure Github</mat-card-title>
       </mat-card-header>
@@ -79,5 +80,18 @@
 
       </mat-card-content>
     </mat-card>
+    <mat-card class="width350pt card">
+      <mat-card-header>
+        <mat-card-title>Configure Debug</mat-card-title>
+      </mat-card-header>
+      <mat-card-content>
+        <mat-form-field class="width250pt">
+          <mat-label>Debug components</mat-label>
+          <input matInput [formControl]="debugComponentsFormControl" />
+        </mat-form-field>
+
+      </mat-card-content>
+    </mat-card>
+    </div>
   </div>
 </div>

src/app/configure/configure.component.ts

@@ -70,6 +70,7 @@ export class ConfigureComponent implements OnInit {
     private router: Router,
   ) {
     this.ghPersonalAccessToken = _formBuilder.control([""]);
+    this.debugComponentsFormControl = _formBuilder.control([""]);
   }
   private requiredInNonAddonScenario: ValidatorFn = (
     control: AbstractControl,
@@ -89,6 +90,7 @@ export class ConfigureComponent implements OnInit {
         !this.authStatus.hassiotoken) ||
       (this.configureMqttFormGroup.pristine &&
         this.ghPersonalAccessToken.pristine &&
+        this.debugComponentsFormControl.pristine &&
         this.discoveryLanguageFormControl.pristine)
     );
   }
@@ -107,6 +109,7 @@ export class ConfigureComponent implements OnInit {
     mqttcafile: [null as string | null],
   });
   ghPersonalAccessToken: FormControl;
+  debugComponentsFormControl: FormControl;
   discoveryLanguageFormControl = new FormControl<string | null>(null);
   connectMessage: string = "";
   ngOnInit(): void {
@@ -132,6 +135,12 @@ export class ConfigureComponent implements OnInit {
           config.mqttdiscoverylanguage,
         );
       }
+      if (config.debugComponents) {
+        this.debugComponentsFormControl!.setValue(
+          config.debugComponents
+        );
+      }
+
       this.entityApiService.getSslFiles().subscribe((rc) => {
         this.sslFiles = rc;
       });
@@ -196,7 +205,12 @@ export class ConfigureComponent implements OnInit {
       this.ghPersonalAccessToken &&
       this.ghPersonalAccessToken.value.length > 0
     )
-      this.config.githubPersonalToken = this.ghPersonalAccessToken.value;
+    this.config.githubPersonalToken = this.ghPersonalAccessToken.value;
+    if (
+      this.debugComponentsFormControl &&
+      this.debugComponentsFormControl.value.length > 0
+    )
+    this.config.debugComponents = this.debugComponentsFormControl.value;
     this.entityApiService.postConfiguration(this.config).subscribe(() => {
       this.close();
     });

src/app/select-slave/select-slave.component.html

@@ -134,7 +134,7 @@ <h2>State Topic</h2>
 
                     <div>
                       {{ getStateTopic(uislave) }}<button mat-icon-button mat-small-icon-button class="material-icons app-toolbar-menu save-button"
-                      matTooltip="Copy to Clipboard" (click)="copy2Clipboard(uislave.stateTopic!)" color="primary">
+                      matTooltip="Copy to Clipboard" (click)="copy2Clipboard(getStateTopic(uislave) )" color="primary">
                       <mat-icon>content_copy</mat-icon>
                     </button>
                     </div>