User default lang/unitSystem improvements: add Auto lang (null), on save Profile do not overwrite lang if not set explicitly; delete props if null.

ui-ngx/src/app/modules/home/pages/profile/profile.component.html

@@ -58,12 +58,14 @@
                           [enableFlagsSelect]="true"
                           formControlName="phone">
           </tb-phone-input>
-          <mat-form-field class="mat-block">
+          <mat-form-field class="mat-block" floatLabel="always">
             <mat-label translate>language.language</mat-label>
-            <mat-select formControlName="language">
-              <mat-option *ngFor="let lang of languageList" [value]="lang">
-                {{ lang ? ('language.locales.' + lang | translate) : ''}}
-              </mat-option>
+            <mat-select formControlName="language"
+                        [placeholder]="'language.auto' | translate">
+              <mat-option [value]="null">{{ 'language.auto' | translate }}</mat-option>
+              @for(lang of languageList; track lang) {
+                <mat-option [value]="lang">{{ 'language.locales.' + lang | translate }}</mat-option>
+              }
             </mat-select>
           </mat-form-field>
           <mat-form-field class="mat-block" floatLabel="always">

ui-ngx/src/app/modules/home/pages/profile/profile.component.ts

@@ -25,7 +25,6 @@ import { UntypedFormBuilder, UntypedFormGroup, Validators } from '@angular/forms
 import { HasConfirmForm } from '@core/guards/confirm-on-exit.guard';
 import { ActionAuthUpdateUserDetails } from '@core/auth/auth.actions';
 import { environment as env } from '@env/environment';
-import { TranslateService } from '@ngx-translate/core';
 import { ActionSettingsChangeLanguage } from '@core/settings/settings.actions';
 import { ActivatedRoute } from '@angular/router';
 import { isDefinedAndNotNull, isNotEmptyStr } from '@core/utils';
@@ -52,7 +51,6 @@ export class ProfileComponent extends PageComponent implements OnInit, HasConfir
               private route: ActivatedRoute,
               private userService: UserService,
               private authService: AuthService,
-              private translate: TranslateService,
               private unitService: UnitService,
               private fb: UntypedFormBuilder) {
     super(store);
@@ -82,9 +80,13 @@ export class ProfileComponent extends PageComponent implements OnInit, HasConfir
     if (!this.user.additionalInfo) {
       this.user.additionalInfo = {};
     }
-    this.user.additionalInfo.lang = this.profile.get('language').value;
     this.user.additionalInfo.homeDashboardId = this.profile.get('homeDashboardId').value;
     this.user.additionalInfo.homeDashboardHideToolbar = this.profile.get('homeDashboardHideToolbar').value;
+    if (isNotEmptyStr(this.profile.get('language').value)) {
+      this.user.additionalInfo.lang = this.profile.get('language').value;
+    } else {
+      delete this.user.additionalInfo.lang;
+    }
     if (isNotEmptyStr(this.profile.get('unitSystem').value)) {
       this.user.additionalInfo.unitSystem = this.profile.get('unitSystem').value;
     } else {
@@ -105,7 +107,7 @@ export class ProfileComponent extends PageComponent implements OnInit, HasConfir
             id: user.id,
             lastName: user.lastName,
           } }));
-        this.store.dispatch(new ActionSettingsChangeLanguage({ userLang: user.additionalInfo.lang }));
+        this.store.dispatch(new ActionSettingsChangeLanguage({ userLang: user.additionalInfo.lang || env.defaultLang }));
         this.unitService.setUnitSystem(this.user.additionalInfo.unitSystem);
         this.authService.refreshJwtToken(false);
       }
@@ -115,7 +117,7 @@ export class ProfileComponent extends PageComponent implements OnInit, HasConfir
   private userLoaded(user: User) {
     this.user = user;
     this.profile.reset(user);
-    let lang;
+    let lang: string = null;
     let homeDashboardId;
     let homeDashboardHideToolbar = true;
     let unitSystem: UnitSystem = null;
@@ -131,9 +133,6 @@ export class ProfileComponent extends PageComponent implements OnInit, HasConfir
         unitSystem = user.additionalInfo.unitSystem;
       }
     }
