[ACS-5551] updated checks for non -editable field

lib/content-services/src/lib/content-metadata/components/content-metadata/content-metadata.component.scss

@@ -30,12 +30,6 @@
             margin: 24px;
         }
 
-        .mat-expansion-panel-body {
-            align-items: center;
-            justify-content: center;
-            font-size: 15px;
-        }
-
         .adf-mat-divider {
             margin-left: -24px;
             margin-right: -24px;

lib/content-services/src/lib/tag/tags-creator/tags-creator.component.scss

@@ -88,6 +88,7 @@ adf-tags-creator {
         overflow-wrap: anywhere;
         display: inline-block;
         padding-right: 12px;
+        overflow: auto;
         max-height: 7vh;
     }
 

lib/core/src/lib/card-view/components/card-view-dateitem/card-view-dateitem.component.html

@@ -1,12 +1,12 @@
 <label class="adf-property-label"
      [attr.data-automation-id]="'card-dateitem-label-' + property.key"
-     [ngClass]="{'adf-property-label-not-editable' : !isEditable() && editable}"
+     [ngClass]="{'adf-property-label-not-editable' : nonEditableField}"
      *ngIf="showProperty() || isEditable()"
      [attr.for]="'card-view-dateitem-' + property.key">
     {{ property.label | translate }}
 </label>
 <div class="adf-property-value adf-property-value-padding-top"
-    [ngClass]="{'adf-property-dateitem-edit-mode' : editable, 'adf-property-label-not-editable' : !isEditable() && editable}">
+    [ngClass]="{'adf-property-dateitem-edit-mode' : editable, 'adf-property-label-not-editable' : nonEditableField}">
     <span *ngIf="!isEditable() && !property.multivalued"
           [attr.data-automation-id]="'card-' + property.type + '-value-' + property.key">
         <span *ngIf="showProperty()"
@@ -100,4 +100,4 @@
         </mat-form-field>
     </div>
 </div>
-<mat-divider *ngIf="showProperty() && !editable"></mat-divider>
+<mat-divider *ngIf="showDivider"></mat-divider>

lib/core/src/lib/card-view/components/card-view-dateitem/card-view-dateitem.component.ts

@@ -154,4 +154,12 @@ export class CardViewDateItemComponent extends BaseCardView<CardViewDateItemMode
     update() {
         this.cardViewUpdateService.update({ ...this.property } as CardViewDateItemModel, this.property.value);
     }
+
+    get showDivider(): boolean {
+        return !this.editable && this.showProperty();
+    }
+
+    get nonEditableField(): boolean {
+        return this.editable && !this.property.editable;
+    }
 }

lib/core/src/lib/card-view/components/card-view-selectitem/card-view-selectitem.component.html

@@ -2,7 +2,7 @@
     <div
         [attr.data-automation-id]="'card-select-label-' + property.key"
         class="adf-property-label"
-        [ngClass]="{'adf-property-label-not-editable' : !isEditable() && editable}"
+        [ngClass]="{'adf-property-label-not-editable' : nonEditableField}"
     >{{ property.label | translate }}</div>
     <div class="adf-property-field">
         <div
@@ -16,7 +16,7 @@
                 <mat-select
                     [(value)]="value"
                     panelClass="adf-select-filter"
-                    [ngClass]="{'adf-property-select-edit-mode' : isEditable(),'adf-property-normal-mode':!isEditable(),'adf-property-label-not-editable' : !isEditable() && editable}"
+                    [ngClass]="{'adf-property-select-edit-mode' : isEditable(),'adf-property-normal-mode':!isEditable(),'adf-property-label-not-editable' : nonEditableField}"
                     (selectionChange)="onChange($event)"
                     data-automation-class="select-box"
                     [aria-label]="property.label | translate"

lib/core/src/lib/card-view/components/card-view-selectitem/card-view-selectitem.component.ts

@@ -109,4 +109,8 @@ export class CardViewSelectItemComponent extends BaseCardView<CardViewSelectItem
     private get optionsLimit(): number {
         return this.appConfig.get<number>('content-metadata.selectFilterLimit', CardViewSelectItemComponent.HIDE_FILTER_LIMIT);
     }
+
+    get nonEditableField(): boolean {
+        return this.editable && !this.property.editable;
+    }
 }

lib/core/src/lib/card-view/components/card-view-textitem/card-view-textitem.component.html

@@ -5,13 +5,13 @@
             [floatLabel]="'always'"
             appearance="standard">
             <mat-label *ngIf="showProperty || isEditable" [attr.data-automation-id]="'card-textitem-label-' + property.key" class="adf-property-label"
-                [ngClass]="{'adf-property-label-not-editable' : !isEditable && editable}">
+                [ngClass]="{'adf-property-label-not-editable' : nonEditableField}">
                 {{ property.label | translate }}
             </mat-label>
                 <input matInput
                     *ngIf="!property.multiline"
                     class="adf-property-value"
-                    [ngClass]="{'adf-property-edit-mode' : editable,'adf-property-normal-mode':!editable, 'adf-property-label-not-editable' : !isEditable && editable}"
+                    [ngClass]="{'adf-property-edit-mode' : editable,'adf-property-normal-mode':!editable, 'adf-property-label-not-editable' : nonEditableField}"
                     title="{{property.label | translate }}"
                     [placeholder]="property.default"
                     [attr.aria-label]="property.label | translate"
