diff --git a/app/javascript/dashboard/components-next/NewConversation/components/AttachmentPreviews.vue b/app/javascript/dashboard/components-next/NewConversation/components/AttachmentPreviews.vue
index 196550c29..2e03f64c0 100644
--- a/app/javascript/dashboard/components-next/NewConversation/components/AttachmentPreviews.vue
+++ b/app/javascript/dashboard/components-next/NewConversation/components/AttachmentPreviews.vue
@@ -1,6 +1,6 @@
 <script setup>
 import { computed } from 'vue';
-import { fileNameWithEllipsis } from 'shared/helpers/FileHelper';
+import { fileNameWithEllipsis } from '@chatwoot/utils';
 
 import Button from 'dashboard/components-next/button/Button.vue';
 
@@ -69,7 +69,7 @@ const removeAttachment = id => {
       <div
         v-for="attachment in filteredNonImageAttachments"
         :key="attachment.id"
-        class="max-w-[300px] inline-flex items-center h-8 min-w-0 bg-n-solid-3 rounded-lg gap-3 ltr:pl-3 rtl:pr-3 ltr:pr-2 rtl:pl-2"
+        class="max-w-[300px] inline-flex items-center h-8 min-w-0 bg-n-alpha-2 dark:bg-n-solid-3 rounded-lg gap-3 ltr:pl-3 rtl:pr-3 ltr:pr-2 rtl:pl-2"
       >
         <span class="text-sm font-medium text-n-slate-11">
           {{ fileNameWithEllipsis(attachment.resource) }}
diff --git a/app/javascript/shared/helpers/FileHelper.js b/app/javascript/shared/helpers/FileHelper.js
index 5a0f3544b..d0d9daaaa 100644
--- a/app/javascript/shared/helpers/FileHelper.js
+++ b/app/javascript/shared/helpers/FileHelper.js
@@ -19,19 +19,3 @@ export const checkFileSizeLimit = (file, maximumUploadLimit) => {
   const fileSizeInMB = fileSizeInMegaBytes(fileSize);
   return fileSizeInMB <= maximumUploadLimit;
 };
-
-export const fileNameWithEllipsis = (file, maxLength = 26, ellipsis = '…') => {
-  const fullName = file?.filename ?? file?.name ?? 'Untitled';
-
-  const dotIndex = fullName.lastIndexOf('.');
-  if (dotIndex === -1) return fullName;
-
-  const [name, extension] = [
-    fullName.slice(0, dotIndex),
-    fullName.slice(dotIndex),
-  ];
-
-  if (name.length <= maxLength) return fullName;
-
-  return `${name.slice(0, maxLength)}${ellipsis}${extension}`;
-};
diff --git a/app/javascript/shared/helpers/specs/FileHelper.spec.js b/app/javascript/shared/helpers/specs/FileHelper.spec.js
index 8b34d7b05..750eab52c 100644
--- a/app/javascript/shared/helpers/specs/FileHelper.spec.js
+++ b/app/javascript/shared/helpers/specs/FileHelper.spec.js
@@ -2,7 +2,6 @@ import {
   formatBytes,
   fileSizeInMegaBytes,
   checkFileSizeLimit,
-  fileNameWithEllipsis,
 } from '../FileHelper';
 
 describe('#File Helpers', () => {
@@ -36,51 +35,4 @@ describe('#File Helpers', () => {
       expect(checkFileSizeLimit({ file: { size: 199154 } }, 40)).toBe(true);
     });
   });
-
-  describe('fileNameWithEllipsis', () => {
-    it('should return original filename if name length is within limit', () => {
-      const file = { name: 'document.pdf' };
-      expect(fileNameWithEllipsis(file)).toBe('document.pdf');
-    });
-
-    it('should truncate filename if it exceeds max length', () => {
-      const file = { name: 'very-long-filename-that-needs-truncating.pdf' };
-      expect(fileNameWithEllipsis(file)).toBe(
-        'very-long-filename-that-ne….pdf'
-      );
-    });
-
-    it('should handle files without extension', () => {
-      const file = { name: 'README' };
-      expect(fileNameWithEllipsis(file)).toBe('README');
-    });
-
-    it('should handle files with multiple dots', () => {
-      const file = { name: 'archive.tar.gz' };
-      expect(fileNameWithEllipsis(file)).toBe('archive.tar.gz');
-    });
-
-    it('should handle hidden files', () => {
-      const file = { name: '.gitignore' };
-      expect(fileNameWithEllipsis(file)).toBe('.gitignore');
-    });
-
-    it('should handle both filename and name properties', () => {
-      const file = {
-        filename: 'from-filename.pdf',
-        name: 'from-name.pdf',
-      };
-      expect(fileNameWithEllipsis(file)).toBe('from-filename.pdf');
-    });
-
-    it('should handle special characters', () => {
-      const file = { name: 'résumé-2023_final-version.doc' };
-      expect(fileNameWithEllipsis(file)).toBe('résumé-2023_final-version.doc');
-    });
-
-    it('should handle very short filenames', () => {
-      const file = { name: 'a.txt' };
-      expect(fileNameWithEllipsis(file)).toBe('a.txt');
-    });
-  });
 });
