fix: truncate text on filter to x icon fits the parent div (#3941)

🔧 (index.tsx): improve layout of sidebarFilterComponent to display type in a more readable way

src/frontend/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">
+        <div className="flex flex-1">
-          {isInput ? "Input" : "Output"}: {type}
+          {isInput ? "Input" : "Output"}:{" "}
+          <div className="w-[5.7rem] flex-1 overflow-hidden truncate pl-1">
+            {type}
+          </div>
         </div>
       </div>
       <ShadTooltip