fix: truncate text on filter to x icon fits the parent div (langflow-…

…ai#3941) 🔧 (index.tsx): improve layout of sidebarFilterComponent to display type in a more readable way
headlinevc · Nov 26, 2024 · 376c4c2 · 376c4c2
1 parent d769f8d
commit 376c4c2
Showing 1 changed file with 5 additions and 2 deletions.
diff --git a/...tend/src/pages/FlowPage/components/extraSidebarComponent/sidebarFilterComponent/index.tsx b/...tend/src/pages/FlowPage/components/extraSidebarComponent/sidebarFilterComponent/index.tsx
@@ -18,8 +18,11 @@ export function SidebarFilterComponent({
           name="ListFilter"
           className="h-4 w-4 shrink-0 stroke-2"
         />
-        <div className="flex-1 overflow-hidden truncate">
-          {isInput ? "Input" : "Output"}: {type}
+        <div className="flex flex-1">
+          {isInput ? "Input" : "Output"}:{" "}
+          <div className="w-[5.7rem] flex-1 overflow-hidden truncate pl-1">
+            {type}
+          </div>
         </div>
       </div>
       <ShadTooltip