next

ui/package.json

@@ -67,10 +67,12 @@
     "@angular/compiler-cli": "^14.3.0",
     "@angular/language-service": "^14.3.0",
     "@fortawesome/fontawesome-free": "^6.4.2",
+    "@types/emoji-js": "^3.5.2",
     "@types/node": "^18.18.9",
     "@types/qrcode": "^1.5.5",
     "@types/semver": "^7.5.5",
     "@types/socket.io-client": "^1.4.36",
+    "@types/uuid": "^9.0.7",
     "@typescript-eslint/eslint-plugin": "^5.62.0",
     "@typescript-eslint/parser": "^5.62.0",
     "codelyzer": "^6.0.2",

ui/src/app/core/directives/plugins.markdown.directive.ts

@@ -13,7 +13,7 @@ export class PluginsMarkdownDirective implements OnInit {
   ngOnInit() {
     // ensure third party links open in a new window without a referrer
     const links = this.el.nativeElement.querySelectorAll('a');
-    links.forEach((a) => {
+    links.forEach((a: any) => {
       a.target = '_blank';
       a.rel = 'noopener noreferrer';
     });

ui/src/app/core/manage-plugins/bridge-plugins-modal/bridge-plugins-modal.component.ts

@@ -13,8 +13,8 @@ import { NotificationService } from '@/app/core/notification.service';
   styleUrls: ['./bridge-plugins-modal.component.scss'],
 })
 export class BridgePluginsModalComponent implements OnInit {
-  @Input() plugin;
-  @Input() schema;
+  @Input() plugin: any;
+  @Input() schema: any;
 
   public canConfigure = true;
   public configBlocks: any[] = [];
@@ -50,13 +50,13 @@ export class BridgePluginsModalComponent implements OnInit {
           }
         }
       },
-      (err) => {
+      () => {
         this.canConfigure = false;
       },
     );
   }
 
