native-intent

12 notes, read out of this brain and free to use. Each one was extracted from a source and is re-checked against its exam.

+native-intent.tsx file location and purpose

Create a special file called +native-intent.tsx at the top level of your project's src/app directory. This file exports a redirectSystemPath method designed to handle URL/path processing for native deep links.

redirectSystemPath function signature and parameters

The redirectSystemPath method receives an options object with two attributes: path (the incoming URL or path, which may not be a valid URL) and initial (a boolean indicating whether this is an initial app launch deep link).

redirectSystemPath should handle errors gracefully

Do not crash inside the redirectSystemPath function. Instead, redirect users to a custom error route to handle unexpected errors where they are able to report the incident. Use try-catch blocks and return a fallback route like '/unexpected-error' when errors occur.

redirectSystemPath native-only limitation

The redirectSystemPath method only works on native apps. It will not work on the web, as +native-intent is only available in native apps.

redirectSystemPath lacks context about app state

The +native-intent is processed outside the context of your app. This means you won't have access to additional logic such as user authentication status or the current route's state. For context-aware URL rewrites, use usePathname() hook in _layout files instead.

Rewrite URLs while app is open using usePathname

While your app is open, you can react to URL changes within your _layout files using the usePathname() hook. The location of the _layout dictates the scope: add logic to your root _layout file for global changes, or add a _layout file to an existing directory or group directory for localized changes.

Web deep link handling requires alternative patterns

Expo Router cannot provide a direct counterpart to +native-intent for web, as web routing is resolved before the website's JavaScript is executed. Implement one of these patterns instead: Server Redirect (using server-side redirection or middleware) for server or static outputs, or Client Redirect (managing URL redirects within your app's root _layout) for client-side rendering.

Forcing web links with fully qualified URLs

If you want a URL to be initially evaluated by the user's browser, write the address as a Fully Qualified URL (FQDN) with an http or https scheme. Using a complete URL ensures that the link is interpreted as a web URL and opened in the user's browser by default.

redirectSystemPath example with third-party provider

Example code showing how to use redirectSystemPath: import ThirdPartyService from 'third-party-sdk'; export function redirectSystemPath({ path, initial }) { try { if (initial) { const url = new URL(path, 'myapp://app.home'); if (url.hostname === '<third-party-provider-hostname>') { return ThirdPartyService.processReferringUrl(url).catch(() => { return '/unexpected-error'; }); } return path; } return path; } catch { return '/unexpected-error'; } }

Sending navigation events to third-party services

Example code showing how to send navigation events to an external service: import ThirdPartyService from 'third-party-sdk'; import { Slot, usePathname } from 'expo-router'; const thirdParty = new ThirdPartyService(); export default function RootLayout() { const pathname = usePathname(); useEffect(() => { thirdParty.register(); return () => { thirdParty.deregister(); }; }, [thirdParty]); useEffect(() => { thirdParty.sendEvent({ pathname }); }, [pathname]); return <Slot />; }

Universal Links and multiple domains do not require configuration

Expo Router does not require additional configuration for Universal Links and multiple domains. All URLs provided to your app will be evaluated. To customize the URL scheme(s) for your app, customize the scheme value in your app config.

legacy_subscribe API availability and recommendation

legacy_subscribe is in alpha and available in SDK 52. It allows integration with third-party providers that support React Navigation via the Linking.subscribe function. Using this API is not recommended for new projects or integrations, as its usage is incompatible with server-side routing and static rendering, and can be challenging to manage while offline or in low network connectivity.

Give your agent this brain