-    if (!lang) {
-      lang = this.translate.currentLang;
-    }
     this.profile.get('language').setValue(lang);
     this.profile.get('unitSystem').setValue(unitSystem);
     this.profile.get('homeDashboardId').setValue(homeDashboardId);

ui-ngx/src/app/modules/home/pages/user/add-user-dialog.component.ts

@@ -84,6 +84,12 @@ export class AddUserDialogComponent extends DialogComponent<AddUserDialogCompone
       this.user.authority = this.data.authority;
       this.user.tenantId = new TenantId(this.data.tenantId);
       this.user.customerId = new CustomerId(this.data.customerId);
+      if (!this.user.additionalInfo.lang) {
+        delete this.user.additionalInfo.lang;
+      }
+      if (!this.user.additionalInfo.unitSystem) {
+        delete this.user.additionalInfo.unitSystem;
+      }
       const sendActivationEmail = this.activationMethod === ActivationMethod.SEND_ACTIVATION_MAIL;
       this.userService.saveUser(this.user, sendActivationEmail).subscribe(
         (user) => {

ui-ngx/src/app/modules/home/pages/user/user.component.html

@@ -99,12 +99,14 @@
                       formControlName="phone">
       </tb-phone-input>
       <div formGroupName="additionalInfo" class="flex flex-col">
-        <mat-form-field class="mat-block" appearance="outline">
+        <mat-form-field class="mat-block" floatLabel="always" appearance="outline">
           <mat-label translate>language.language</mat-label>
-          <mat-select formControlName="lang">
-            <mat-option *ngFor="let lang of languageList" [value]="lang">
-              {{ lang ? ('language.locales.' + lang | translate) : ''}}
-            </mat-option>
+          <mat-select formControlName="lang"
+                      [placeholder]="'language.auto' | translate">
+            <mat-option [value]="null">{{ 'language.auto' | translate }}</mat-option>
+            @for(lang of languageList; track lang) {
+              <mat-option [value]="lang">{{ 'language.locales.' + lang | translate }}</mat-option>
+            }
           </mat-select>
         </mat-form-field>
         <mat-form-field class="mat-block" floatLabel="always" appearance="outline">

ui-ngx/src/app/modules/home/pages/user/user.component.ts

@@ -101,7 +101,7 @@ export class UserComponent extends EntityComponent<User> {
     this.entityForm.patchValue({phone: entity.phone});
     this.entityForm.patchValue({additionalInfo: {description: entity.additionalInfo ? entity.additionalInfo.description : ''}});
     this.entityForm.patchValue({additionalInfo:
-        {lang: entity.additionalInfo ? entity.additionalInfo.lang : env.defaultLang}});
+        {lang: entity.additionalInfo ? entity.additionalInfo.lang : null}});
     this.entityForm.patchValue({additionalInfo:
         {unitSystem: entity.additionalInfo ? entity.additionalInfo.unitSystem : null}});
     this.entityForm.patchValue({additionalInfo:

ui-ngx/src/app/modules/home/pages/user/users-table-config.resolver.ts

@@ -158,6 +158,12 @@ export class UsersTableConfigResolver  {
     user.tenantId = new TenantId(this.tenantId);
     user.customerId = new CustomerId(this.customerId);
     user.authority = this.authority;
+    if (!user.additionalInfo.lang) {
+      delete user.additionalInfo.lang;
+    }
+    if (!user.additionalInfo.unitSystem) {
+      delete user.additionalInfo.unitSystem;
+    }
     return this.userService.saveUser(user);
   }
 

ui-ngx/src/assets/locale/locale.constant-en_US.json

@@ -9682,6 +9682,7 @@
         "items-per-page-separator": "of"
     },
     "language": {
+        "auto": "Auto",
         "language": "Language",
         "locales": {
             "ar_AE": "العربية (الإمارات العربية المتحدة)",