fix truncate function to handle Chinese characters (#677)

* fix truncate function to handle Chinese characters

* revert changes to truncate function and cut off title using css

* add CSS ellipse on long file name

* fix uploaded middleTruncation as well as directory

---------

Co-authored-by: timothycarambat <rambat1010@gmail.com>

frontend/src/components/Modals/MangeWorkspace/Documents/Directory/FileRow/index.jsx

@@ -78,7 +78,7 @@ export default function FileRow({
           onMouseEnter={handleMouseEnter}
           onMouseLeave={handleMouseLeave}
         >
-          <p className="whitespace-nowrap overflow-hidden">
+          <p className="whitespace-nowrap overflow-hidden max-w-[165px] text-ellipsis">
             {middleTruncate(item.title, 17)}
           </p>
           {showTooltip && (

frontend/src/components/Modals/MangeWorkspace/Documents/WorkspaceDirectory/WorkspaceFileRow/index.jsx

@@ -64,7 +64,7 @@ export default function WorkspaceFileRow({
           onMouseEnter={handleMouseEnter}
           onMouseLeave={handleMouseLeave}
         >
-          <p className="whitespace-nowrap overflow-hidden">
+          <p className="whitespace-nowrap overflow-hidden max-w-[165px] text-ellipsis">
             {middleTruncate(item.title, 17)}
           </p>
           {showTooltip && (