> Deprecated:
> Product subscription app extensions won't be supported as of December 3, 2025. You should migrate existing product subscription app extensions to [purchase options extensions](/docs/apps/build/purchase-options/purchase-options-extensions).
Spinners are used to show merchants that your app is loading, or an action is being performed. Generally when a spinner is being used, the user shouldn't be able to interact.
```ts?title: "JavaScript"
import {extend, Spinner} from '@shopify/admin-ui-extensions';
extend('Playground', (root) => {
const spinner = root.createComponent(Spinner);
root.appendChild(spinner);
setTimeout(() => {
root.removeChild(spinner);
}, 2000);
root.mount();
});
```
```tsx?title: "React"
import React from 'react';
import {extend, render, Spinner} from '@shopify/admin-ui-extensions-react';
function App() {
return ;
}
extend(
'Playground',
render(() => ),
);
```
| โ
Do | ๐ Don't |
| ---------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------ |
| Use Spinner to show that content is loading, or an action is being processed | Donโt place Spinners for each loading element. Rather, Spinners should be at the top level of the section they apply to. |
For more guidelines, refer to Polaris' [Spinner best practices](https://polaris.shopify.com/components/feedback-indicators/spinner#best-practices).