diff --git a/includes/react-native-react-navigation-setup.mdx b/includes/react-native-react-navigation-setup.mdx index 55742a1d806eb..a970ceb4fe33b 100644 --- a/includes/react-native-react-navigation-setup.mdx +++ b/includes/react-native-react-navigation-setup.mdx @@ -1,3 +1,5 @@ +### Manual Setup + ```jsx {5, 20} {tabTitle: Functional Components} import * as Sentry from "@sentry/react-native"; import { NavigationContainer, createNavigationContainerRef } from "@react-navigation/native"; @@ -53,3 +55,28 @@ class App extends React.Component { } } ``` + +### With Sentry.NavigationContainer + +`Sentry.NavigationContainer` is a drop-in replacement for React Navigation's `NavigationContainer` that handles registration automatically. It accepts all the same props, including `ref` for imperative navigation. + +```jsx +import * as Sentry from "@sentry/react-native"; + +Sentry.init({ + dsn: "___PUBLIC_DSN___", + integrations: [ + Sentry.reactNavigationIntegration({ + enableTimeToInitialDisplay: true, + }), + ], +}); + +function App() { + return ( + + {/* Your navigation structure */} + + ); +} +```