Merge pull request #13797 from ArtemDzhereleiko/AD/bug-fix/aliase-dialog

Add ellipsis to entity list and subtype list chip and fixed api usage state display value

ui-ngx/src/app/modules/home/components/alarm/alarm-filter-config.component.scss

@@ -13,6 +13,9 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
+
+@import '../scss/constants';
+
 :host {
   display: flex;
   max-width: 100%;
@@ -39,16 +42,12 @@
 
     tb-entity-subtype-list {
       flex: 1;
-      width: 180px;
+      @media #{$mat-gt-xs} {
+        width: 180px;
+      }
       .mdc-evolution-chip-set__chips {
         width: 100%;
       }
     }
-
-    .mat-mdc-chip {
-      .mdc-evolution-chip__cell, .mat-mdc-chip-action, .mat-mdc-chip-action-label {
-        overflow: hidden;
-      }
-    }
   }
 }

ui-ngx/src/app/modules/home/components/calculated-fields/components/arguments-table/calculated-field-arguments-table.component.html

@@ -80,7 +80,7 @@
           {{ 'entity.key' | translate }}
         </mat-header-cell>
         <mat-cell *matCellDef="let argument" class="w-1/4 xs:w-1/3">
-          <mat-chip>
+          <mat-chip class="tb-chip-row-ellipsis">
             <div tbTruncateWithTooltip class="key-text">{{ argument.refEntityKey.key }}</div>
           </mat-chip>
         </mat-cell>

ui-ngx/src/app/modules/home/components/calculated-fields/components/arguments-table/calculated-field-arguments-table.component.scss

@@ -55,12 +55,6 @@
 }
 
 :host ::ng-deep {
-  .mat-mdc-standard-chip {
-    .mdc-evolution-chip__cell--primary, .mdc-evolution-chip__action--primary, .mdc-evolution-chip__text-label {
-      overflow: hidden;
-    }
-  }
-
   .arguments-table:not(.arguments-table-with-error) {
     .mdc-data-table__row:last-child .mat-mdc-cell {
       border-bottom: none;

ui-ngx/src/app/modules/home/components/entity/entity-filter-view.component.ts

@@ -128,6 +128,9 @@ export class EntityFilterViewComponent implements ControlValueAccessor {
               {edgeTypes});
           }
           break;
+        case AliasFilterType.apiUsageState:
+          this.filterDisplayValue = this.translate.instant('alias.filter-type-apiUsageState');
+          break;
         case AliasFilterType.entityViewType:
           const entityViewTypesQuoted = [];
           this.filter.entityViewTypes.forEach((entityViewType) => {

ui-ngx/src/app/shared/components/entity/entity-list.component.html

@@ -25,6 +25,7 @@
   <mat-chip-grid #chipList formControlName="entities">
     <mat-chip-row
       *ngFor="let entity of entities"
+      class="tb-chip-row-ellipsis"
       [removable]="!disabled"
       (removed)="remove(entity)">
       {{entity.name}}

ui-ngx/src/app/shared/components/entity/entity-subtype-list.component.html

@@ -22,6 +22,7 @@
   <mat-chip-grid #chipList formControlName="entitySubtypeList">
     <mat-chip-row
       *ngFor="let entitySubtype of entitySubtypeList"
+      class="tb-chip-row-ellipsis"
       [removable]="!disabled"
       (removed)="remove(entitySubtype)">
       {{customTranslate(entitySubtype)}}

ui-ngx/src/app/shared/components/string-items-list.component.html

@@ -23,6 +23,7 @@
   <mat-label *ngIf="label">{{ label }}</mat-label>
   <mat-chip-grid #itemsChipList formControlName="items" [required]="required">
     <mat-chip-row *ngFor="let item of itemList"
+                  class="tb-chip-row-ellipsis"
                   [removable]="!disabled"
                   [contentEditable]="editable && !disabled"
                   (removed)="removeItems(item)">

ui-ngx/src/app/shared/components/string-items-list.component.scss

@@ -1,22 +0,0 @@
-/**
- * Copyright © 2016-2025 The Thingsboard Authors
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-.tb-string-items-list {
-  .mat-mdc-standard-chip {
-    .mdc-evolution-chip__cell--primary, .mat-mdc-chip-action-label {
-      overflow: hidden;
-    }
-  }
-}

ui-ngx/src/app/shared/components/string-items-list.component.ts

@@ -39,7 +39,7 @@ export interface StringItemsOption {
 @Component({
   selector: 'tb-string-items-list',
   templateUrl: './string-items-list.component.html',
-  styleUrls: ['./string-items-list.component.scss'],
+  styleUrls: [],
   providers: [
     {
       provide: NG_VALUE_ACCESSOR,

ui-ngx/src/styles.scss

@@ -1255,6 +1255,13 @@ pre.tb-highlight {
     }
   }
 
+  .tb-chip-row-ellipsis {
+    overflow: hidden;
+    .mdc-evolution-chip__cell--primary, .mdc-evolution-chip__action--primary, .mdc-evolution-chip__text-label {
+      overflow: hidden;
+    }
+  }
+
   @media #{$mat-lt-md} {
     .mat-mdc-form-field {
       .mat-mdc-form-field-infix {