You cannot select more than 25 topics
			Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
		
		
		
		
		
			
		
			
				
	
	
	
		
			1.7 KiB
		
	
	
	
			
		
		
	
	
			1.7 KiB
		
	
	
	
With image
const message = {
  id: '1',
  thumbnailObjectUrl: 'https://placekitten.com/76/67',
  attachments: [
    {
      fileName: 'foo.jpg',
      contentType: 'image/jpeg',
    },
  ],
};
<MediaGridItem i18n={util.i18n} message={message} />;
With video
const message = {
  id: '1',
  thumbnailObjectUrl: 'https://placekitten.com/76/67',
  attachments: [
    {
      fileName: 'foo.jpg',
      contentType: 'video/mp4',
    },
  ],
};
<MediaGridItem i18n={util.i18n} message={message} />;
Missing image
const message = {
  id: '1',
  attachments: [
    {
      fileName: 'foo.jpg',
      contentType: 'image/jpeg',
    },
  ],
};
<MediaGridItem i18n={util.i18n} message={message} />;
Missing video
const message = {
  id: '1',
  attachments: [
    {
      fileName: 'foo.jpg',
      contentType: 'video/mp4',
    },
  ],
};
<MediaGridItem i18n={util.i18n} message={message} />;
Image thumbnail failed to load
const message = {
  id: '1',
  thumbnailObjectUrl: 'nonexistent',
  attachments: [
    {
      fileName: 'foo.jpg',
      contentType: 'image/jpeg',
    },
  ],
};
<MediaGridItem i18n={util.i18n} message={message} />;
Video thumbnail failed to load
const message = {
  id: '1',
  thumbnailObjectUrl: 'nonexistent',
  attachments: [
    {
      fileName: 'foo.jpg',
      contentType: 'video/mp4',
    },
  ],
};
<MediaGridItem i18n={util.i18n} message={message} />;
Other contentType
const message = {
  id: '1',
  attachments: [
    {
      fileName: 'foo.jpg',
      contentType: 'application/json',
    },
  ],
};
<MediaGridItem i18n={util.i18n} message={message} />;