diff --git a/package.json b/package.json
index fc2de8c7d..61ad71941 100644
--- a/package.json
+++ b/package.json
@@ -34,7 +34,7 @@
     "@chatwoot/captain": "0.0.3-alpha.4",
     "@chatwoot/ninja-keys": "1.2.3",
     "@chatwoot/prosemirror-schema": "1.1.1-next",
-    "@chatwoot/utils": "^0.0.25",
+    "@chatwoot/utils": "^0.0.28",
     "@formkit/core": "^1.6.7",
     "@formkit/vue": "^1.6.7",
     "@hcaptcha/vue3-hcaptcha": "^1.3.0",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index ed87f5009..33d7dc8ff 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -26,8 +26,8 @@ importers:
         specifier: 1.1.1-next
         version: 1.1.1-next
       '@chatwoot/utils':
-        specifier: ^0.0.25
-        version: 0.0.25
+        specifier: ^0.0.28
+        version: 0.0.28
       '@formkit/core':
         specifier: ^1.6.7
         version: 1.6.7
@@ -395,8 +395,8 @@ packages:
   '@chatwoot/prosemirror-schema@1.1.1-next':
     resolution: {integrity: sha512-/M2qZ+ZF7GlQNt1riwVP499fvp3hxSqd5iy8hxyF9pkj9qQ+OKYn5JK+v3qwwqQY3IxhmNOn1Lp6tm7vstrd9Q==}
 
-  '@chatwoot/utils@0.0.25':
-    resolution: {integrity: sha512-2bGfRewHu0Bra47vHwJa3SdZ0VqXK/2q2ampcc6TT3z8ojSfZqpfMdb+1RKJ/Q1tQEYn/0rJTdWtLDRjePF92A==}
+  '@chatwoot/utils@0.0.28':
+    resolution: {integrity: sha512-LLBAqTofVLR9nR2hDihwvJNgPMZmOkvule7QBeDVISyubNR7lSc9Ow4GHJxsftXVSme0ZVvvuWntbBi2C/vRqw==}
     engines: {node: '>=10'}
 
   '@codemirror/commands@6.7.0':
@@ -2366,8 +2366,8 @@ packages:
     resolution: {integrity: sha512-m1WR0xGiC6j6jNFAyW4Nvh4WxAi4JF4w9jRJwSI8nBmNcyZXPcP9VUQG+6gHQXAmqaGEKDKhOqAtENDC941UkA==}
     engines: {node: '>=0.11'}
 
-  date-fns@2.29.3:
-    resolution: {integrity: sha512-dDCnyH2WnnKusqvZZ6+jA1O51Ibt8ZMRNkDZdyAyK4YfbDwa/cEmuztzG5pk6hqlp9aSBPYcjOlktquahGwGeA==}
+  date-fns@2.30.0:
+    resolution: {integrity: sha512-fnULvOpxnC5/Vg3NCiWelDsLiUc9bRwAPs/+LfTLNvetFCtCTN+yQz15C/fs4AwX1R9K5GLtLfn8QW+dWisaAw==}
     engines: {node: '>=0.11'}
 
   date-fns@3.6.0:
@@ -5218,9 +5218,9 @@ snapshots:
       prosemirror-utils: 1.2.2(prosemirror-model@1.22.3)(prosemirror-state@1.4.3)
       prosemirror-view: 1.34.1
 
-  '@chatwoot/utils@0.0.25':
+  '@chatwoot/utils@0.0.28':
     dependencies:
-      date-fns: 2.29.3
+      date-fns: 2.30.0
 
   '@codemirror/commands@6.7.0':
     dependencies:
@@ -7462,7 +7462,9 @@ snapshots:
 
   date-fns@2.21.1: {}
 
-  date-fns@2.29.3: {}
+  date-fns@2.30.0:
+    dependencies:
+      '@babel/runtime': 7.25.6
 
   date-fns@3.6.0: {}