Add MIME type mapping support to file upload component

packages/forms/resources/js/components/file-upload.js

@@ -72,7 +72,9 @@ export default function fileUploadFormComponent({
     uploadingMessage,
     uploadProgressIndicatorPosition,
     uploadUsing,
+    mimeTypeMap,
 }) {
+
     return {
         fileKeyIndex: {},
 
@@ -202,9 +204,9 @@ export default function fileUploadFormComponent({
                 },
                 fileValidateTypeDetectType: (source, detectedType) => {
                     return new Promise((resolve, reject) => {
-                        const mimeType =
-                            detectedType ||
-                            mime.getType(source.name.split('.').pop())
+                        const extension = source.name.split('.').pop().toLowerCase()
+                        const mimeType = mimeTypeMap[extension] || detectedType || mime.getType(extension)
+
                         mimeType ? resolve(mimeType) : reject()
                     })
                 },

packages/forms/resources/views/components/file-upload.blade.php

@@ -39,6 +39,7 @@
                     deleteUploadedFileUsing: async (fileKey) => {
                         return await $wire.deleteUploadedFile(@js($statePath), fileKey)
                     },
+                    mimeTypeMap: @js($getMimeTypeMap()),
                     getUploadedFilesUsing: async () => {
                         return await $wire.getFormUploadedFiles(@js($statePath))
                     },

packages/forms/src/Components/FileUpload.php

@@ -75,6 +75,11 @@ class FileUpload extends BaseFileUpload
      */
     protected array | Closure $imageEditorAspectRatios = [];
 
+    /**
+     * @var array<string, string>
+     */
+    protected array $mimeTypeMap = [];
+
     public function appendFiles(bool | Closure $condition = true): static
     {
         $this->shouldAppendFiles = $condition;
@@ -470,7 +475,7 @@ class FileUpload extends BaseFileUpload
             )
             ->unique()
             ->mapWithKeys(fn (?string $ratio): array => [
-                $ratio ?? __('filament-forms::components.file_upload.editor.aspect_ratios.no_fixed.label') => $this->normalizeImageCroppingRatioForJs($ratio),
+                    $ratio ?? __('filament-forms::components.file_upload.editor.aspect_ratios.no_fixed.label') => $this->normalizeImageCroppingRatioForJs($ratio),
             ])
             ->filter(fn (float | string | false $ratio): bool => $ratio !== false)
             ->when(
@@ -588,4 +593,22 @@ class FileUpload extends BaseFileUpload
             ],
         ];
     }
+
+    /**
+     * @param array<string, string> $mimeTypeMap
+     */
+    public function mimeTypeMap(array $mimeTypeMap): static
+    {
+        $this->mimeTypeMap = $mimeTypeMap;
+
+        return $this;
+    }
+
+    /**
+     * @return array<string, string>
+     */
+    public function getMimeTypeMap(): array
+    {
+        return $this->mimeTypeMap;
+    }
 }