@shopify/app-bridge-react. Only one
Provider is needed for your application.
||Your application configuration||Yes|
||API key from Shopify Partner Dashboard||Yes|
||The hostname for the current shop. Learn more||Yes|
||Use to toggle redirecting to Shopify Admin when the app is not opened inside the Shopify Admin. Defaults to
Using App Bridge React with Polaris
App Bridge React is fully compatible with Polaris.
To use them together, wrap your app in both Polaris’s
<AppProvider> component and App Bridge React’s
Accessing the App Bridge client directly
App Bridge React provides access to the App Bridge client
app instance using the React Context API.
There are four ways to use the context API:
useAppBridge hook is available in version 1.25.0 and above. You can use the
useAppBridge hook to quickly access the App Bridge client
app in a functional component.
If you're using a version of App Bridge below 1.25.0 where the
useAppBridge hook isn't available, use React’s
useContext hook directly.
Context.Consumer to get access to the App Bridge client
app in a render prop.
Class.contextType to get access to the App Bridge client
app in a class component.