---
title: Migrate SkeletonThumbnail from Polaris React
description: >-
  Understand the supported migration path for the Polaris React
  SkeletonThumbnail component.
source_url:
  html: >-
    https://shopify.dev/docs/apps/build/app-home/migrate-from-polaris-react/skeleton-thumbnail
  md: >-
    https://shopify.dev/docs/apps/build/app-home/migrate-from-polaris-react/skeleton-thumbnail.md
api_name: app-home
---

# Migrate Skeleton​Thumbnail from Polaris React

`SkeletonThumbnail` has no direct Polaris web component equivalent. Keep it during an incremental migration. If removing Polaris React is required, reserve the image region and use a labelled loading indicator or the resource's documented fallback until the real `s-thumbnail` source is available.

***

## Map thumbnail loading behavior

| Polaris React | Polaris web components | Migration notes |
| - | - | - |
| `size` | Reserve the destination thumbnail's supported size | Keep row height stable without copying an undocumented skeleton shape. |
| Skeleton while fetching the image URL | Labelled `s-spinner` in the image region | Name the resource that is loading when the surrounding text doesn't already do so. |
| Missing or failed image | `s-thumbnail` fallback and meaningful `alt` text | Treat failure differently from loading and don't leave the spinner running. |

Don't assign the eventual image's alternative text to a loading decoration. Add `alt` only when the real thumbnail or fallback represents the resource.

***

## Migration example

## Migrating SkeletonThumbnail

##### Polaris web components

```tsx
export function SkeletonThumbnailMigrationExample() {
  return (
    <><s-spinner accessibilityLabel="Loading image"></s-spinner></>
  );
}
```

##### Polaris React

```tsx
import {SkeletonThumbnail} from '@shopify/polaris';


export function SkeletonThumbnailMigrationExample() {

  return (
    <SkeletonThumbnail size="large" />
  );
}
```

***

## Test and remove Polaris React

* Test cached, slow, missing, and failed images.
* Verify list and table rows don't jump when the thumbnail loads.
* Remove `SkeletonThumbnail` only after loading and error outcomes both terminate correctly.

***
