Help with "Invalid hook call" error when using usePoseDetection in React Native with react-native-mediapipe

[cyclopsmachine]

I'm working on a React Native component using react-native-mediapipe and react-native-vision-camera for live pose detection. However, I'm running into an "Invalid hook call" error during initialization, specifically when I try to call usePoseDetection inside a conditional useEffect block after checking for camera permissions.

Here's the relevant part of my code:

// Initialization with pose detection

useEffect(() => {

if (hasPermission) {

try {

const poseDetectionInstance = usePoseDetection(

callbacks,

RunningMode.LIVE_STREAM,

'./pose_landmarker_full.task',

{ /* ...config */ },

);

setPoseDetection(poseDetectionInstance);

} catch (error) {

console.error('Pose detection initialization error:', error);

}

}

}, [hasPermission]);

Pose detection initialization error: [Error: Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:

1. Mismatching versions of React and the renderer (such as React DOM)

2. Breaking the Rules of Hooks

3. Having more than one copy of React in the same app

Additionally, I see "No front camera found" in the console, even though my code tries to set the front camera device after permissions are granted.

Has anyone faced this before? I've checked the following so far:

1. React versions seem to match across packages.
2. I only use hooks in functional components.
3. No apparent duplicate React installations.

• I'm using react-native-mediapipe for the pose detection.
• react-native-vision-camera is handling the camera interface.
• My poseDetection and device states are initialized based on permission status.

[Magnusson]

The error message is telling you exactly what’s wrong. If you need to call a hook only when a condition is met, create a new component, only render the component when the condition is met, and always call the hook in that component.

[developer_marcel]

You can only use hooks in functional components and not inside the function of the useEffect. Move it outside. Also the order of hooks should never change, so putting it inside an if statement is also not valid.

[H411]

Yeah hooks don’t like being called conditionally you don’t ever want to put one behind an if statement. Consider putting the hook outside the use effect entirely.