Merge pull request #4602 from vvlladd28/improvement/firmware-autocomplete

UI: Improvement firmware autocomplete

ui-ngx/src/app/core/http/firmware.service.ts

@@ -22,7 +22,7 @@ import { Observable } from 'rxjs';
 import { PageData } from '@shared/models/page/page-data';
 import { ChecksumAlgorithm, Firmware, FirmwareInfo, FirmwareType } from '@shared/models/firmware.models';
 import { catchError, map, mergeMap } from 'rxjs/operators';
-import { deepClone, isDefinedAndNotNull } from '@core/utils';
+import { deepClone } from '@core/utils';
 
 @Injectable({
   providedIn: 'root'

ui-ngx/src/app/shared/components/entity/entity-autocomplete.component.ts

@@ -14,7 +14,17 @@
 /// limitations under the License.
 ///
 
-import { AfterViewInit, Component, ElementRef, forwardRef, Input, OnInit, ViewChild } from '@angular/core';
+import {
+  AfterViewInit,
+  Component,
+  ElementRef,
+  EventEmitter,
+  forwardRef,
+  Input,
+  OnInit,
+  Output,
+  ViewChild
+} from '@angular/core';
 import { ControlValueAccessor, FormBuilder, FormGroup, NG_VALUE_ACCESSOR } from '@angular/forms';
 import { Observable } from 'rxjs';
 import { map, mergeMap, share, tap } from 'rxjs/operators';
@@ -28,6 +38,7 @@ import { EntityService } from '@core/http/entity.service';
 import { coerceBooleanProperty } from '@angular/cdk/coercion';
 import { getCurrentAuthUser } from '@core/auth/auth.selectors';
 import { Authority } from '@shared/models/authority.enum';
+import { isEqual } from '@core/utils';
 
 @Component({
   selector: 'tb-entity-autocomplete',
@@ -43,7 +54,7 @@ export class EntityAutocompleteComponent implements ControlValueAccessor, OnInit
 
   selectEntityFormGroup: FormGroup;
 
-  modelValue: string | null;
+  modelValue: string | EntityId | null;
 
   entityTypeValue: EntityType | AliasEntityType;
 
@@ -95,6 +106,9 @@ export class EntityAutocompleteComponent implements ControlValueAccessor, OnInit
   @Input()
   disabled: boolean;
 
+  @Output()
+  entityChanged = new EventEmitter<BaseData<EntityId>>();
+
   @ViewChild('entityInput', {static: true}) entityInput: ElementRef;
 
   entityText: string;
@@ -135,7 +149,7 @@ export class EntityAutocompleteComponent implements ControlValueAccessor, OnInit
           } else {
             modelValue = value.id.id;
           }
-          this.updateView(modelValue);
+          this.updateView(modelValue, value);
           if (value === null) {
             this.clear();
           }
@@ -265,10 +279,12 @@ export class EntityAutocompleteComponent implements ControlValueAccessor, OnInit
           (entity) => {
             this.modelValue = entity.id.id;
             this.selectEntityFormGroup.get('entity').patchValue(entity, {emitEvent: false});
+            this.entityChanged.emit(entity);
           },
           () => {
             this.modelValue = null;
             this.selectEntityFormGroup.get('entity').patchValue('', {emitEvent: false});
+            this.entityChanged.emit(null);
             if (value !== null) {
               this.propagateChange(this.modelValue);
             }
@@ -280,10 +296,12 @@ export class EntityAutocompleteComponent implements ControlValueAccessor, OnInit
           (entity) => {
             this.modelValue = entity.id.id;
             this.selectEntityFormGroup.get('entity').patchValue(entity, {emitEvent: false});
+            this.entityChanged.emit(entity);
           },
           () => {
             this.modelValue = null;
             this.selectEntityFormGroup.get('entity').patchValue('', {emitEvent: false});
+            this.entityChanged.emit(null);
             if (value !== null) {
               this.propagateChange(this.modelValue);
             }
@@ -311,10 +329,11 @@ export class EntityAutocompleteComponent implements ControlValueAccessor, OnInit
     this.selectEntityFormGroup.get('entity').patchValue('', {emitEvent: false});
   }
 
-  updateView(value: string | null) {
-    if (this.modelValue !== value) {
+  updateView(value: string | EntityId | null, entity: BaseData<EntityId> | null) {
+    if (!isEqual(this.modelValue, value)) {
       this.modelValue = value;
       this.propagateChange(this.modelValue);
+      this.entityChanged.emit(entity);
     }
   }
 

ui-ngx/src/app/shared/components/firmware/firmware-autocomplete.component.ts

@@ -47,7 +47,7 @@ export class FirmwareAutocompleteComponent implements ControlValueAccessor, OnIn
 
   firmwareFormGroup: FormGroup;
 
-  modelValue: string | null;
+  modelValue: string | EntityId | null;
 
   @Input()
   type = FirmwareType.FIRMWARE;
@@ -182,8 +182,8 @@ export class FirmwareAutocompleteComponent implements ControlValueAccessor, OnIn
       if (firmwareId !== '') {
         this.entityService.getEntity(EntityType.FIRMWARE, firmwareId, {ignoreLoading: true, ignoreErrors: true}).subscribe(
           (entity) => {
-            this.modelValue = entity.id.id;
-            this.firmwareFormGroup.get('firmwareId').patchValue(entity);
+            this.modelValue = this.useFullEntityId ? entity.id : entity.id.id;
+            this.firmwareFormGroup.get('firmwareId').patchValue(entity, {emitEvent: false});
           },
           () => {
             this.modelValue = null;