-  async toggleExternalBridge(block, enable: boolean, index: number) {
+  async toggleExternalBridge(block: any, enable: boolean, index: number) {
     if (!enable) {
       delete block._bridge;
       return;
@@ -68,7 +68,7 @@ export class BridgePluginsModalComponent implements OnInit {
     };
 
     this.usernameCache.set(index, block._bridge.username);
-    this.getDeviceInfo(block._bridge.username);
+    await this.getDeviceInfo(block._bridge.username);
   }
 
   async getUnusedPort() {

ui/src/app/core/manage-plugins/node-update-required-modal/node-update-required-modal.component.ts

@@ -1,6 +1,6 @@
 import { Component, OnInit, Input } from '@angular/core';
-import { NgbModal, NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
-import { minVersion } from 'semver';
+import {  NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
+import { minVersion, SemVer } from 'semver';
 
 import { SettingsService } from '@/app/core/settings.service';
 
@@ -10,10 +10,10 @@ import { SettingsService } from '@/app/core/settings.service';
   styleUrls: ['./node-update-required-modal.component.scss'],
 })
 export class NodeUpdateRequiredModalComponent implements OnInit {
-  @Input() plugin;
+  @Input() plugin: any;
 
-  public minVersion;
-  public installedVersion;
+  public minVersion: SemVer;
+  public installedVersion: string;
 
   constructor(
     public activeModal: NgbActiveModal,
@@ -24,5 +24,4 @@ export class NodeUpdateRequiredModalComponent implements OnInit {
     this.minVersion = minVersion(this.plugin.engines.node);
     this.installedVersion = this.$settings.env.nodeVersion;
   }
-
 }

ui/src/app/core/manage-plugins/select-previous-version/select-previous-version.component.ts

@@ -11,7 +11,7 @@ import { TranslateService } from '@ngx-translate/core';
   styleUrls: ['./select-previous-version.component.scss'],
 })
 export class SelectPreviousVersionComponent implements OnInit {
-  @Input() plugin;
+  @Input() plugin: any;
 
   public loading = true;
   public versions: Array<{ name: string; version: string }> = [];
@@ -37,7 +37,7 @@ export class SelectPreviousVersionComponent implements OnInit {
           tagVersions[result.tags[key]] = key;
         }
 
-        const versions = result.versions.filter(x => tagVersions[x] || !x.includes('-')).reverse();
+        const versions = result.versions.filter((x: any) => tagVersions[x] || !x.includes('-')).reverse();
 
         for (const version of versions.slice(0, 20)) {
           this.versions.push({

ui/src/app/core/manage-plugins/settings-plugins-modal/settings-plugins-modal.component.html

@@ -17,7 +17,7 @@ <h5 class="modal-title">
 
     <!-- MULTIPLE CONFIG BLOCKS-->
     <ngb-accordion [closeOthers]="true" *ngIf="pluginConfig.length && !schema.singular" [activeIds]="show"
-      (panelChange)="blockChanged($event)">
+      (panelChange)="blockChanged()">
       <ngb-panel [id]="block.__uuid__" *ngFor="let block of pluginConfig" opened="true">
         <ng-template ngbPanelHeader let-opened="opened">
           <div class="d-flex align-items-center justify-content-between">
@@ -57,15 +57,8 @@ <h5 class="m-0">{{ block.name }}</h5>
   </div>
   <div class="modal-footer justify-content-between">
     <div style="min-width: 25%;" class="text-left">
-      <button *ngIf="!schema.singular || pluginConfig.length === 0" type="button" class="btn btn-elegant"
-        data-dismiss="modal" (click)="addBlock()">
-        <i class="fa fa-fw fa-plus"></i> Add {{ schema.pluginType }}
-      </button>
-      <button *ngIf="plugin.name !== 'homebridge-config-ui-x' && schema.singular && pluginConfig.length > 0"
-        class="btn btn-danger ml-2" (click)="removeBlock(pluginConfig[0].__uuid__)"
-        [ngbTooltip]="'form.button_delete' | translate" container="body" openDelay="150">
-        <i class="fa fa-fw fa-trash"></i>
-      </button>
+      <button type="button" class="btn btn-elegant" data-dismiss="modal" (click)="activeModal.close('Cross click')"
+        [translate]="'form.button_cancel'">Cancel</button>
     </div>
 
     <div style="min-width: 25%;" class="d-none d-lg-block text-center">
@@ -78,8 +71,14 @@ <h5 class="m-0">{{ block.name }}</h5>
     </div>
 
     <div style="min-width: 25%;" class="text-right">
-      <button type="button" class="btn btn-elegant" data-dismiss="modal" (click)="activeModal.close('Cross click')"
-        [translate]="'form.button_cancel'">Cancel</button>
+      <button *ngIf="!schema.singular || pluginConfig.length === 0" type="button" class="btn btn-elegant" data-dismiss="modal" (click)="addBlock()">
+        Add {{ schema.pluginType }}
+      </button>
+      <button *ngIf="plugin.name !== 'homebridge-config-ui-x' && schema.singular && pluginConfig.length > 0"
+              class="btn btn-danger ml-2" (click)="removeBlock(pluginConfig[0].__uuid__)"
+              [ngbTooltip]="'form.button_delete' | translate" container="body" openDelay="150">
+        <i class="fa fa-fw fa-trash"></i>
+      </button>
       <button type="button" class="btn btn-primary" data-dismiss="modal" (click)="save()" [disabled]="saveInProgress">
         {{ 'form.button_save' | translate }} <i *ngIf="saveInProgress" class="fas fa-fw fa-spinner fa-pulse"></i>
       </button>

ui/src/app/core/manage-plugins/settings-plugins-modal/settings-plugins-modal.component.ts

@@ -78,35 +78,31 @@ export class SettingsPluginsModalComponent implements OnInit {
     );
   }
 
-  save() {
+  async save() {
     this.saveInProgress = true;
     const configBlocks = this.pluginConfig.map(x => x.config);
 
-    return this.$api.post(`/config-editor/plugin/${encodeURIComponent(this.plugin.name)}`, configBlocks)
-      .toPromise()
-      .then((done) => {
-        this.$toastr.success(
-          this.translate.instant('plugins.settings.toast_restart_required'),
-          this.translate.instant('plugins.settings.toast_plugin_config_saved'),
-        );
-
-        this.activeModal.close(configBlocks.length ? this.schema : null);
-        this.$notification.configUpdated.next(undefined);
-
-        // reload app settings if the config was changed for Homebridge Config UI X
-        if (this.plugin.name === 'homebridge-config-ui-x') {
-          this.$settings.getAppSettings().catch(/* do nothing */);
-        }
-      })
-      .catch(err => {
-        this.$toastr.error(
-          this.translate.instant('config.toast_failed_to_save_config') + ': ' + err.error?.message,
-          this.translate.instant('toast.title_error'),
-        );
-      })
-      .finally(() => {
-        this.saveInProgress = false;
-      });
+    try {
+      await this.$api.post(`/config-editor/plugin/${encodeURIComponent(this.plugin.name)}`, configBlocks)
+        .toPromise();
+      this.$toastr.success(
+        this.translate.instant('plugins.settings.toast_restart_required'),
+        this.translate.instant('plugins.settings.toast_plugin_config_saved'));
+
+      this.activeModal.close(configBlocks.length ? this.schema : null);
+      this.$notification.configUpdated.next(undefined);
+
+      // reload app settings if the config was changed for Homebridge Config UI X
+      if (this.plugin.name === 'homebridge-config-ui-x') {
+        this.$settings.getAppSettings().catch();
+      }
+    } catch (err) {
+      this.$toastr.error(
+        this.translate.instant('config.toast_failed_to_save_config') + ': ' + err.error?.message,
+        this.translate.instant('toast.title_error'));
+    } finally {
+      this.saveInProgress = false;
+    }
   }
 
   blockChanged() {
@@ -131,15 +127,15 @@ export class SettingsPluginsModalComponent implements OnInit {
     this.blockChanged();
   }
 
-  removeBlock(__uuid__) {
+  removeBlock(__uuid__: string) {
     const pluginConfigIndex = this.pluginConfig.findIndex(x => x.__uuid__ === __uuid__);
     this.pluginConfig.splice(pluginConfigIndex, 1);
   }
 
   /**
    * Homebridge Hue - ensure users object is preserved
    */
-  homebridgeHueFix(platform) {
+  homebridgeHueFix(platform: any) {
     this.schema.schema.properties.users = {
       type: 'object',
       properties: {},
@@ -155,5 +151,4 @@ export class SettingsPluginsModalComponent implements OnInit {
       };
     }
   }
-
 }

ui/src/app/core/manage-plugins/uninstall-plugins-modal/uninstall-plugins-modal.component.ts

@@ -12,8 +12,8 @@ import { ManagePluginsModalComponent } from '@/app/core/manage-plugins/manage-pl
   styleUrls: ['./uninstall-plugins-modal.component.scss'],
 })
 export class UninstallPluginsModalComponent implements OnInit {
-  @Input() plugin;
-  @Input() action;
+  @Input() plugin: any;
+  @Input() action: string;
 
   public loading = true;
   public removeConfig = true;