From 73805980aa1839c6421def111582c435c48f9752 Mon Sep 17 00:00:00 2001
From: Egbert Bouman <ebouman@gmail.com>
Date: Wed, 13 Nov 2024 10:29:54 +0100
Subject: [PATCH 1/2] Fix dealing with large swarm names

---
 src/tribler/ui/src/pages/Downloads/index.tsx | 3 +++
 src/tribler/ui/src/pages/Popular/index.tsx   | 2 +-
 src/tribler/ui/src/pages/Search/index.tsx    | 2 +-
 3 files changed, 5 insertions(+), 2 deletions(-)

diff --git a/src/tribler/ui/src/pages/Downloads/index.tsx b/src/tribler/ui/src/pages/Downloads/index.tsx
index d794189360..17a7fa48dd 100644
--- a/src/tribler/ui/src/pages/Downloads/index.tsx
+++ b/src/tribler/ui/src/pages/Downloads/index.tsx
@@ -54,6 +54,9 @@ const downloadColumns: ColumnDef<Download>[] = [
                 </Button>
             )
         },
+        cell: ({ row }) => {
+            return <span className="break-all line-clamp-1">{row.original.name}</span>
+        },
     },
     {
         accessorKey: "size",
diff --git a/src/tribler/ui/src/pages/Popular/index.tsx b/src/tribler/ui/src/pages/Popular/index.tsx
index 216a9c60ac..3a9d6eed11 100644
--- a/src/tribler/ui/src/pages/Popular/index.tsx
+++ b/src/tribler/ui/src/pages/Popular/index.tsx
@@ -32,7 +32,7 @@ const getColumns = ({ onDownload }: { onDownload: (torrent: Torrent) => void }):
         header: translateHeader('Name'),
         cell: ({ row }) => {
             return <span
-                className="inline-block cursor-pointer hover:underline line-clamp-1"
+                className="cursor-pointer hover:underline break-all line-clamp-1"
                 onClick={() => onDownload(row.original)}>
                 {row.original.name}
             </span>
diff --git a/src/tribler/ui/src/pages/Search/index.tsx b/src/tribler/ui/src/pages/Search/index.tsx
index 6d49060ecd..8d920ceccd 100644
--- a/src/tribler/ui/src/pages/Search/index.tsx
+++ b/src/tribler/ui/src/pages/Search/index.tsx
@@ -33,7 +33,7 @@ const getColumns = ({ onDownload }: { onDownload: (torrent: Torrent) => void }):
         header: "Name",
         cell: ({ row }) => {
             return <span
-                className="inline-block cursor-pointer hover:underline line-clamp-1"
+                className="cursor-pointer hover:underline break-all line-clamp-1"
                 onClick={() => onDownload(row.original)}>
                 {row.original.name}
             </span>

From 45e79867bb2bcfef4a9427b93db3a287d55f5cd6 Mon Sep 17 00:00:00 2001
From: Egbert Bouman <ebouman@gmail.com>
Date: Wed, 13 Nov 2024 11:22:43 +0100
Subject: [PATCH 2/2] Fix dealing with large file names

---
 src/tribler/ui/src/dialogs/SelectRemotePath.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/tribler/ui/src/dialogs/SelectRemotePath.tsx b/src/tribler/ui/src/dialogs/SelectRemotePath.tsx
index 3fb39aca85..36241b1f27 100644
--- a/src/tribler/ui/src/dialogs/SelectRemotePath.tsx
+++ b/src/tribler/ui/src/dialogs/SelectRemotePath.tsx
@@ -72,7 +72,7 @@ export default function SelectRemotePath(props: SelectRemotePathProps & JSX.Intr
                             >
                                 {item.dir && <Folder className="pr-2" />}
                                 {!item.dir && <FileIcon className="pr-2" />}
-                                {item.name}
+                                <span className="break-all line-clamp-1">{item.name}</span>
                             </div>
                         ))}
                     </div>