chore: revert failing commit (#7843)

Author: juice49

packages/sanity/src/core/form/inputs/files/ImageInput/ImageInput.tsx

@@ -108,8 +108,10 @@ function BaseImageInputComponent(props: BaseImageInputProps): JSX.Element {
   }, [path])
 
   const clearUploadStatus = useCallback(() => {
-    onChange(unset(['_upload']))
-  }, [onChange])
+    if (value?._upload) {
+      onChange(unset(['_upload']))
+    }
+  }, [onChange, value?._upload])
   const cancelUpload = useCallback(() => {
     if (uploadSubscription.current) {
       uploadSubscription.current.unsubscribe()

packages/sanity/src/core/form/inputs/files/ImageInput/ImageInputAssetMenu.tsx

@@ -9,7 +9,6 @@ import {type Observable} from 'rxjs'
 import {MenuItem} from '../../../../../ui-components'
 import {useTranslation} from '../../../../i18n'
 import {ActionsMenu} from '../common/ActionsMenu'
-import {SUPPORTED_IMAGE_UPLOAD_TYPES} from '../constants'
 import {ImageActionsMenu, ImageActionsMenuWaitPlaceholder} from './ImageActionsMenu'
 import {type BaseImageInputProps} from './types'
 
@@ -55,10 +54,7 @@ function ImageInputAssetMenuComponent(
   } = props
   const {t} = useTranslation()
 
-  const accept = useMemo(
-    () => get(schemaType, 'options.accept', SUPPORTED_IMAGE_UPLOAD_TYPES.join(',')),
-    [schemaType],
-  )
+  const accept = useMemo(() => get(schemaType, 'options.accept', 'image/*'), [schemaType])
   const asset = value?.asset
 
   const showAdvancedEditButton = value && asset && isImageToolEnabled

packages/sanity/src/core/form/inputs/files/ImageInput/ImageInputAssetSource.tsx

@@ -3,7 +3,6 @@ import {get} from 'lodash'
 import {memo, useMemo} from 'react'
 
 import {WithReferencedAsset} from '../../../utils/WithReferencedAsset'
-import {SUPPORTED_IMAGE_UPLOAD_TYPES} from '../constants'
 import {type BaseImageInputProps} from './types'
 
 function ImageInputAssetSourceComponent(
@@ -21,10 +20,7 @@ function ImageInputAssetSourceComponent(
     selectedAssetSource,
     value,
   } = props
-  const accept = useMemo(
-    () => get(schemaType, 'options.accept', SUPPORTED_IMAGE_UPLOAD_TYPES.join(',')),
-    [schemaType],
-  )
+  const accept = useMemo(() => get(schemaType, 'options.accept', 'image/*'), [schemaType])
 
   if (!selectedAssetSource) {
     return null

packages/sanity/src/core/form/inputs/files/ImageInput/ImageInputUploadPlaceholder.tsx

@@ -3,7 +3,6 @@ import {get} from 'lodash'
 import {memo, useMemo} from 'react'
 
 import {UploadPlaceholder} from '../common/UploadPlaceholder'
-import {SUPPORTED_IMAGE_UPLOAD_TYPES} from '../constants'
 import {type BaseImageInputProps, type FileInfo} from './types'
 
 function ImageInputUploadPlaceholderComponent(props: {
@@ -29,10 +28,7 @@ function ImageInputUploadPlaceholderComponent(props: {
     () => hoveringFiles.filter((file) => resolveUploader(schemaType, file)),
     [hoveringFiles, resolveUploader, schemaType],
   )
-  const accept = useMemo(
-    () => get(schemaType, 'options.accept', SUPPORTED_IMAGE_UPLOAD_TYPES.join(',')),
-    [schemaType],
-  )
+  const accept = useMemo(() => get(schemaType, 'options.accept', 'image/*'), [schemaType])
 
   const rejectedFilesCount = hoveringFiles.length - acceptedFiles.length
 

packages/sanity/src/core/form/inputs/files/__workshop__/UploadPlaceholderStory.tsx

@@ -2,15 +2,14 @@ import {Card, Container, Flex} from '@sanity/ui'
 
 import {Button} from '../../../../../ui-components'
 import {UploadPlaceholder} from '../common/UploadPlaceholder'
-import {SUPPORTED_IMAGE_UPLOAD_TYPES} from '../constants'
 
 export default function UploadPlaceholderStory() {
   return (
     <Flex align="center" height="fill" justify="center" padding={3}>
       <Container width={1}>
         <Card>
           <UploadPlaceholder
-            accept={SUPPORTED_IMAGE_UPLOAD_TYPES.join(',')}
+            accept="image/*"
             acceptedFiles={[{name: 'foo.jpg', type: 'image/jpeg'}]}
             browse={<Button text="Browse btn" mode="ghost" />}
             directUploads

packages/sanity/src/core/form/inputs/files/constants.ts

@@ -4,19 +4,3 @@
  * the upload will be marked as stale/interrupted.
  */
 export const STALE_UPLOAD_MS = 1000 * 60 * 2
-
-/**
- * The mime types of image formats we support uploading
- *
- * @internal
- */
-export const SUPPORTED_IMAGE_UPLOAD_TYPES = [
-  'image/bmp',
-  'image/gif',
-  'image/jpeg',
-  'image/png',
-  'image/svg',
-  'image/tiff',
-  'image/webp',
-  '.psd', // Many different mime types for PSD files, so we just use the extension
-]

packages/sanity/src/core/form/studio/inputs/client-adapters/assets.ts

@@ -73,13 +73,10 @@ export const uploadImageAsset = (
   client: SanityClient,
   file: File | Blob,
   options?: UploadOptions,
-): Observable<UploadEvent> => uploadAsset(client, 'image', file, options)
+) => uploadAsset(client, 'image', file, options)
 
-export const uploadFileAsset = (
-  client: SanityClient,
-  file: File | Blob,
-  options?: UploadOptions,
-): Observable<UploadEvent> => uploadAsset(client, 'file', file, options)
+export const uploadFileAsset = (client: SanityClient, file: File | Blob, options?: UploadOptions) =>
+  uploadAsset(client, 'file', file, options)
 
 /**
  *
@@ -126,17 +123,11 @@ function observeAssetDoc(documentPreviewStore: DocumentPreviewStore, id: string)
     )
 }
 
-export function observeImageAsset(
-  documentPreviewStore: DocumentPreviewStore,
-  id: string,
-): Observable<ImageAsset> {
+export function observeImageAsset(documentPreviewStore: DocumentPreviewStore, id: string) {
   return observeAssetDoc(documentPreviewStore, id) as Observable<ImageAsset>
 }
 
-export function observeFileAsset(
-  documentPreviewStore: DocumentPreviewStore,
-  id: string,
-): Observable<FileAsset> {
+export function observeFileAsset(documentPreviewStore: DocumentPreviewStore, id: string) {
   return observeAssetDoc(documentPreviewStore, id) as Observable<FileAsset>
 }
 

packages/sanity/src/core/form/studio/uploads/uploadImage.ts

@@ -21,11 +21,12 @@ export function uploadImage(
   options?: UploadOptions,
 ): Observable<UploadProgressEvent> {
   const upload$ = uploadImageAsset(client, file, options).pipe(
-    filter((event) => !('stage' in event) || event.stage !== 'download'),
+    filter((event: any) => event.stage !== 'download'),
     map((event) => ({
       ...event,
-      progress: event.type === 'complete' ? 100 : 2 + (event.percent / 100) * 98,
+      progress: 2 + (event.percent / 100) * 98,
     })),
+
     map((event) => {
       if (event.type === 'complete') {
         return createUploadEvent([

packages/sanity/src/core/form/studio/uploads/uploaders.ts

@@ -2,15 +2,14 @@ import {type SanityClient} from '@sanity/client'
 import {type SchemaType} from '@sanity/types'
 import {map} from 'rxjs/operators'
 
-import {SUPPORTED_IMAGE_UPLOAD_TYPES} from '../../inputs/files/constants'
 import {set} from '../../patch'
 import {type Uploader, type UploaderDef, type UploadOptions} from './types'
 import {uploadFile} from './uploadFile'
 import {uploadImage} from './uploadImage'
 
 const UPLOAD_IMAGE: UploaderDef = {
   type: 'image',
-  accepts: SUPPORTED_IMAGE_UPLOAD_TYPES.join(','),
+  accepts: 'image/*',
   upload: (client: SanityClient, file: File, type?: SchemaType, options?: UploadOptions) =>
     uploadImage(client, file, options),
 }

packages/sanity/src/core/studio/components/navbar/search/components/filters/filter/inputs/asset/Asset.tsx

@@ -7,7 +7,6 @@ import {styled} from 'styled-components'
 
 import {Button, MenuButton, MenuItem} from '../../../../../../../../../../ui-components'
 import {type Source} from '../../../../../../../../../config'
-import {SUPPORTED_IMAGE_UPLOAD_TYPES} from '../../../../../../../../../form/inputs/files/constants'
 import {FileSource, ImageSource} from '../../../../../../../../../form/studio/assetSource'
 import {useClient} from '../../../../../../../../../hooks'
 import {useTranslation} from '../../../../../../../../../i18n'
@@ -103,15 +102,13 @@ export function SearchFilterAssetInput(type?: AssetType) {
 
     const AssetSourceComponent = selectedAssetSource?.component
 
+    const fontSize = fullscreen ? 2 : 1
+
     const buttonText = t(value ? 'search.filter-asset-change' : 'search.filter-asset-select', {
       context: type,
     })
 
-    const accept = get(
-      type,
-      'options.accept',
-      type === 'image' ? SUPPORTED_IMAGE_UPLOAD_TYPES.join(',') : '',
-    )
+    const accept = get(type, 'options.accept', type === 'image' ? 'image/*' : '')
 
     return (
       <ContainerBox>