From 6f9c47eaabc7068f3c08130f73c4eb7c5514838c Mon Sep 17 00:00:00 2001
From: Shuchang Zheng <wintonzheng0325@gmail.com>
Date: Wed, 2 Apr 2025 11:45:15 -0400
Subject: [PATCH] truncate parameter names that are too long (#2070)

Co-authored-by: Salih Altun <salih@skyvern.com>
---
 .../workflows/editor/panels/WorkflowParametersPanel.tsx   | 8 +++++---
 1 file changed, 5 insertions(+), 3 deletions(-)

diff --git a/skyvern-frontend/src/routes/workflows/editor/panels/WorkflowParametersPanel.tsx b/skyvern-frontend/src/routes/workflows/editor/panels/WorkflowParametersPanel.tsx
index 4101d798..b52015b4 100644
--- a/skyvern-frontend/src/routes/workflows/editor/panels/WorkflowParametersPanel.tsx
+++ b/skyvern-frontend/src/routes/workflows/editor/panels/WorkflowParametersPanel.tsx
@@ -129,10 +129,12 @@ function WorkflowParametersPanel() {
                 return (
                   <div
                     key={parameter.key}
-                    className="flex items-center justify-between rounded-md bg-slate-elevation1 px-3 py-2"
+                    className="flex items-center justify-between gap-2 rounded-md bg-slate-elevation1 px-3 py-2"
                   >
-                    <div className="flex items-center gap-4">
-                      <span className="text-sm">{parameter.key}</span>
+                    <div className="flex min-w-0 items-center gap-4">
+                      <span className="truncate text-sm" title={parameter.key}>
+                        {parameter.key}
+                      </span>
                       {parameter.parameterType === "workflow" ? (
                         <span className="text-sm text-slate-400">
                           {getLabelForWorkflowParameterType(parameter.dataType)}