diff --git a/package-lock.json b/package-lock.json index d0a27789a747..71278ea481af 100644 --- a/package-lock.json +++ b/package-lock.json @@ -45,6 +45,7 @@ "@react-ng/bounds-observer": "^0.2.1", "@rnmapbox/maps": "10.1.20", "@shopify/flash-list": "1.6.3", + "@types/mime-db": "^1.43.5", "@ua/react-native-airship": "17.2.1", "@vue/preload-webpack-plugin": "^2.0.0", "awesome-phonenumber": "^5.4.0", @@ -17695,6 +17696,11 @@ "integrity": "sha512-/pyBZWSLD2n0dcHE3hq8s8ZvcETHtEuF+3E7XVt0Ig2nvsVQXdghHVcEkIWjy9A0wKfTn97a/PSDYohKIlnP/w==", "dev": true }, + "node_modules/@types/mime-db": { + "version": "1.43.5", + "resolved": "https://registry.npmjs.org/@types/mime-db/-/mime-db-1.43.5.tgz", + "integrity": "sha512-/bfTiIUTNPUBnwnYvUxXAre5MhD88jgagLEQiQtIASjU+bwxd8kS/ASDA4a8ufd8m0Lheu6eeMJHEUpLHoJ28A==" + }, "node_modules/@types/minimatch": { "version": "3.0.5", "dev": true, diff --git a/package.json b/package.json index 361d2e68b535..3fc98b583b89 100644 --- a/package.json +++ b/package.json @@ -101,6 +101,7 @@ "@react-ng/bounds-observer": "^0.2.1", "@rnmapbox/maps": "10.1.20", "@shopify/flash-list": "1.6.3", + "@types/mime-db": "^1.43.5", "@ua/react-native-airship": "17.2.1", "@vue/preload-webpack-plugin": "^2.0.0", "awesome-phonenumber": "^5.4.0", diff --git a/src/components/Composer/index.native.tsx b/src/components/Composer/index.native.tsx index a2fcae901681..9b886aa49c1d 100644 --- a/src/components/Composer/index.native.tsx +++ b/src/components/Composer/index.native.tsx @@ -1,4 +1,5 @@ import type {MarkdownStyle} from '@expensify/react-native-live-markdown'; +import mimeDb from 'mime-db'; import type {ForwardedRef} from 'react'; import React, {useCallback, useEffect, useMemo, useRef} from 'react'; import type {NativeSyntheticEvent, TextInput, TextInputChangeEventData, TextInputPasteEventData} from 'react-native'; @@ -14,6 +15,7 @@ import useTheme from '@hooks/useTheme'; import useThemeStyles from '@hooks/useThemeStyles'; import updateIsFullComposerAvailable from '@libs/ComposerUtils/updateIsFullComposerAvailable'; import * as EmojiUtils from '@libs/EmojiUtils'; +import * as FileUtils from '@libs/fileDownload/FileUtils'; import type {ComposerProps} from './types'; const excludeNoStyles: Array = []; @@ -92,9 +94,13 @@ function Composer( if (clipboardContent.type === 'text/plain') { return; } + const mimeType = clipboardContent.type; const fileURI = clipboardContent.data; - const fileName = fileURI.split('/').pop(); - const file: FileObject = {uri: fileURI, name: fileName, type: clipboardContent.type}; + const baseFileName = fileURI.split('/').pop() ?? 'file'; + const {fileName: stem, fileExtension: originalFileExtension} = FileUtils.splitExtensionFromFileName(baseFileName); + const fileExtension = originalFileExtension || (mimeDb[mimeType].extensions?.[0] ?? 'bin'); + const fileName = `${stem}.${fileExtension}`; + const file: FileObject = {uri: fileURI, name: fileName, type: mimeType}; onPasteFile(file); }, [onPasteFile],