From 8e11d04a86fb6c87a825e1c54b8a92e8759d59ed Mon Sep 17 00:00:00 2001
From: mpetrov <mpetrov@thingsboard.io>
Date: Thu, 13 Jun 2024 16:24:49 +0300
Subject: [PATCH] [PROD-3645] [FIX] Added max width to the display of the
 template name

---
 ...y-service-rpc-connector-templates.component.html |  2 +-
 ...y-service-rpc-connector-templates.component.scss | 13 +++++++++++++
 2 files changed, 14 insertions(+), 1 deletion(-)

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 c0f6997a36..b2e0e3f1c2 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
@@ -18,7 +18,7 @@
 <div class="mat-subtitle-1 title">{{ 'gateway.rpc.templates-title' | translate }}</div>
 <mat-expansion-panel hideToggle *ngFor="let template of rpcTemplates">
   <mat-expansion-panel-header>
-    <mat-panel-title>
+    <mat-panel-title class="template-name">
       {{template.name}}
     </mat-panel-title>
     <mat-panel-description>
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 7e5c4af1f1..02c2348bca 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
@@ -89,6 +89,19 @@
     }
   }
 
+  .template-name {
+    max-width: 170px;
+    overflow: scroll;
+  }
+
+  ::ng-deep .mat-expansion-panel-header-title {
+    flex: 1;
+    margin: 0;
+  }
+
+  ::ng-deep .mat-expansion-panel-header-description {
+    flex: 0;
+  }
 }