Merge pull request #11198 from maxunbearable/fix/3969-LwM2M-resource-title-read-only

Made title read only on LwM2M resources

ui-ngx/src/app/modules/home/pages/admin/resource/resources-library.component.html

@@ -58,7 +58,7 @@
       </mat-form-field>
       <mat-form-field class="mat-block" *ngIf="entityForm.get('resourceType').value !== resourceType.LWM2M_MODEL || !isAdd">
         <mat-label translate>resource.title</mat-label>
-        <input matInput formControlName="title" required>
+        <input matInput formControlName="title" required [readonly]="entityForm.get('resourceType').value === resourceType.LWM2M_MODEL">
         <mat-error *ngIf="entityForm.get('title').hasError('required')">
           {{ 'resource.title-required' | translate }}
         </mat-error>

ui-ngx/src/app/modules/home/pages/admin/resource/resources-library.component.ts

@@ -29,7 +29,7 @@ import {
   ResourceTypeMIMETypes,
   ResourceTypeTranslationMap
 } from '@shared/models/resource.models';
-import { filter, startWith, takeUntil } from 'rxjs/operators';
+import { startWith, takeUntil } from 'rxjs/operators';
 import { ActionNotificationShow } from '@core/notification/notification.actions';
 import { isDefinedAndNotNull } from '@core/utils';
 import { getCurrentAuthState } from '@core/auth/auth.selectors';
@@ -59,22 +59,9 @@ export class ResourcesLibraryComponent extends EntityComponent<Resource> impleme
 
   ngOnInit() {
     super.ngOnInit();
-    this.entityForm.get('resourceType').valueChanges.pipe(
-      startWith(ResourceType.JS_MODULE),
-      filter(() => this.isAdd),
-      takeUntil(this.destroy$)
-    ).subscribe((type) => {
-      if (type === this.resourceType.LWM2M_MODEL) {
-        this.entityForm.get('title').disable({emitEvent: false});
-        this.entityForm.patchValue({title: ''}, {emitEvent: false});
-      } else {
-        this.entityForm.get('title').enable({emitEvent: false});
-      }
-      this.entityForm.patchValue({
-        data: null,
-        fileName: null
-      }, {emitEvent: false});
-    });
+    if (this.isAdd) {
+      this.observeResourceTypeChange();
+    }
   }
 
   ngOnDestroy() {
@@ -153,4 +140,24 @@ export class ResourcesLibraryComponent extends EntityComponent<Resource> impleme
         horizontalPosition: 'right'
       }));
   }
+
+  private observeResourceTypeChange(): void {
+    this.entityForm.get('resourceType').valueChanges.pipe(
+      startWith(ResourceType.JS_MODULE),
+      takeUntil(this.destroy$)
+    ).subscribe((type: ResourceType) => this.onResourceTypeChange(type));
+  }
+
+  private onResourceTypeChange(type: ResourceType): void {
+    if (type === this.resourceType.LWM2M_MODEL) {
+      this.entityForm.get('title').disable({emitEvent: false});
+      this.entityForm.patchValue({title: ''}, {emitEvent: false});
+    } else {
+      this.entityForm.get('title').enable({emitEvent: false});
+    }
+    this.entityForm.patchValue({
+      data: null,
+      fileName: null
+    }, {emitEvent: false});
+  }
 }