react-native-screen-transitions 3.9.0-alpha.1 → 3.9.0-alpha.2

package/src/shared/components/boundary/create-boundary-component.tsx

@@ -2,34 +2,23 @@ import {
 	type ComponentType,
 	forwardRef,
 	memo,
-	useCallback,
 	useImperativeHandle,
 	useMemo,
-	useRef,
 } from "react";
-import type { View } from "react-native";
-import Animated, {
-	runOnUI,
-	useAnimatedRef,
-	useAnimatedStyle,
-} from "react-native-reanimated";
-import { NO_STYLES } from "../../constants";
+import Animated from "react-native-reanimated";
 import { useDescriptorsStore } from "../../providers/screen/descriptors";
-import { useScreenStyles } from "../../providers/screen/styles";
-import { createPendingPairKey } from "../../stores/bounds/helpers/link-pairs.helpers";
-import { prepareStyleForBounds } from "../../utils/bounds/helpers/styles/styles";
-import { logger } from "../../utils/logger";
-import { useBoundaryPresence } from "./hooks/use-boundary-presence";
-import { useInitialDestinationMeasurement } from "./hooks/use-initial-destination-measurement";
-import { useInitialSourceMeasurement } from "./hooks/use-initial-source-measurement";
-import { useMeasurer } from "./hooks/use-measurer";
-import { useRefreshBoundary } from "./hooks/use-refresh-boundary";
-import { isTeleportAvailable } from "./portal/teleport";
 import {
-	BoundaryOwnerProvider,
-	useBoundaryOwner,
-} from "./providers/boundary-owner.provider";
-import type { BoundaryComponentProps, BoundaryConfigProps } from "./types";
+	useSlotStackingStyles,
+	useSlotStyles,
+} from "../../providers/screen/styles";
+import { createBoundTag } from "../../stores/bounds/helpers/link-pairs.helpers";
+import { useBoundaryMeasurement } from "./hooks/use-boundary-measurement";
+import { resolveBoundaryPortal } from "./portal/resolve-portal";
+import {
+	BoundaryRootProvider,
+	useBoundaryRootState,
+} from "./providers/boundary-root.provider";
+import type { BoundaryComponentProps } from "./types";
 
 interface CreateBoundaryComponentOptions {
 	alreadyAnimated?: boolean;
@@ -49,7 +38,6 @@ export function createBoundaryComponent<P extends object>(
 		React.ComponentRef<typeof AnimatedComponent>,
 		BoundaryComponentProps<P>
 	>((props, forwardedRef) => {
-		const ownerRef = useAnimatedRef<View>();
 		const {
 			enabled = true,
 			group,
@@ -60,12 +48,15 @@ export function createBoundaryComponent<P extends object>(
 			method,
 			style,
 			onPress,
-			portal,
+			portal: portalProp,
 			...rest
 		} = props as any;
 
-		const linkId = String(id);
-		const entryTag = group ? `${group}:${linkId}` : linkId;
+		const boundTag = useMemo(
+			() => createBoundTag(String(id), group),
+			[id, group],
+		);
+		const portal = resolveBoundaryPortal(portalProp);
 
 		const currentScreenKey = useDescriptorsStore(
 			(s) => s.derivations.currentScreenKey,
@@ -73,154 +64,67 @@ export function createBoundaryComponent<P extends object>(
 		const hasConfiguredInterpolator = useDescriptorsStore(
 			(s) => s.derivations.hasConfiguredInterpolator,
 		);
-
 		const runtimeEnabled = enabled && hasConfiguredInterpolator;
-		const boundaryConfig = useMemo<BoundaryConfigProps>(() => {
-			return {
-				anchor,
-				scaleMode,
-				target,
-				method,
-			};
-		}, [anchor, scaleMode, target, method]);
-
-		const ownerPreparedStyles = useMemo(
-			() => prepareStyleForBounds(style),
-			[style],
-		);
-		const { stylesMap } = useScreenStyles();
-
-		const associatedStyles = useAnimatedStyle(() => {
-			"worklet";
-			return stylesMap.get()[entryTag]?.style ?? NO_STYLES;
-		});
-
-		const associatedStackingStyles = useAnimatedStyle(() => {
-			"worklet";
-			const baseStyle = stylesMap.get()[entryTag]?.style;
-			const zIndex = baseStyle?.zIndex ?? 0;
-			const elevation = baseStyle?.elevation ?? 0;
+		// Associated slot styles attach whenever the boundary is enabled,
+		// independent of whether an interpolator is configured for this transition.
+		const shouldAttachAssociatedStyles = enabled;
 
-			if (zIndex === 0 && elevation === 0) {
-				return NO_STYLES;
-			}
+		const associatedStyles = useSlotStyles(boundTag.tag);
+		const associatedStackingStyles = useSlotStackingStyles(boundTag.tag);
 
-			return { zIndex, elevation };
+		const {
+			ref,
+			contextValue,
+			measuredRef,
+			hasActiveTarget,
+			targetPreparedStyles,
+		} = useBoundaryRootState({
+			boundTag,
+			portal,
+			associatedTargetStyles: shouldAttachAssociatedStyles
+				? associatedStyles
+				: undefined,
 		});
 
-		const hasWarned = useRef(false);
-		const adjustedPortal = isTeleportAvailable ? portal : undefined;
-
-		if (!hasWarned.current && !isTeleportAvailable && portal) {
-			logger.warn(
-				"react-native-teleport is not installed and will fallback to default behavior.",
-			);
-			hasWarned.current = true;
-		}
-
-		const { contextValue, measuredRef, hasActiveTarget, targetPreparedStyles } =
-			useBoundaryOwner({
-				ownerRef,
-				associatedTargetStyles: runtimeEnabled ? associatedStyles : undefined,
-				entryTag,
-				portal: adjustedPortal,
-			});
-
-		const preparedStyles = targetPreparedStyles ?? ownerPreparedStyles;
-
-		const portalHost =
-			typeof adjustedPortal === "object"
-				? (adjustedPortal.attachTo ?? "current-screen")
-				: adjustedPortal
-					? "current-screen"
-					: undefined;
-
-		const measureBoundary = useMeasurer({
+		const { onPress: resolvedOnPress } = useBoundaryMeasurement({
+			boundTag,
 			enabled,
-			entryTag,
-			linkId,
-			group,
+			runtimeEnabled,
 			currentScreenKey,
-			preparedStyles,
-			measuredAnimatedRef: measuredRef,
-			portalHost,
-		});
-
-		// Register/unregister this boundary in the presence map so source/destination
-		// matching can resolve across concrete screen keys.
-		useBoundaryPresence({
-			enabled: runtimeEnabled,
-			entryTag,
-			currentScreenKey,
-			boundaryConfig,
-		});
-
-		const shouldPassivelyMeasureSource =
-			shouldAutoMeasure && typeof onPress !== "function";
-
-		useInitialSourceMeasurement({
-			enabled: runtimeEnabled,
-			measureBoundary,
-			linkId,
-			group,
-			shouldAutoMeasure: shouldPassivelyMeasureSource,
-		});
-
-		useInitialDestinationMeasurement({
-			linkId,
-			enabled: runtimeEnabled,
-			measureBoundary,
-		});
-
-		useRefreshBoundary({
-			enabled: runtimeEnabled,
-			linkId,
-			group,
-			measureBoundary,
+			measuredRef,
+			style,
+			targetPreparedStyles,
+			portal,
+			shouldAutoMeasure,
+			config: { anchor, scaleMode, target, method },
+			onPress,
 		});
 
-		const handlePress = useCallback(
-			(...args: unknown[]) => {
-				// Press path has priority: capture source before user onPress/navigation.
-				runOnUI(measureBoundary)({
-					type: "source",
-					pairKey: createPendingPairKey(currentScreenKey),
-				});
-
-				if (typeof onPress === "function") {
-					onPress(...args);
-				}
-			},
-			[measureBoundary, onPress, currentScreenKey],
-		);
-
-		const resolvedOnPress =
-			typeof onPress === "function" ? handlePress : undefined;
+		useImperativeHandle(forwardedRef, () => ref.current as any, [ref]);
 
-		useImperativeHandle(forwardedRef, () => ownerRef.current as any, [
-			ownerRef,
-		]);
+		// A nested active target takes the full associated style, so the root keeps
+		// only its stacking context; otherwise the root wears the full style.
+		const attachedStyle = shouldAttachAssociatedStyles
+			? hasActiveTarget
+				? associatedStackingStyles
+				: associatedStyles
+			: undefined;
 
 		return (
-			<BoundaryOwnerProvider value={contextValue}>
+			<BoundaryRootProvider value={contextValue}>
 				<AnimatedComponent
 					{...rest}
-					ref={ownerRef}
-					style={[
-						style,
-						runtimeEnabled
-							? hasActiveTarget
-								? associatedStackingStyles
-								: associatedStyles
-							: undefined,
-					]}
+					ref={ref}
+					style={[style, attachedStyle]}
 					onPress={resolvedOnPress}
 					collapsable={false}
 				/>
-			</BoundaryOwnerProvider>
+			</BoundaryRootProvider>
 		);
 	});
 
+	// The HOC's runtime identity (animated + memoized forwardRef) is not
+	// expressible against the public boundary props, so assert it here.
 	return memo(
 		Animated.createAnimatedComponent(Inner),
 	) as unknown as React.MemoExoticComponent<

package/src/shared/components/boundary/hooks/use-boundary-measurement.ts

@@ -0,0 +1,127 @@
+import { useCallback, useMemo } from "react";
+import type { View } from "react-native";
+import type { AnimatedRef, StyleProps } from "react-native-reanimated";
+import { runOnUI } from "react-native-reanimated";
+import { createPendingPairKey } from "../../../stores/bounds/helpers/link-pairs.helpers";
+import type { BoundTag } from "../../../stores/bounds/types";
+import { prepareStyleForBounds } from "../../../utils/bounds/helpers/styles/styles";
+import { resolvePortalHost } from "../portal/resolve-portal";
+import type { BoundaryConfigProps, BoundaryPortal } from "../types";
+import { useBoundaryPresence } from "./use-boundary-presence";
+import { useInitialDestinationMeasurement } from "./use-initial-destination-measurement";
+import { useInitialSourceMeasurement } from "./use-initial-source-measurement";
+import { useMeasurer } from "./use-measurer";
+import { useRefreshBoundary } from "./use-refresh-boundary";
+
+interface UseBoundaryMeasurementParams {
+	boundTag: BoundTag;
+	/** Raw `enabled` prop — drives the measurer and the passive-source gate. */
+	enabled: boolean;
+	/** `enabled && hasConfiguredInterpolator` — gates presence + lifecycle. */
+	runtimeEnabled: boolean;
+	currentScreenKey: string;
+	/** Surface to measure: a nested target's placeholder, else the root. */
+	measuredRef: AnimatedRef<View>;
+	/** Root's own style; ignored when a nested target supplies its own. */
+	style?: unknown;
+	targetPreparedStyles?: StyleProps;
+	portal?: BoundaryPortal;
+	shouldAutoMeasure: boolean;
+	config: BoundaryConfigProps;
+	onPress?: (...args: unknown[]) => void;
+}
+
+/**
+ * Owns the full measurement lifecycle for a boundary: builds the measurer,
+ * registers presence, runs the initial source/destination + refresh reactions,
+ * and returns the press-priority `onPress`. The component never touches the
+ * measurer itself.
+ */
+export const useBoundaryMeasurement = ({
+	boundTag,
+	enabled,
+	runtimeEnabled,
+	currentScreenKey,
+	measuredRef,
+	style,
+	targetPreparedStyles,
+	portal,
+	shouldAutoMeasure,
+	config,
+	onPress,
+}: UseBoundaryMeasurementParams) => {
+	const { anchor, scaleMode, target, method } = config;
+	const boundaryConfig = useMemo<BoundaryConfigProps>(
+		() => ({ anchor, scaleMode, target, method }),
+		[anchor, scaleMode, target, method],
+	);
+
+	const rootPreparedStyles = useMemo(
+		() => prepareStyleForBounds(style),
+		[style],
+	);
+	const preparedStyles = targetPreparedStyles ?? rootPreparedStyles;
+
+	const portalHost = resolvePortalHost(portal);
+
+	const measureBoundary = useMeasurer({
+		enabled,
+		boundTag,
+		currentScreenKey,
+		preparedStyles,
+		measuredAnimatedRef: measuredRef,
+		portalHost,
+	});
+
+	// Register/unregister this boundary in the presence map so source/destination
+	// matching can resolve across concrete screen keys.
+	useBoundaryPresence({
+		enabled: runtimeEnabled,
+		boundTag,
+		currentScreenKey,
+		boundaryConfig,
+	});
+
+	// Passive auto-measurement only applies to non-pressable boundaries; pressable
+	// ones capture their source on press (see handlePress below).
+	const shouldPassivelyMeasureSource =
+		shouldAutoMeasure && typeof onPress !== "function";
+
+	useInitialSourceMeasurement({
+		enabled: runtimeEnabled,
+		measureBoundary,
+		boundTag,
+		shouldAutoMeasure: shouldPassivelyMeasureSource,
+	});
+
+	useInitialDestinationMeasurement({
+		boundTag,
+		enabled: runtimeEnabled,
+		measureBoundary,
+	});
+
+	useRefreshBoundary({
+		enabled: runtimeEnabled,
+		boundTag,
+		measureBoundary,
+	});
+
+	const handlePress = useCallback(
+		(...args: unknown[]) => {
+			// Press path has priority: capture source before user onPress/navigation.
+			runOnUI(measureBoundary)({
+				type: "source",
+				pairKey: createPendingPairKey(currentScreenKey),
+			});
+
+			if (typeof onPress === "function") {
+				onPress(...args);
+			}
+		},
+		[measureBoundary, onPress, currentScreenKey],
+	);
+
+	return {
+		onPress: typeof onPress === "function" ? handlePress : undefined,
+	};
+};

package/src/shared/components/boundary/hooks/use-boundary-presence.ts

@@ -4,25 +4,27 @@ import {
 	removeEntry,
 	setEntry,
 } from "../../../stores/bounds/internals/entries";
+import type { BoundTag } from "../../../stores/bounds/types";
 import type { BoundaryConfigProps } from "../types";
 
 export const useBoundaryPresence = (params: {
 	enabled: boolean;
-	entryTag: string;
+	boundTag: BoundTag;
 	currentScreenKey: string;
 	boundaryConfig?: BoundaryConfigProps;
 }) => {
-	const { enabled, entryTag, currentScreenKey, boundaryConfig } = params;
+	const { enabled, boundTag, currentScreenKey, boundaryConfig } = params;
+	const { tag } = boundTag;
 
 	useLayoutEffect(() => {
 		if (!enabled) return;
 
-		runOnUI(setEntry)(entryTag, currentScreenKey, {
+		runOnUI(setEntry)(tag, currentScreenKey, {
 			boundaryConfig,
 		});
 
 		return () => {
-			runOnUI(removeEntry)(entryTag, currentScreenKey);
+			runOnUI(removeEntry)(tag, currentScreenKey);
 		};
-	}, [enabled, entryTag, currentScreenKey, boundaryConfig]);
+	}, [enabled, tag, currentScreenKey, boundaryConfig]);
 };

package/src/shared/components/boundary/hooks/use-initial-destination-measurement.ts

@@ -9,6 +9,7 @@ import { useDescriptorsStore } from "../../../providers/screen/descriptors";
 import { AnimationStore } from "../../../stores/animation.store";
 import { getDestination } from "../../../stores/bounds/internals/links";
 import { pairs } from "../../../stores/bounds/internals/state";
+import type { BoundTag } from "../../../stores/bounds/types";
 import {
 	LifecycleTransitionRequestKind,
 	SystemStore,
@@ -17,7 +18,7 @@ import { logger } from "../../../utils/logger";
 import type { MeasureBoundary } from "../types";
 import { getInitialDestinationMeasurePairKey } from "../utils/destination-signals";
 
-const VIEWPORT_RETRY_DELAY_MS = 16;
+const VIEWPORT_RETRY_DELAY_MS = 100;
 /**
  * A destination that keeps failing its measurement guards must not hold the
  * transition gate forever — after this budget the block is released with a
@@ -26,16 +27,17 @@ const VIEWPORT_RETRY_DELAY_MS = 16;
 const MAX_VIEWPORT_RETRIES = 20;
 
 interface UseInitialDestinationMeasurementParams {
-	linkId: string;
+	boundTag: BoundTag;
 	enabled: boolean;
 	measureBoundary: MeasureBoundary;
 }
 
 export const useInitialDestinationMeasurement = ({
-	linkId,
+	boundTag,
 	enabled,
 	measureBoundary,
 }: UseInitialDestinationMeasurementParams) => {
+	const { linkKey, group } = boundTag;
 	const currentScreenKey = useDescriptorsStore(
 		(s) => s.derivations.currentScreenKey,
 	);
@@ -51,9 +53,12 @@ export const useInitialDestinationMeasurement = ({
 		currentScreenKey,
 		"transitionProgress",
 	);
-	const system = SystemStore.getBag(currentScreenKey);
-	const { pendingLifecycleRequestKind } = system;
-	const { blockLifecycleStart, unblockLifecycleStart } = system.actions;
+
+	const {
+		pendingLifecycleRequestKind,
+		actions: { blockLifecycleStart, unblockLifecycleStart },
+	} = SystemStore.getBag(currentScreenKey);
+
 	const isBlockingLifecycleStart = useSharedValue(0);
 	const retryToken = useSharedValue(0);
 	const viewportRetries = useSharedValue(0);
@@ -90,7 +95,8 @@ export const useInitialDestinationMeasurement = ({
 				enabled: destinationEnabled,
 				destinationPairKey,
 				ancestorDestinationPairKey,
-				linkId,
+				linkId: linkKey,
+				group,
 				linkState:
 					destinationEnabled &&
 					(destinationPairKey || ancestorDestinationPairKey)
@@ -100,7 +106,7 @@ export const useInitialDestinationMeasurement = ({
 
 			return [measurePairKey, retryTick] as const;
 		},
-		([measurePairKey]) => {
+		([measurePairKey, retryTick], previous) => {
 			"worklet";
 			if (!measurePairKey) {
 				releaseLifecycleStartBlock();
@@ -109,6 +115,16 @@ export const useInitialDestinationMeasurement = ({
 				return;
 			}
 
+			const previousMeasurePairKey = previous?.[0];
+			const previousRetryTick = previous?.[1];
+			const shouldAttemptMeasure =
+				measurePairKey !== previousMeasurePairKey ||
+				retryTick !== previousRetryTick;
+
+			if (!shouldAttemptMeasure) {
+				return;
+			}
+
 			if (hasGivenUp.get()) {
 				return;
 			}
@@ -124,7 +140,7 @@ export const useInitialDestinationMeasurement = ({
 			});
 
 			const destinationAttached =
-				getDestination(measurePairKey, linkId) !== null;
+				getDestination(measurePairKey, linkKey) !== null;
 
 			if (destinationAttached) {
 				releaseLifecycleStartBlock();
@@ -136,13 +152,13 @@ export const useInitialDestinationMeasurement = ({
 				hasGivenUp.set(1);
 				releaseLifecycleStartBlock();
 				logger.warn(
-					`Destination boundary "${linkId}" never produced a valid measurement after ${MAX_VIEWPORT_RETRIES} attempts; releasing the transition gate without it. The boundary is likely off-viewport (e.g. an inactive group member on a paged screen) or unmounted.`,
+					`Destination boundary "${linkKey}" never produced a valid measurement after ${MAX_VIEWPORT_RETRIES} attempts; releasing the transition gate without it. The boundary is likely off-viewport (e.g. an inactive group member on a paged screen) or unmounted.`,
 				);
 				return;
 			}
 
 			// Destination did not attach (malformed off-screen measurement); retry
-			// on the next tick while the lifecycle stays blocked.
+			// after the retry token advances while the lifecycle stays blocked.
 			viewportRetries.set(viewportRetries.get() + 1);
 			cancelAnimation(retryToken);
 			retryToken.set(

package/src/shared/components/boundary/hooks/use-initial-source-measurement.ts

@@ -1,17 +1,17 @@
 import { useAnimatedReaction, useSharedValue } from "react-native-reanimated";
 import { useDescriptorsStore } from "../../../providers/screen/descriptors";
 import { pairs } from "../../../stores/bounds/internals/state";
+import type { BoundTag } from "../../../stores/bounds/types";
 import type { MeasureBoundary } from "../types";
 import { getInitialSourceCaptureSignal } from "../utils/source-signals";
 
 export const useInitialSourceMeasurement = (params: {
 	enabled: boolean;
 	measureBoundary: MeasureBoundary;
-	linkId: string;
-	group?: string;
+	boundTag: BoundTag;
 	shouldAutoMeasure: boolean;
 }) => {
-	const { enabled, measureBoundary, linkId, group, shouldAutoMeasure } = params;
+	const { enabled, measureBoundary, boundTag, shouldAutoMeasure } = params;
 	const sourcePairKey = useDescriptorsStore((s) => s.derivations.sourcePairKey);
 	const lastSourceCaptureSignal = useSharedValue<string | null>(null);
 
@@ -21,8 +21,8 @@ export const useInitialSourceMeasurement = (params: {
 			return getInitialSourceCaptureSignal({
 				enabled,
 				sourcePairKey,
-				linkId,
-				group,
+				linkId: boundTag.linkKey,
+				group: boundTag.group,
 				shouldAutoMeasure,
 				linkState: shouldAutoMeasure && sourcePairKey ? pairs.get() : undefined,
 			});

package/src/shared/components/boundary/hooks/use-measurer.ts

@@ -8,7 +8,10 @@ import {
 } from "react-native-reanimated";
 import { applyMeasuredBoundsWrites } from "../../../providers/helpers/measured-bounds-writes";
 import { useOriginContext } from "../../../providers/screen/origin.provider";
-import type { BoundsPortalAttachTarget } from "../../../stores/bounds/types";
+import type {
+	BoundsPortalAttachTarget,
+	BoundTag,
+} from "../../../stores/bounds/types";
 import { ScrollStore } from "../../../stores/scroll.store";
 import { SystemStore } from "../../../stores/system.store";
 import { getActiveScrollHost } from "../portal/stores/host-registry.store";
@@ -22,9 +25,7 @@ import {
 
 interface UseMeasurerParams {
 	enabled: boolean;
-	entryTag: string;
-	linkId: string;
-	group?: string;
+	boundTag: BoundTag;
 	currentScreenKey: string;
 	preparedStyles: StyleProps;
 	measuredAnimatedRef: AnimatedRef<View>;
@@ -33,9 +34,7 @@ interface UseMeasurerParams {
 
 export const useMeasurer = ({
 	enabled,
-	entryTag,
-	linkId,
-	group,
+	boundTag,
 	currentScreenKey,
 	preparedStyles,
 	measuredAnimatedRef,
@@ -78,7 +77,7 @@ export const useMeasurer = ({
 			 * lifecycle blocked until a valid retry lands.
 			 */
 			const shouldGuardDestinationViewport =
-				pendingLifecycleStartBlockCount.get() > 0 || !!group;
+				pendingLifecycleStartBlockCount.get() > 0 || !!boundTag.group;
 
 			const viewportAllowsDestinationWrite =
 				target.type !== "destination" ||
@@ -101,9 +100,9 @@ export const useMeasurer = ({
 					: undefined;
 
 			applyMeasuredBoundsWrites({
-				entryTag,
-				linkId,
-				group,
+				entryTag: boundTag.tag,
+				linkId: boundTag.linkKey,
+				group: boundTag.group,
 				currentScreenKey,
 				measured: measuredWithScroll,
 				preparedStyles,
@@ -114,9 +113,7 @@ export const useMeasurer = ({
 		},
 		[
 			enabled,
-			entryTag,
-			linkId,
-			group,
+			boundTag,
 			currentScreenKey,
 			preparedStyles,
 			measuredAnimatedRef,

package/src/shared/components/boundary/hooks/use-refresh-boundary.ts

@@ -2,22 +2,22 @@ import { useAnimatedReaction } from "react-native-reanimated";
 import { useDescriptorsStore } from "../../../providers/screen/descriptors";
 import { AnimationStore } from "../../../stores/animation.store";
 import { pairs } from "../../../stores/bounds/internals/state";
+import type { BoundTag } from "../../../stores/bounds/types";
 import type { MeasureBoundary } from "../types";
 import { getRefreshBoundarySignal } from "../utils/refresh-signals";
 
 interface UseRefreshBoundaryParams {
 	enabled: boolean;
-	linkId: string;
-	group?: string;
+	boundTag: BoundTag;
 	measureBoundary: MeasureBoundary;
 }
 
 export const useRefreshBoundary = ({
 	enabled,
-	linkId,
-	group,
+	boundTag,
 	measureBoundary,
 }: UseRefreshBoundaryParams) => {
+	const { linkKey, group } = boundTag;
 	const currentScreenKey = useDescriptorsStore(
 		(s) => s.derivations.currentScreenKey,
 	);
@@ -57,7 +57,7 @@ export const useRefreshBoundary = ({
 				destinationPairKey,
 				ancestorDestinationPairKey,
 				nextScreenKey,
-				linkId,
+				linkId: linkKey,
 				group,
 				shouldRefresh: !!refreshWillAnimate.get(),
 				closing: !!refreshClosing.get(),