From 2d47c1350322bc2f083c3cccfbd13fc024579b24 Mon Sep 17 00:00:00 2001
From: mpetrov <mpetrov@thingsboard.io>
Date: Thu, 13 Jun 2024 17:12:18 +0300
Subject: [PATCH] [PROD-3645] [FIX] changed to three dots with tooltip

---
 ...gateway-service-rpc-connector-templates.component.html | 2 +-
 ...gateway-service-rpc-connector-templates.component.scss | 8 +++++++-
 2 files changed, 8 insertions(+), 2 deletions(-)

diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-service-rpc-connector-templates.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-service-rpc-connector-templates.component.html
index b2e0e3f1c2..174d044a7b 100644
--- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-service-rpc-connector-templates.component.html
+++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-service-rpc-connector-templates.component.html
@@ -19,7 +19,7 @@
 <mat-expansion-panel hideToggle *ngFor="let template of rpcTemplates">
   <mat-expansion-panel-header>
     <mat-panel-title class="template-name">
-      {{template.name}}
+      <span matTooltip="{{template.name}}">{{template.name}}</span>
     </mat-panel-title>
     <mat-panel-description>
       <button mat-icon-button matTooltip="Delete" (click)="deleteTemplate($event, template)">
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-service-rpc-connector-templates.component.scss b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-service-rpc-connector-templates.component.scss
index 02c2348bca..7d21ab4e3f 100644
--- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-service-rpc-connector-templates.component.scss
+++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-service-rpc-connector-templates.component.scss
@@ -91,7 +91,13 @@
 
   .template-name {
     max-width: 170px;
-    overflow: scroll;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    display: block;
+  }
+
+  ::ng-deep .mat-content {
+    align-items: center;
   }
 
   ::ng-deep .mat-expansion-panel-header-title {