@@ -29,7 +29,7 @@
                     [cdkAutosizeMaxRows]="1"
                     [cdkAutosizeMaxRows]="5"
                     class="adf-property-value"
-                    [ngClass]="{'adf-property-edit-mode' : editable,'adf-property-normal-mode':!editable, 'adf-property-label-not-editable' : !isEditable && editable}"
+                    [ngClass]="{'adf-property-edit-mode' : editable,'adf-property-normal-mode':!editable, 'adf-property-label-not-editable' : nonEditableField}"
                     [placeholder]="property.default"
                     [attr.aria-label]="property.label | translate"
                     [formControl]="textInput"
@@ -43,7 +43,7 @@
     <div *ngSwitchCase="'chipsTemplate'"
          class="adf-property-field adf-textitem-chip-list-container">
         <mat-label *ngIf="showLabelForChips" [attr.data-automation-id]="'card-textitem-label-' + property.key" class="adf-property-label"
-            [ngClass]="{'adf-property-label-not-editable' : !isEditable && editable}">
+            [ngClass]="{'adf-property-label-not-editable' : nonEditableField}">
             {{ property.label | translate }}
         </mat-label>
         <mat-chip-list #chipList
@@ -63,7 +63,7 @@
             [floatLabel]="'never'">
             <input matInput
                 class="adf-property-value"
-                [ngClass]="{'adf-property-edit-mode' : editable,'adf-property-normal-mode':!editable, 'adf-property-label-not-editable' : !isEditable && editable}"
+                [ngClass]="{'adf-property-edit-mode' : editable,'adf-property-normal-mode':!editable, 'adf-property-label-not-editable' : nonEditableField}"
                 title="{{property.label | translate }}"
                 [placeholder]="editedValue ? '' : property.default | translate"
                 [attr.aria-label]="property.label | translate"
@@ -72,7 +72,7 @@
                 (matChipInputTokenEnd)="addValueToList($event)"
                 [attr.data-automation-id]="'card-textitem-editchipinput-' + property.key">
         </mat-form-field>
-        <mat-divider *ngIf="showProperty && !editable"></mat-divider>
+        <mat-divider *ngIf="showDivider"></mat-divider>
     </div>
 
     <div *ngSwitchCase="'clickableTemplate'"
@@ -84,14 +84,14 @@
         <mat-form-field class="adf-property-field adf-card-textitem-field" appearance="standard"
             [floatLabel]="'never'">
             <mat-label *ngIf="showProperty || isEditable" [attr.data-automation-id]="'card-textitem-label-' + property.key" class="adf-property-label"
-                [ngClass]="{'adf-property-label-not-editable' : !isEditable && editable}">
+                [ngClass]="{'adf-property-label-not-editable' : nonEditableField}">
                 {{ property.label | translate }}
             </mat-label>
             <input matInput
                 [type]=property.inputType
                 class="adf-property-value"
                 title="{{property.label | translate }}"
-                [ngClass]="{ 'adf-textitem-clickable-value': !isEditable,'adf-property-edit-mode' : editable,'adf-property-normal-mode':!editable, 'adf-property-label-not-editable' : !isEditable && editable }"
+                [ngClass]="{'adf-textitem-clickable-value': !isEditable,'adf-property-edit-mode' : editable,'adf-property-normal-mode':!editable, 'adf-property-label-not-editable' : nonEditableField}"
                 [placeholder]="property.default"
                 [attr.aria-label]="property.label | translate"
                 [(ngModel)]="editedValue"

lib/core/src/lib/card-view/components/card-view-textitem/card-view-textitem.component.ts

@@ -232,4 +232,12 @@ export class CardViewTextItemComponent extends BaseCardView<CardViewTextItemMode
     get showLabelForChips(): boolean {
         return this.displayLabelForChips;
     }
+
+    get showDivider(): boolean {
+        return !this.editable && this.showProperty;
+    }
+
+    get nonEditableField(): boolean {
+        return this.editable && !this.property.editable;
+    }
 }

lib/core/src/lib/i18n/en.json

@@ -569,8 +569,5 @@
   "ADF_DROPDOWN": {
     "LOADING": "Loading...",
     "SELECTION_ARIA_LABEL": "{{placeholder}} combobox {{selectedOption}}"
-  },
-  "INFO_DRAWER": {
-    "ICON": "Node Icon"
   }
 }

lib/core/src/lib/info-drawer/info-drawer.component.html

@@ -1,5 +1,5 @@
 <adf-info-drawer-layout [showHeader]="showHeader">
-    <img class="adf-info-drawer-icon" *ngIf="nodeIcon" alt="{{ 'INFO_DRAWER.ICON' | translate }}" src="{{ nodeIcon }}" info-drawer-node-icon>
+    <img class="adf-info-drawer-icon" *ngIf="nodeIcon" src="{{ nodeIcon }}" info-drawer-node-icon>
 
     <div role="heading" aria-level="1" *ngIf="title" info-drawer-title>{{ title | translate }}</div>
     <ng-content *ngIf="!title" info-drawer-title select="[info-drawer-title]"></ng-content>