# AdminAction
AdminAction is a component used by Admin action extensions to configure a primary and secondary action and title. Use of this component is required in order to use Admin action extensions.
### Set the primary and secondary action of the Action modal.

```tsx
import React from 'react';
import {
  reactExtension,
  AdminAction,
  Button,
  Text,
} from '@shopify/ui-extensions-react/admin';

function App() {
  return (
    <AdminAction
      title="My App Action"
      primaryAction={
        <Button onPress={() => {}}>Action</Button>
      }
      secondaryAction={
        <Button onPress={() => {}}>
          Secondary
        </Button>
      }
    >
      <Text>Modal content</Text>
    </AdminAction>
  );
}

export default reactExtension(
  'Playground',
  () => <App />,
);

```

```js
import {extension, AdminAction, Button} from '@shopify/ui-extensions/admin';

export default extension('Playground', (root) => {
  const primaryAction = root.createFragment();
  const secondaryAction = root.createFragment();

  primaryAction.appendChild(
    root.createComponent(Button, {onPress: () => {}}, 'Action')
  );
  secondaryAction.appendChild(
    root.createComponent(Button, {onPress: () => {}}, 'Secondary')
  );

  const adminAction = root.createComponent(AdminAction, {
    title: 'My App Action',
    primaryAction,
    secondaryAction,
  }, 'Modal content');

  root.appendChild(adminAction);
  root.mount();
});

```


## AdminActionProps

### AdminActionProps

### loading
Sets the loading state of the action modal
### primaryAction
Sets the Primary action button of the container. This component must be a button component.
### secondaryAction
Sets the Secondary action button of the container. This component must be a button component.
### title
Sets the title of the Action container. If not provided, the name of the extension will be used. Titles longer than 40 characters will be truncated.
## Related
- [AdminBlock](/docs/api/admin-extensions/components/other/adminblock)