Dynamic document icons based on document values in Structure Builder

import { CheckmarkIcon, CloseIcon, ClockIcon } from "@sanity/icons";

export const myDocumentType = defineType({
  name: 'myDocument',
  type: 'document',
  preview: {
    select: {
      title: 'title',
      status: 'status', // Select the field you want to base the icon on
    },
    prepare({title, status}) {
      // Return different icons based on document values
      let icon;
      if (status === 'published') {
        icon = CheckmarkIcon;
      } else if (status === 'archived') {
        icon = CloseIcon;
      } else {
        icon = ClockIcon;
      }
      
      return {
        title: title,
        subtitle: status,
        media: icon, // Dynamic icon based on status
      };
    },
  },
});

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

preview: {
  select: {
    title: 'title',
    featured: 'isFeatured',
    hasImage: 'mainImage',
    priority: 'priority'
  },
  prepare({title, featured, hasImage, priority}) {
    // Complex conditional logic
    let icon = DocumentIcon;
    
    if (featured && priority > 5) {
      icon = StarIcon;
    } else if (hasImage) {
      icon = ImageIcon;
    }
    
    return {
      title: title,
      subtitle: featured ? 'Featured' : 'Standard',
      media: icon,
    };
  },
}

preview: {
  select: {
    title: 'title',
    categoryType: 'category.type', // Access field from referenced document
  },
  prepare({title, categoryType}) {
    const icon = categoryType === 'blog' ? DocumentIcon : PageIcon;
    
    return {
      title: title,
      media: icon,
    };
  },
}