React Native / Asynchronous and data ownership / Lesson 10

Navigation adapters and deep-link inputs

Treat route identity as validated application input and keep navigation-library and native-link configuration explicit.

About 4 min readContent reviewed 2026-10-28

On this page

Lesson goals

React Native needs a chosen navigation integration
Pass a small destination value through an adapter
Parse external URLs before resolving a record

React Native needs a chosen navigation integration

Core components do not by themselves define the application’s stack, tabs, URL mapping, or state restoration. A framework or navigation library supplies those contracts and has its own compatible dependencies. Record which integration owns history and screen lifetime before copying a navigation call from another project. Opening a route is not authorization to access its record. Deep links can bypass the menu that usually supplies inputs, so validate malformed, missing, and unavailable identifiers at the route boundary and enforce current permission at the authoritative data or command boundary.

Pass a small destination value through an adapter

The first module emits a destination value through onOpen instead of importing an unspecified navigation package. The parent adapter decides how that value maps to the chosen stack or framework. A stable identifier remains meaningful if a list reorders while the destination is open; an array position does not. Avoid passing entire mutable view models through navigation parameters, which hides lifetime and serialization assumptions. The adapter must define whether repeated activation creates duplicate destinations. The module predicts an emitted value only and does not claim a route was actually pushed.

jsx Illustrative React Native module; requires the declared compatible application host.

import {Pressable, Text} from 'react-native';
export default function WorkshopLink({id, onOpen}) {
  return <Pressable accessibilityRole="button" accessibilityLabel="Open workshop"
    onPress={() => onOpen({name: 'workshop', id})}>
    <Text>Open workshop</Text>
  </Pressable>;
}

Expected output

For id w-7, activation emits {name: "workshop", id: "w-7"} to the supplied adapter.

The host supplies and tests onOpen. No navigation library, stack transition, or native URL handoff is executed.

Parse external URLs before resolving a record

The second program accepts one synthetic HTTPS origin and path shape, rejects credentials and unexpected query or fragment content, and extracts a narrow identifier. URL parsing here runs as a standalone Node model; the actual React Native URL and linking host needs separate compatibility checks. A recognized path does not prove the workshop exists or the user may access it. Do not substitute an arbitrary default record after parse failure. Keep accepted schemes, hosts, parameter formats, and unsupported-link recovery documented so a malformed link cannot masquerade as a successful route.

javascript Standalone JavaScript model with synthetic local inputs.

function workshopRoute(raw) {
  let url;
  try { url = new URL(raw); } catch { return null; }
  if (url.protocol !== 'https:' || url.hostname !== 'learn.example.invalid'
      || url.port || url.username || url.password || url.search || url.hash) return null;
  const match = /^\/workshops\/(w-[0-9]+)$/.exec(url.pathname);
  return match ? {name: 'workshop', id: match[1]} : null;
}
console.log(JSON.stringify(workshopRoute('https://learn.example.invalid/workshops/w-7')));
console.log(workshopRoute('https://other.example.invalid/workshops/w-7'));

Expected output

{"name":"workshop","id":"w-7"}
null

The reserved invalid domains are parsed locally and never contacted. The result establishes syntax policy only.

Coordinate initial links, later events, and cancellation

Linking distinguishes an initial URL from URL events delivered while an app is running. Native platform configuration determines which links reach the application, so a pure parser cannot prove universal-link or intent-filter integration. Own event subscriptions and clean them up according to the selected host. A cancellable editor also needs draft and leave policy for hardware Back, gestures, and programmatic dismissal, not only a visible Cancel button. Restoring an old route must resolve current account ownership and data availability. A stored path is a navigation hint, not a permanent access grant.

Verify entry, exit, and ownership changes

Test normal opening, repeated activation, cancellation, direct external entry, unknown paths, missing records, and permission failure. Verify Back returns to a meaningful location and focus moves appropriately after presentation changes. On account change, invalidate private destination state and reject old asynchronous results. Node route tests cover parsing only; the configured navigation package, framework, native link association, and target accessibility need their own evidence. No external domain, device link, navigation package, or account workflow is operated by this course, and no library-specific API is presented as universally available.

Common errors and fixes

A deep link selects a plausible default record

Why it happens: Parse failure was silently replaced by an arbitrary identifier.
How to fix it: Return an explicit unsupported route or recovery state.
Prevent it next time: Test unknown hosts, extra parameters, and malformed paths.

A route index opens the wrong record after sorting

Why it happens: The parameter represented a list position rather than identity.
How to fix it: Pass a stable identifier and resolve current data.
Prevent it next time: Reorder while a detail screen remains open.

A parser pass is called native deep-link support

Why it happens: Syntax evidence was generalized to platform association and delivery.
How to fix it: Verify the configured framework and native target separately.
Prevent it next time: Record which link boundary was actually exercised.

Check your understanding

1. Why does workshopRoute reject a valid-looking path on another host?

Show worked solution

The accepted origin is part of this route contract. Matching only the pathname would allow an unrelated URL to be interpreted as trusted application input. Even an accepted origin still requires record resolution and authoritative permission checks; parsing does not grant access.

2. Does closing an editor automatically undo shared model changes?