Fix issues with large paths

Tribler · Nov 15, 2024 · 72a9516 · 72a9516
1 parent 0f5b172
commit 72a9516
Show file tree

Hide file tree

Showing 4 changed files with 5 additions and 5 deletions.
diff --git a/src/tribler/ui/src/dialogs/CreateTorrent.tsx b/src/tribler/ui/src/dialogs/CreateTorrent.tsx
@@ -27,7 +27,7 @@ const filenameColumns: ColumnDef<Filename>[] = [
         accessorKey: "path",
         header: "Filename",
         cell: ({ row }) => {
-            return <span className="line-clamp-1 text-xs">{row.original.path}</span>
+            return <span className="break-all line-clamp-1 text-xs">{row.original.path}</span>
         },
     },
 ]

diff --git a/src/tribler/ui/src/dialogs/SaveAs.tsx b/src/tribler/ui/src/dialogs/SaveAs.tsx
@@ -48,7 +48,7 @@ const getFileColumns = ({ onSelectedFiles }: { onSelectedFiles: (row: Row<FileTr
                                 : <ChevronRight size="16" color="#777"></ChevronRight>}
                         </button>
                     )}
-                    {row.original.name}
+                    <span className="break-all line-clamp-1">{row.original.name}</span>
                 </div>
             )
         }

diff --git a/src/tribler/ui/src/pages/Downloads/Details.tsx b/src/tribler/ui/src/pages/Downloads/Details.tsx
@@ -57,7 +57,7 @@ export default function DownloadDetails({ selectedDownloads }: { selectedDownloa
                         </div>
                         <div className="flex flex-row">
                             <div className="basis-1/4">{t('Name')}</div>
-                            <div className="basis-3/4">{download?.name}</div>
+                            <div className="basis-3/4 break-all line-clamp-1">{download?.name}</div>
                         </div>
                         <div className="flex flex-row">
                             <div className="basis-1/4">{t('Status')}</div>
@@ -77,7 +77,7 @@ export default function DownloadDetails({ selectedDownloads }: { selectedDownloa
                         </div>
                         <div className="flex flex-row">
                             <div className="basis-1/4">{t('Destination')}</div>
-                            <div className="basis-3/4">{download?.destination}</div>
+                            <div className="basis-3/4 break-all line-clamp-1">{download?.destination}</div>
                         </div>
                         <div className="flex flex-row">
                             <div className="basis-1/4">{t('Ratio')}</div>

diff --git a/src/tribler/ui/src/pages/Downloads/Files.tsx b/src/tribler/ui/src/pages/Downloads/Files.tsx
@@ -30,7 +30,7 @@ const getFileColumns = ({ onSelectedFiles }: { onSelectedFiles: (row: Row<FileTr
                                 : <ChevronRight size="16" color="#777"></ChevronRight>}
                         </button>
                     )}
-                    {row.original.name}
+                    <span className="break-all line-clamp-1">{row.original.name}</span>
                 </div>
             )
         }