Fix file name/folder name truncation (#2456)

fix filename/foldername truncation Co-authored-by: Timothy Carambat <[email protected]>
Mintplex-Labs · Oct 15, 2024 · 15ca5e8 · 15ca5e8
1 parent 52f2f87
commit 15ca5e8
Show file tree

Hide file tree

Showing 3 changed files with 3 additions and 3 deletions.
diff --git a/frontend/src/components/Modals/ManageWorkspace/Documents/Directory/FileRow/index.jsx b/frontend/src/components/Modals/ManageWorkspace/Documents/Directory/FileRow/index.jsx
@@ -31,7 +31,7 @@ export default function FileRow({ item, selected, toggleSelection }) {
           className="shrink-0 text-base font-bold w-4 h-4 mr-[3px]"
           weight="fill"
         />
-        <p className="whitespace-nowrap overflow-hidden text-ellipsis">
+        <p className="whitespace-nowrap overflow-hidden text-ellipsis max-w-[400px]">
           {middleTruncate(item.title, 55)}
         </p>
       </div>

diff --git a/frontend/src/components/Modals/ManageWorkspace/Documents/Directory/FolderRow/index.jsx b/frontend/src/components/Modals/ManageWorkspace/Documents/Directory/FolderRow/index.jsx
@@ -51,7 +51,7 @@ export default function FolderRow({
             className="shrink-0 text-base font-bold w-4 h-4 mr-[3px]"
             weight="fill"
           />
-          <p className="whitespace-nowrap overflow-show">
+          <p className="whitespace-nowrap overflow-show max-w-[400px]">
             {middleTruncate(item.name, 35)}
           </p>
         </div>

diff --git a/...components/Modals/ManageWorkspace/Documents/WorkspaceDirectory/WorkspaceFileRow/index.jsx b/...components/Modals/ManageWorkspace/Documents/WorkspaceDirectory/WorkspaceFileRow/index.jsx
@@ -83,7 +83,7 @@ export default function WorkspaceFileRow({
           className="shrink-0 text-base font-bold w-4 h-4 mr-[3px] ml-1"
           weight="fill"
         />
-        <p className="whitespace-nowrap overflow-hidden text-ellipsis">
+        <p className="whitespace-nowrap overflow-hidden text-ellipsis max-w-[400px]">
           {middleTruncate(item.title, 50)}
         </p>
       </div>