diff --git a/frontend/src/components/Modals/MangeWorkspace/Documents/Directory/FileRow/index.jsx b/frontend/src/components/Modals/MangeWorkspace/Documents/Directory/FileRow/index.jsx
index ef8bed17..b83d695a 100644
--- a/frontend/src/components/Modals/MangeWorkspace/Documents/Directory/FileRow/index.jsx
+++ b/frontend/src/components/Modals/MangeWorkspace/Documents/Directory/FileRow/index.jsx
@@ -2,10 +2,10 @@ import { useState } from "react";
 import {
   formatDate,
   getFileExtension,
-  truncate,
-} from "../../../../../../utils/directories";
+  middleTruncate,
+} from "@/utils/directories";
 import { File, Trash } from "@phosphor-icons/react";
-import System from "../../../../../../models/system";
+import System from "@/models/system";
 import debounce from "lodash.debounce";
 
 export default function FileRow({
@@ -76,7 +76,7 @@ export default function FileRow({
           onMouseLeave={handleMouseLeave}
         >
           <p className="whitespace-nowrap overflow-hidden">
-            {truncate(item.title, 17)}
+            {middleTruncate(item.title, 17)}
           </p>
           {showTooltip && (
             <div className="absolute left-0 bg-white text-black p-1.5 rounded shadow-lg whitespace-nowrap">
diff --git a/frontend/src/components/Modals/MangeWorkspace/Documents/Directory/FolderRow/index.jsx b/frontend/src/components/Modals/MangeWorkspace/Documents/Directory/FolderRow/index.jsx
index abf4cef9..f2d5d5c7 100644
--- a/frontend/src/components/Modals/MangeWorkspace/Documents/Directory/FolderRow/index.jsx
+++ b/frontend/src/components/Modals/MangeWorkspace/Documents/Directory/FolderRow/index.jsx
@@ -1,7 +1,7 @@
 import { useState } from "react";
 import FileRow from "../FileRow";
 import { CaretDown, FolderNotch } from "@phosphor-icons/react";
-import { truncate } from "../../../../../../utils/directories";
+import { middleTruncate } from "@/utils/directories";
 
 export default function FolderRow({
   item,
@@ -50,7 +50,7 @@ export default function FolderRow({
             weight="fill"
           />
           <p className="whitespace-nowrap overflow-show">
-            {truncate(item.name, 40)}
+            {middleTruncate(item.name, 40)}
           </p>
         </div>
         <p className="col-span-2 pl-3.5" />
diff --git a/frontend/src/components/Modals/MangeWorkspace/Documents/Directory/index.jsx b/frontend/src/components/Modals/MangeWorkspace/Documents/Directory/index.jsx
index 1eeb00f4..07201033 100644
--- a/frontend/src/components/Modals/MangeWorkspace/Documents/Directory/index.jsx
+++ b/frontend/src/components/Modals/MangeWorkspace/Documents/Directory/index.jsx
@@ -1,9 +1,8 @@
 import UploadFile from "../UploadFile";
-import PreLoader from "../../../../Preloader";
+import PreLoader from "@/components/Preloader";
 import { useEffect, useState } from "react";
 import FolderRow from "./FolderRow";
 import pluralize from "pluralize";
-import Workspace from "../../../../../models/workspace";
 
 export default function Directory({
   files,
diff --git a/frontend/src/components/Modals/MangeWorkspace/Documents/WorkspaceDirectory/WorkspaceFileRow/index.jsx b/frontend/src/components/Modals/MangeWorkspace/Documents/WorkspaceDirectory/WorkspaceFileRow/index.jsx
index 4468ee27..da75ec02 100644
--- a/frontend/src/components/Modals/MangeWorkspace/Documents/WorkspaceDirectory/WorkspaceFileRow/index.jsx
+++ b/frontend/src/components/Modals/MangeWorkspace/Documents/WorkspaceDirectory/WorkspaceFileRow/index.jsx
@@ -2,10 +2,10 @@ import { useState } from "react";
 import {
   formatDate,
   getFileExtension,
-  truncate,
-} from "../../../../../../utils/directories";
+  middleTruncate,
+} from "@/utils/directories";
 import { ArrowUUpLeft, File } from "@phosphor-icons/react";
-import Workspace from "../../../../../../models/workspace";
+import Workspace from "@/models/workspace";
 import debounce from "lodash.debounce";
 
 export default function WorkspaceFileRow({
@@ -65,7 +65,7 @@ export default function WorkspaceFileRow({
           onMouseLeave={handleMouseLeave}
         >
           <p className="whitespace-nowrap overflow-hidden">
-            {truncate(item.title, 17)}
+            {middleTruncate(item.title, 17)}
           </p>
           {showTooltip && (
             <div className="absolute left-0 bg-white text-black p-1.5 rounded shadow-lg whitespace-nowrap">
diff --git a/frontend/src/components/Modals/MangeWorkspace/Documents/WorkspaceDirectory/index.jsx b/frontend/src/components/Modals/MangeWorkspace/Documents/WorkspaceDirectory/index.jsx
index 8b1381a1..9969e844 100644
--- a/frontend/src/components/Modals/MangeWorkspace/Documents/WorkspaceDirectory/index.jsx
+++ b/frontend/src/components/Modals/MangeWorkspace/Documents/WorkspaceDirectory/index.jsx
@@ -1,5 +1,5 @@
-import PreLoader from "../../../../Preloader";
-import { dollarFormat } from "../../../../../utils/numbers";
+import PreLoader from "@/components/Preloader";
+import { dollarFormat } from "@/utils/numbers";
 import WorkspaceFileRow from "./WorkspaceFileRow";
 
 export default function WorkspaceDirectory({
diff --git a/frontend/src/utils/directories.js b/frontend/src/utils/directories.js
index 9a63ceb3..48021c51 100644
--- a/frontend/src/utils/directories.js
+++ b/frontend/src/utils/directories.js
@@ -11,7 +11,7 @@ export function getFileExtension(path) {
   return path?.split(".")?.slice(-1)?.[0] || "file";
 }
 
-export function truncate(str, n) {
+export function middleTruncate(str, n) {
   const fileExtensionPattern = /(\..+)$/;
   const extensionMatch = str.match(fileExtensionPattern);