NativeModules.RNRadar is undefined error

I'm creating a fairly complex Expo + React Native mobile app. I'm using the latest version of react-native-radar, performed all the steps mentioned in the documentation, got this error which said NativeModules.RNRadar is undefined.

I want to use the autocomplete as well as couple other features as well, and wrote this code: import { View, TouchableOpacity, Text } from 'react-native'; import React, { useEffect } from 'react'; import { useNavigation, useRouter } from 'expo-router'; import { Colors } from '../../constants/Colors'; import Ionicons from '@expo/vector-icons/Ionicons'; import Radar, { Autocomplete } from 'react-native-radar';

Radar.initialize(process.env.EXPO_PUBLIC_RADAR_API_KEY);

const SearchPlace = () => { const navigation = useNavigation(); const router = useRouter();

useEffect(() => { navigation.setOptions({ headerShown: false, }); }, []);

return ( <View style={{ padding: 25, paddingTop: 60, backgroundColor: Colors.white, height: '100%', }}

<TouchableOpacity onPress={() => router.back()}>

  <View style={{ marginTop: 10 }}>
    <Text>hi</Text>
    <Autocomplete options={{
      debounceMs: 3000,
      onSelection: (address) => {
        console.log(address);

      },
    }}
    />
  </View>
</View>

); };

export default SearchPlace;

My app.json: { "expo": { "name": "ai_travel_planner_react_native", "slug": "ai_travel_planner_react_native", "version": "1.0.0", "orientation": "portrait", "icon": "./assets/images/icon.png", "scheme": "myapp", "userInterfaceStyle": "automatic", "splash": { "image": "./assets/images/splash.png", "resizeMode": "contain", "backgroundColor": "#ffffff" }, "ios": { "supportsTablet": true }, "android": { "adaptiveIcon": { "foregroundImage": "./assets/images/adaptive-icon.png", "backgroundColor": "#ffffff" } }, "web": { "bundler": "metro", "output": "static", "favicon": "./assets/images/favicon.png" }, "plugins": [ "expo-router", [ "react-native-radar", { "iosFraud": true, "iosNSLocationWhenInUseUsageDescription": "Your location permission prompt", "iosNSLocationAlwaysAndWhenInUseUsageDescription": "Your location permission prompt", "iosBackgroundMode": true, "androidFraud": true, "androidBackgroundPermission": true, "androidFineLocationPermission": true, "addRadarSDKMotion":true } ], ["@maplibre/maplibre-react-native"] ], "experiments": { "typedRoutes": true } } } This is my package.json as u can see I also tried installing the maplibre package but error was not resolved. { "name": "ai_travel_planner_react_native", "main": "expo-router/entry", "version": "1.0.0", "scripts": { "start": "expo start", "reset-project": "node ./scripts/reset-project.js", "android": "expo start --android", "ios": "expo start --ios", "web": "expo start --web", "test": "jest --watchAll", "lint": "expo lint" }, "jest": { "preset": "jest-expo" }, "dependencies": { "@expo/vector-icons": "^14.0.2", "@maplibre/maplibre-react-native": "^10.0.0-alpha.10", "@react-native-async-storage/async-storage": "^1.24.0", "@react-navigation/native": "^6.0.2", "expo": "^51.0.31", "expo-constants": "~16.0.2", "expo-font": "~12.0.9", "expo-linking": "~6.3.1", "expo-router": "~3.5.23", "expo-splash-screen": "~0.27.5", "expo-status-bar": "~1.12.1", "expo-system-ui": "~3.0.7", "expo-web-browser": "~13.0.3", "firebase": "^10.13.0", "link": "^2.1.1", "react": "18.2.0", "react-dom": "18.2.0", "react-native": "^0.74.5", "react-native-gesture-handler": "~2.16.1", "react-native-radar": "^3.17.0", "react-native-reanimated": "~3.10.1", "react-native-safe-area-context": "4.10.5", "react-native-screens": "3.31.1", "react-native-web": "~0.19.10" }, "devDependencies": { "@babel/core": "^7.20.0", "@types/jest": "^29.5.12", "@types/react": "~18.2.45", "@types/react-test-renderer": "^18.0.7", "jest": "^29.2.1", "jest-expo": "~51.0.3", "react-test-renderer": "18.2.0", "typescript": "~5.3.3" }, "private": true }

React native radar version 3.17.0 as you can see from the package.json. Any help is appreciated!!

radarlabs / react-native-radar

NativeModules.RNRadar is undefined error #350