From 278124746c1b988bf028bf0232e27b51abf3fa9c Mon Sep 17 00:00:00 2001
From: rusikv <rvasylkiv@thingsboard.io>
Date: Fri, 13 Sep 2024 11:41:01 +0300
Subject: [PATCH] UI: fixed country autocomplete and zip error message

---
 ui-ngx/src/app/shared/components/contact.component.html   | 8 ++++----
 .../shared/components/country-autocomplete.component.ts   | 2 +-
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/ui-ngx/src/app/shared/components/contact.component.html b/ui-ngx/src/app/shared/components/contact.component.html
index 0f4038abe9..bf77d4f01c 100644
--- a/ui-ngx/src/app/shared/components/contact.component.html
+++ b/ui-ngx/src/app/shared/components/contact.component.html
@@ -20,22 +20,22 @@
     formControlName="country"
     (selectCountryCode)="changeCountry($event)">
   </tb-country-autocomplete>
-  <div fxLayout.gt-sm="row" fxLayoutGap.gt-sm="10px">
-    <mat-form-field class="mat-block">
+  <div class="tb-form-row column-xs tb-standard-fields no-border no-padding">
+    <mat-form-field class="flex">
       <mat-label translate>contact.city</mat-label>
       <input matInput formControlName="city">
       <mat-error *ngIf="parentForm.get('city').hasError('maxlength')">
         {{ 'contact.city-max-length' | translate }}
       </mat-error>
     </mat-form-field>
-    <mat-form-field class="mat-block">
+    <mat-form-field class="flex">
       <mat-label translate>contact.state</mat-label>
       <input matInput formControlName="state">
       <mat-error *ngIf="parentForm.get('state').hasError('maxlength')">
         {{ 'contact.state-max-length' | translate }}
       </mat-error>
     </mat-form-field>
-    <mat-form-field class="mat-block">
+    <mat-form-field class="flex">
       <mat-label translate>contact.postal-code</mat-label>
       <input matInput formControlName="zip">
       <mat-error *ngIf="parentForm.get('zip').hasError('pattern')">
diff --git a/ui-ngx/src/app/shared/components/country-autocomplete.component.ts b/ui-ngx/src/app/shared/components/country-autocomplete.component.ts
index 7fc3a10bca..95629496eb 100644
--- a/ui-ngx/src/app/shared/components/country-autocomplete.component.ts
+++ b/ui-ngx/src/app/shared/components/country-autocomplete.component.ts
@@ -200,7 +200,7 @@ export class CountryAutocompleteComponent implements OnInit, ControlValueAccesso
   private updateView(value: Country | null) {
     if (this.modelValue?.name !== value?.name) {
       this.modelValue = value;
-      this.propagateChange(this.modelValue);
+      this.propagateChange(this.modelValue?.name);
       if (value) {
         this.selectCountryCode.emit(value.iso2);
       }