Ensure server side blocks file type mismatches

Signed-off-by: Dave Mackey <dave@davemackey.net>

Author: davidshq

changelogs/fragments/11424.yml

@@ -0,0 +1,2 @@
+feat:
+- Add file upload to chat plugin ([#11424](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/11424))

src/plugins/chat/public/components/chat_input.test.tsx

@@ -440,6 +440,59 @@ describe('ChatInput', () => {
       );
     });
 
+    it('should reject files with unsupported MIME types', () => {
+      const onFilesSelected = jest.fn();
+      const { container } = render(
+        <ChatInput {...defaultProps} onFilesSelected={onFilesSelected} />
+      );
+
+      const exe = new File(['binary'], 'malware.exe', { type: 'application/x-msdownload' });
+      selectFiles(container, [exe]);
+
+      expect(onFilesSelected).not.toHaveBeenCalled();
+      expect(mockAddWarning).toHaveBeenCalledWith(expect.stringContaining('malware.exe'));
+    });
+
+    it('should accept files matched by extension when MIME type is empty', () => {
+      const onFilesSelected = jest.fn();
+      const { container } = render(
+        <ChatInput {...defaultProps} onFilesSelected={onFilesSelected} />
+      );
+
+      // Linux browsers often report empty MIME type
+      const file = new File(['{"key":"val"}'], 'data.json', { type: '' });
+      selectFiles(container, [file]);
+
+      expect(onFilesSelected).toHaveBeenCalledWith([file]);
+    });
+
+    it('should reject files with unsupported extension and empty MIME type', () => {
+      const onFilesSelected = jest.fn();
+      const { container } = render(
+        <ChatInput {...defaultProps} onFilesSelected={onFilesSelected} />
+      );
+
+      const file = new File(['data'], 'image.png', { type: '' });
+      selectFiles(container, [file]);
+
+      expect(onFilesSelected).not.toHaveBeenCalled();
+      expect(mockAddWarning).toHaveBeenCalledWith(expect.stringContaining('image.png'));
+    });
+
+    it('should keep valid files and reject unsupported files in a mixed selection', () => {
+      const onFilesSelected = jest.fn();
+      const { container } = render(
+        <ChatInput {...defaultProps} onFilesSelected={onFilesSelected} />
+      );
+
+      const good = new File(['hello'], 'notes.txt', { type: 'text/plain' });
+      const bad = new File(['binary'], 'photo.jpg', { type: 'image/jpeg' });
+      selectFiles(container, [good, bad]);
+
+      expect(onFilesSelected).toHaveBeenCalledWith([good]);
+      expect(mockAddWarning).toHaveBeenCalledWith(expect.stringContaining('photo.jpg'));
+    });
+
     it('should truncate file list to remaining capacity', () => {
       const onFilesSelected = jest.fn();
       const { container } = render(

src/plugins/chat/public/components/chat_input.tsx

@@ -17,6 +17,7 @@ import { useOpenSearchDashboards } from '../../../opensearch_dashboards_react/pu
 import { CoreStart } from '../../../../core/public';
 import {
   CHAT_FILE_ACCEPT,
+  CHAT_ALLOWED_FILE_TYPES,
   CHAT_MAX_FILE_ATTACHMENTS as DEFAULT_MAX_FILE_ATTACHMENTS,
   ONE_MB,
 } from '../../common';
@@ -107,8 +108,34 @@ export const ChatInput: React.FC<ChatInputProps> = ({
       return;
     }
 
-    const valid = files.filter((f) => f.size <= maxFileUploadBytes);
-    const oversized = files.filter((f) => f.size > maxFileUploadBytes);
+    const allowedMimeTypes = Object.keys(CHAT_ALLOWED_FILE_TYPES);
+    const allowedExtensions = Object.values(CHAT_ALLOWED_FILE_TYPES).flat();
+    const isFileTypeAllowed = (f: File) => {
+      if (f.type && allowedMimeTypes.includes(f.type)) return true;
+      const ext = f.name.slice(f.name.lastIndexOf('.')).toLowerCase();
+      return allowedExtensions.includes(ext);
+    };
+
+    const typeAllowed = files.filter(isFileTypeAllowed);
+    const typeRejected = files.filter((f) => !isFileTypeAllowed(f));
+
+    if (typeRejected.length > 0) {
+      const names = typeRejected.map((f) => f.name).join(', ');
+      notifications.toasts.addWarning(
+        i18n.translate('chat.input.unsupportedFileType', {
+          defaultMessage: 'Unsupported file type(s) skipped: {names}. Allowed types: {extensions}.',
+          values: { names, extensions: allowedExtensions.join(', ') },
+        })
+      );
+    }
+
+    if (typeAllowed.length === 0) {
+      e.target.value = '';
+      return;
+    }
+
+    const valid = typeAllowed.filter((f) => f.size <= maxFileUploadBytes);
+    const oversized = typeAllowed.filter((f) => f.size > maxFileUploadBytes);
 
     if (oversized.length > 0) {
       const limitMB = (maxFileUploadBytes / ONE_MB).toFixed(1);