fix(upload): ensure only image files are read for preview (#9562)

### What?
Ensure only image files are read for preview.

### Why?
Upon uploading larger files, it crashes the browser as it's reading the
whole file for preview.

Fixes #9559

Co-authored-by: Kapil Barad <>

Author: kapilbarad

packages/payload/src/admin/components/views/collections/Edit/Upload/index.tsx

@@ -74,7 +74,7 @@ export const Upload: React.FC<Props> = (props) => {
 
   const handleFileChange = useCallback(
     (newFile: File) => {
-      if (newFile instanceof File) {
+      if (newFile instanceof File && isImage(newFile.type)) {
         const fileReader = new FileReader()
         fileReader.onload = (e) => {
           const imgSrc = e.target?.result