Show icon for video or image in array field preview

import { ImageIcon, PlayIcon } from "@sanity/icons";

export const mediaObjectType = defineType({
  name: 'mediaObject',
  type: 'object',
  fields: [
    {
      name: 'mediaItems',
      type: 'array',
      of: [
        { type: 'image' },
        { type: 'file' } // for videos
      ]
    }
  ],
  preview: {
    select: {
      // Get the first media item from the array
      firstMedia: 'mediaItems.0',
      // You can also select the asset type directly if structured differently
      mediaType: 'mediaItems.0._type'
    },
    prepare({ firstMedia, mediaType }) {
      // Determine if it's a video or image
      const isVideo = firstMedia?.asset?.mimeType?.startsWith('video/');
      
      return {
        title: 'Media Object',
        subtitle: isVideo ? 'Video content' : 'Image content',
        media: isVideo ? PlayIcon : (firstMedia ?? ImageIcon)
      };
    }
  }
});

{
  name: 'mediaItems',
  type: 'array',
  of: [
    {
      type: 'image',
      preview: {
        select: {
          media: 'asset'
        },
        prepare({ media }) {
          return {
            title: 'Image',
            media: media ?? ImageIcon
          };
        }
      }
    },
    {
      type: 'file',
      preview: {
        select: {
          fileName: 'asset.originalFilename',
          mimeType: 'asset.mimeType'
        },
        prepare({ fileName, mimeType }) {
          const isVideo = mimeType?.startsWith('video/');
          return {
            title: fileName || 'File',
            subtitle: isVideo ? 'Video' : 'File',
            media: isVideo ? PlayIcon : DocumentIcon
          };
        }
      }
    }
  ]
}