fix: image resize tiff files (#5449)

packages/payload/src/uploads/canResizeImage.ts

@@ -1,3 +1,3 @@
 export default function canResizeImage(mimeType: string): boolean {
-  return ['image/jpeg', 'image/png', 'image/gif', 'image/webp'].indexOf(mimeType) > -1
+  return ['image/jpeg', 'image/png', 'image/gif', 'image/webp', 'image/tiff'].indexOf(mimeType) > -1
 }

packages/payload/src/uploads/generateFileData.ts

@@ -132,7 +132,7 @@ export const generateFileData = async <T>({
       }
     }
 
-    if (isImage(file.mimetype)) {
+    if (fileSupportsResize || isImage(file.mimetype)) {
       dimensions = getImageSize(file)
       fileData.width = dimensions.width
       fileData.height = dimensions.height

packages/ui/src/hooks/useThumbnail.ts

@@ -38,7 +38,7 @@ export const useThumbnail = (
     return `${serverURL}/${thumbnailURL}`
   }
 
-  if (isImage(mimeType as string)) {
+  if (adminThumbnail || isImage(mimeType as string)) {
     if (typeof adminThumbnail === 'undefined' && url) {
       return url as string
     }

test/uploads/config.ts

@@ -287,6 +287,7 @@ export default buildConfigWithDefaults({
           'image/jpeg',
           'image/gif',
           'image/svg+xml',
+          'image/tiff',
           'audio/mpeg',
         ],
         imageSizes: [

test/uploads/e2e.spec.ts

@@ -15,6 +15,7 @@ import { RESTClient } from '../helpers/rest.js'
 import { adminThumbnailSrc } from './collections/admin-thumbnail/RegisterThumbnailFn.js'
 import config from './config.js'
 import { adminThumbnailSlug, audioSlug, mediaSlug, relationSlug } from './shared.js'
+
 const filename = fileURLToPath(import.meta.url)
 const dirname = path.dirname(filename)
 
@@ -155,6 +156,17 @@ describe('uploads', () => {
     await expect(iconMeta).toContainText('16x16')
   })
 
+  test('should resize and show tiff images', async () => {
+    await page.goto(mediaURL.create)
+    await page.setInputFiles('input[type="file"]', path.resolve(dirname, './test-image.tiff'))
+
+    await expect(page.locator('.file-field__upload .thumbnail svg')).toBeVisible()
+
+    await saveDocAndAssert(page)
+
+    await expect(page.locator('.file-details img')).toBeVisible()
+  })
+
   test('should show draft uploads in the relation list', async () => {
     await page.goto(relationURL.list)