You can access the app state using a React hook.

## useAppBridgeState

The `useAppBridgeState` hook supports accessing all or parts of the application state, including keys like `context`, `features`, and `staffMember`. For more information about options, refer to [Props](#props).

### Example code

> Note
> When using the App Bridge React library, you need to wrap all of your App Bridge React code inside of a single App Bridge [`Provider`](/docs/api/app-bridge/previous-versions/app-bridge-from-npm/using-react#provider).


Get the entire app state with no arguments.

```jsx
import {useAppBridgeState} from '@shopify/app-bridge-react';

function MyComponent {
  const appState = useAppBridgeState();

  ...
}
```

Get a specific piece of the app state with an argument.

```jsx
import {useAppBridgeState} from '@shopify/app-bridge-react';

function MyComponent {
  const staffMember = useAppBridgeState('staffMember');

  ...
}
```

## Props

|Name|Type|Description|Required|
|---|---|---|---|
|state| `"cart"`, `"client"`, `"context"`, `"contextualSaveBar"`, `"features"`, `"fullscreen"`, `"isLegacy"`, `"loading"`, `"menu"`, `"modal"`, `"navigation"`, `"pos"`, `"print"`, `"resourcePicker"`, `"scanner"`, `"sessionToken"`, `"share"`, `"staffMember"`, `"titleBar"`, `"toast"`|Key in app state to access|No|