I'm using macOs sonoma 14.4.1 and xcode 15.3 simulator setup 17.4, and I'm using it for react native. I'm trying to implement fastlane to deploy my app to deploy my app to testflight. but as i running command fastlane beta, my app getting build for first few times but there i'm facing an issue of authentication when it run for uploading it to testflight. And after running for 2 to 3 times my destination got unset from the xcode and if i try to run command for installing my app on the phone or simmulator then I'm this enter image description here while i have installed the platform on my system. and if I'm restarting my system then its getting resolved itself. please help to find me a solution

I Tried many ways to fix it

I'm encountering an error while trying to build my React Native iOS app. The error message I'm receiving is:

Incompatible function pointer types passing 'YGSize (YGNodeConstRef,float, YGMeasureMode, float, YGMeasureMode)' (aka 'struct YGSize(const struct YGNode , float, enum YGMeasureMode, float, enumYGMeasureMode)') to parameter of type 'YGMeasureFunc' (aka 'structYGSize ()(struct YGNode *, float, enum YGMeasureMode, float, enumYGMeasureMode)')

I'm not entirely sure what's causing this error or how to resolve it. From what I understand, it seems to be related to incompatible function pointer types for YGMeasureFunc.

I've tried researching this issue, but I couldn't find a clear solution. Has anyone encountered a similar problem before, and if so, how did you resolve it?

Trying to connect to a credit cart swiping machine using websockets. i am using react native as a POS application. I am getting the following error when i try with iOS (ipad).

{"code": 1006, "isTrusted": false, "reason": "The operation couldn’t be completed. (OSStatus error -9807.)"}

Code:

const ws = new WebSocket('wss://192.168.1.2:8443');            ws.onopen = () => {                console.log("Connection Established")                ws.send('Initiate Payment');            };            ws.onmessage = e => {                console.log(e.data)            }            ws.onerror = e => {                console.log(e.message);            }            ws.onclose = e => {               console.log(e, e.code, e.reason);            }

"react": "18.2.0","react-native": "0.74.0",

I tried connecting through postman and i am successfully able to make connection

I get this error below when trying to build a react native app on xcode

Info.plist Error Unable to process Info.plist at path /Library/Developer/Xcode/DerivedData/.....app/Info.plist

What is info.plist? and how can i go about solving this issue.

I try creating a new Info.plist manually but it isn't working, can xcode automatically create it

My application only loads one web page, but it is taking about 10 to 15 seconds to load the first time after installation, which caused Apple to reject my submission. My application was made in react-native.

I'm getting the returns in the compilation:

Warning: -[BETextInput attributedMarkedText] is unimplemented

WebContent process (0x11b01c680) took 1.044328 seconds to launch

Failed to request allowed query parameters from WebPrivacy.

My code:

import React, {useEffect, useState} from 'react';import {View, Text, StyleSheet, SafeAreaView, BackHandler} from 'react-native';import {WebView} from 'react-native-webview';export default function App() {  const [isLoading, setIsLoading] = useState(true);  useEffect(() => {    BackHandler.addEventListener('backPress', () => true);    return () => BackHandler.removeEventListener('backPress', () => true);  }, []);  const handleLoad = () => {    setIsLoading(false);  };  return (<SafeAreaView style={styles.container}><WebView        source={{uri: 'https://www.google.com'}}        style={styles.webView}        onLoad={handleLoad}      />      {isLoading && (<View style={styles.loadingContainer}><Text style={styles.loadingText}>Carregando...</Text></View>      )}</SafeAreaView>  );}const styles = StyleSheet.create({  container: {    flex: 1,  },  webView: {    flex: 1,  },  loadingContainer: {    ...StyleSheet.absoluteFillObject,    justifyContent: 'center',    alignItems: 'center',    backgroundColor: 'rgba(0, 0, 0, 0.5)',  },  loadingText: {    fontSize: 20,    color: 'white',  },});

I tried change my url, but it's not work.I remove my function to loading my web page and the erros and it was working, but i need use the functions.

I have a React Native app that I'm trying to run on the iOS Simulator on my laptop. To launch this, I do npm start from my project directory, which shows the nice Metro icon then

r - reload the appd - open developer menui - run on iOSa - run on Android

Before, when I hit i, it would work the majority of the time but sometimes get hung up on a particular step. After some recent changes and installing a new library (and successfully doing npx pod-install), it's now getting hung up on the same step every time.

The step is: after hitting i, I get this:

info Opening the app on iOS...info Found Xcode workspace "notoapprn.xcworkspace"info Found booted iPhone 14info Launching iPhone 14info Building (using "xcodebuild -workspace notoapprn.xcworkspace -configuration Debug -scheme notoapprn -destination id=5655375F-31B9-47EC-9DD1-196F4CB8C86D")info 💡 Tip: Make sure that you have set up your development environment correctly, by running react-native doctor. To read more about doctor command visit: https://github.com/react-native-community/cli/blob/main/packages/cli-doctor/README.md#doctorCommand line invocation:    /Applications/Xcode.app/Contents/Developer/usr/bin/xcodebuild -workspace notoapprn.xcworkspace -configuration Debug -scheme notoapprn -destination id=5655375F-31B9-47EC-9DD1-196F4CB8C86DUser defaults from command line:    IDEPackageSupportUseBuiltinSCM = YESPrepare packagesComputeTargetDependencyGraphnote: Building targets in dependency ordernote: Target dependency graph (68 targets)Target 'notoapprn' in project 'notoapprn'➜ Explicit dependency on target 'NotoMeShare' in project 'notoapprn'➜ Implicit dependency on target 'Pods-notoapprn' in project 'Pods' via file 'libPods-notoapprn.a' in build phase 'Link Binary'➜ Implicit dependency on target 'CocoaAsyncSocket' in project 'Pods' via options '-lCocoaAsyncSocket' in build setting 'OTHER_LDFLAGS'➜ Implicit dependency on target 'DoubleConversion' in project 'Pods' via options '-lDoubleConversion' in build setting 'OTHER_LDFLAGS'...

and many more lines noting Targets and their explicit / implicit dependencies. However, when it gets hung up, it'll literally print only part of a line, then nothing continues to happen, eg:

➜ Implicit dependency on target 'RCT-Folly' in project 'Pods' via options '-lRCT-Folly' in build setting 'OTHER_LDFLAGS'➜ Implicit dependency on target 'RCTTypeSafety' in project 'Pods' via options '-lRCTTypeSafety' in build setting 'OTHER_LDFLAGS'➜ Implicit dependency on target 'RNShareMenu' in project 'Pods' via options '-lRNShareMenu' in build setting 'OTHER_LDFLAGS'➜ Implicit dependency on target 'React-Codegen' in project 'Pods' via op

The line is seemingly broken partway through.

More mysteriously, if I cancel this command and try running it all again, it'll get hung up again but possibly in a different spot in the list of targets/dependencies.

Any tips on debugging this?

I am using react-native-sound library to load and play sound in iOS.When i receive a remote notification, I want that ringtone to play.It works fine when app is in foreground state but it never plays the ringtone when iOS app is in background and inactive state

I tried adding

<key>UIBackgroundModes</key><array><string>audio</string><string>fetch</string><string>processing</string><string>remote-notification</string></array>

and also added my app target like this in info.plist

<key>BGTaskSchedulerPermittedIdentifiers</key><array><string>{BUNDLE_IDENTIFIER}</string></array>

I tried cleaning cache, rebuilding it many times but without luck.

I expected the ringtone to play smoothly as it worked in foreground state.

How can I make a button so that user can share link to their Instagram DM?I saw 'Locket Widget' app's invitation works like that.

is there any hidden Deeplink? or any library? In my sight, none of them worked ...

I've searched for like 4 hours, but all of contents are about sharing Instagram Stories, not DM.instagram://sharesheet?text={link} not works as same as Locket Widget,RN's shareSingle also not works.And the Documents from instagram official has been removed.Is there anyone can help me?

I am using react-native-sound library to load and play sound in iOS.When i receive a remote notification, I want that ringtone to play.It works fine when app is in foreground state but it never plays the ringtone when iOS app is in background and inactive state

I tried adding

<key>UIBackgroundModes</key><array><string>audio</string><string>fetch</string><string>processing</string><string>remote-notification</string></array>

and also added my app target like this in info.plist

<key>BGTaskSchedulerPermittedIdentifiers</key><array><string>{BUNDLE_IDENTIFIER}</string></array>

I tried cleaning cache, rebuilding it many times but without luck.

I expected the ringtone to play smoothly as it worked in foreground state.

In my react-native app the modal opens up only in few screens in iOS but all the necessary screens in Android.

I have a navigator setup the following way

import { createStackNavigator } from '@react-navigation/stack';const Stack = createStackNavigator();function SoupNavigator() {    return (<Stack.Navigator ><Stack.Screen name = 'marvel' component = {Marvel} /><Stack.Screen name = 'dc' component = {DC}                options  = {{                    title: null                }}            /><Stack.Screen name = 'blade' component = {Blade}                 options  = {{                    headerShown: false,                    gestureEnabled: false                }}            /></Stack.Navigator>    )}

Within the Marvel component I am returning a component that has the Modal like below

import { Modal }   from 'react-native';class MarvelScreen extends React.Component {    constructor (props) {        super (props);        this.state = {            showModal      : false,        }    }    componentDidUpdate = () => {        // something has happend so         this.props.navigation.navigate ('dc')        //something else has happend         this.props.navigation.navigate ('blade')    }    onModalDismiss = () => {        this.setState({            showModal: false,        });    }    render () {        return (<SafeAreaView style={Style.container}><Modal                                  animationType="slide"                    transparent={true}                    visible={this.state.showModal}                    presentationStyle='overFullScreen'><TouchableWithoutFeedback onPressOut={this.onModalDismiss}><View style={Styles.container}>                          {['Hello', 'Good day'].map((msg, idx) => {                                return <Text key={idx} style={Styles.text}>{msg}</Text>                            })}</View></TouchableWithoutFeedback></Modal><View>              </View></SafeAreaView>         )    }}

In Android the modal opens up when I'm in the following screens Marvel, DC, Blade.

In iOS it only opens up when I'm in Marvel.

How do i get it to behave in iOS the same way as in Android.

This is one of my first posts ever. When I'm stuck I usually just hit my head against a wall, but today I'm asking for help. I've got a ReactNative app built using Expo which does some realtime location monitoring. Which works when the component is active on the screen, but when the app goes into the background, it stops functioning. I've attempted to implement a background task using expo-task-manager, but for the life of me I can't seem to get it to work. I've implemented it to use haptics to notify me that it's functioning properly while testing in the field, and while it seems to work ok on the simulator (I get the console.log at least), the real device only buzzes when the component is active and on screen. I am able to see the blue indicator when the app is not active, but no haptics.

Can someone figure out what I've missed here? Thank you so much in advance.

Here's my code:

import React, { useState, useEffect } from 'react';import { Text, View, Button } from 'react-native';import * as Location from 'expo-location';import * as TaskManager from 'expo-task-manager';import * as Haptics from 'expo-haptics';const DESTINATION_COORDS = {  latitude: 44.0041179865438,  longitude: -121.68169920997431,};const BACKGROUND_LOCATION_TASK = 'background-location-task-buzz-v2';TaskManager.defineTask(BACKGROUND_LOCATION_TASK, async ({ data, error }) => {  if (error) {    console.error('Background location task error:', error.message);    return;  }  const { locations } = data;  if (locations && locations.length > 0) {    const { latitude, longitude } = locations[0].coords;    const distance = calculateDistance(      latitude,      longitude,      DESTINATION_COORDS.latitude,      DESTINATION_COORDS.longitude    );    if (distance < 10) {      await triggerHaptics();      console.log('found it.', Date.now());    }  }});const calculateDistance = (lat1, lon1, lat2, lon2) => {  const R = 6371; // Radius of the earth in km  const dLat = deg2rad(lat2 - lat1);  // deg2rad below  const dLon = deg2rad(lon2 - lon1);  const a =     Math.sin(dLat / 2) * Math.sin(dLat / 2) +    Math.cos(deg2rad(lat1)) * Math.cos(deg2rad(lat2)) *     Math.sin(dLon / 2) * Math.sin(dLon / 2)    ;   const c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1 - a));   const d = R * c; // Distance in km  return d * 1000; // Convert to meters};const deg2rad = (deg) => {  return deg * (Math.PI / 180);};const triggerHaptics = async () => {  await Haptics.notificationAsync(Haptics.NotificationFeedbackType.Success);};const BuzzOnArrival = () => {  const [currentLocation, setCurrentLocation] = useState(null);  const [distanceToDestination, setDistanceToDestination] = useState(null);  useEffect(() => {    // Start background location updates when component mounts    Location.startLocationUpdatesAsync(BACKGROUND_LOCATION_TASK, {      accuracy: Location.Accuracy.BestForNavigation,      timeInterval: 10000, // Check every 10 seconds      distanceInterval: 0,      showsBackgroundLocationIndicator: true,    });    // Clean up function to stop background location updates when component unmounts    return () => {      Location.stopLocationUpdatesAsync(BACKGROUND_LOCATION_TASK);    };  }, []);  useEffect(() => {    // Fetch current location every second    const interval = setInterval(() => {      fetchCurrentLocation();    }, 1000);    // Clean up function to clear the interval when component unmounts    return () => clearInterval(interval);  }, []);  const requestPermissions = async () => {        const { status: foregroundStatus } = await Location.requestForegroundPermissionsAsync();        if (foregroundStatus === 'granted') {          const { status: backgroundStatus } = await Location.requestBackgroundPermissionsAsync();          if (backgroundStatus === 'granted') {            await Location.startLocationUpdatesAsync(LOCATION_TASK_NAME, {              accuracy: Location.Accuracy.Balanced,            });          }        }      };  const fetchCurrentLocation = async () => {    const location = await Location.getCurrentPositionAsync({});    setCurrentLocation(location.coords);    // Calculate distance to destination    const distance = calculateDistance(      location.coords.latitude,      location.coords.longitude,      DESTINATION_COORDS.latitude,      DESTINATION_COORDS.longitude    );    setDistanceToDestination(distance);  };  const handleButtonPress = async () => {    await triggerHaptics();  };  return (<View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}><Text>Listening for arrival...</Text>      {currentLocation && (<Text>Current Location: {currentLocation.latitude}, {currentLocation.longitude}</Text>      )}<Text>Destination: {DESTINATION_COORDS.latitude}, {DESTINATION_COORDS.longitude}</Text><Text>Distance to Destination: {distanceToDestination?.toFixed(2)} meters</Text><Button title="Test Haptics" onPress={handleButtonPress} /><Button onPress={requestPermissions} title="Enable background location" /></View>  );};export default BuzzOnArrival;

And here is my package.json:

{"name": "geocaster","version": "1.0.0","main": "expo-router/entry","scripts": {"start": "expo start","android": "expo run:android","ios": "expo run:ios","web": "expo start --web"  },"dependencies": {"@gorhom/bottom-sheet": "^4.6.1","@react-native-async-storage/async-storage": "1.21.0","@reduxjs/toolkit": "^2.0.1","@supabase/supabase-js": "^2.39.3","base64-arraybuffer": "^1.0.2","expo": "~50.0.2","expo-av": "~13.10.3","expo-background-fetch": "^11.8.1","expo-camera": "~14.0.1","expo-constants": "~15.4.5","expo-crypto": "~12.8.0","expo-file-system": "~16.0.6","expo-haptics": "~12.8.1","expo-image-picker": "~14.7.1","expo-linking": "~6.2.2","expo-location": "~16.5.2","expo-media-library": "~15.9.1","expo-notifications": "~0.27.5","expo-router": "~3.4.4","expo-secure-store": "~12.8.1","expo-sensors": "~12.9.1","expo-status-bar": "~1.11.1","expo-task-manager": "~11.7.0","expo-updates": "~0.24.12","expo-web-browser": "~12.8.2","firebase": "^10.7.1","geolib": "^3.3.4","jszip": "^3.10.1","jszip-utils": "^0.1.0","lucide-react-native": "^0.314.0","pullstate": "^1.25.0","react": "18.2.0","react-dom": "18.2.0","react-native": "0.73.2","react-native-draggable-flatlist": "^4.0.1","react-native-easy-grid": "^0.2.2","react-native-gesture-handler": "^2.16.0","react-native-maps": "1.8.0","react-native-paper": "^5.12.1","react-native-progress": "^5.0.1","react-native-reanimated": "^3.8.1","react-native-safe-area-context": "4.8.2","react-native-screens": "~3.29.0","react-native-snap-carousel": "^3.9.1","react-native-svg": "14.1.0","react-native-web": "~0.19.6","react-redux": "^9.1.0","redux": "^5.0.1"  },"devDependencies": {"@babel/core": "^7.20.0"  },"private": true}

I also am providing what I believe is the relevant parts of my app.json:

{"expo": {    ..."ios": {      ...,"infoPlist": {"UIBackgroundModes": ["location", "fetch"],"NSLocationAlwaysAndWhenInUseUsageDescription": "Placeholder","NSLocationAlwaysUsageDescription": "Placeholder","NSLocationWhenInUseUsageDescription": "Placeholder",      }    },    ...,"plugins": ["expo-router","expo-secure-store",      ["expo-location",        {"locationAlwaysAndWhenInUsePermission": "Placeholder","isAndroidBackgroundLocationEnabled": true,"isIosBackgroundLocationEnabled": true        }      ],    ],    ...  }}

and even my Info.plist:

<key>NSLocationUsageDescription</key><string>Use of location for determining waypoints and proximity</string><key>NSLocationWhenInUseUsageDescription</key><string>Use of location for determing waypoints and proximity</string><key>NSMicrophoneUsageDescription</key><string>The Microphone will be used to record videos for waypoints.</string><key>NSMotionUsageDescription</key><string>The of motion sensors required for the compass.</string><key>NSPhotoLibraryUsageDescription</key><string>The photo library can be used to select images and videos for upload.</string><key>NSUserActivityTypes</key><array><string>$(PRODUCT_BUNDLE_IDENTIFIER).expo.index_route</string></array><key>UIBackgroundModes</key><array><string>location</string><string>fetch</string></array>

I'm focused on iOS for the moment so have only tested it there. I've tried working with it in the simulator, and on real devices. The code above buzzes when the component is active, but not when it's in the background.

I would expect it to buzz as I get within about ten meters of the DESTINATION_COORDS, whether I have the app in the foreground OR in the background.

Right now it only buzzes when the app is in the foreground and the component is actively on the screen.

We're using rnmapbox/maps in our react-native project. After updating from a very old version 10.0.0-rc.0 to 10.1.20 the loading of the WMS layers we are using in the map broken for ios. It works perfectly fine for android.

On ios it does neither work in the simulator nor on the device itself.

The errors we get in the simulator (ios 17.2):

[MapboxCommon] [Error, maps-core]: {}[Style]: Failed to load tile 14/8648/5733=>14 for source rasterSource:[MapboxCommon] [Error, maps-core]: {}[Style]: Failed to load tile 14/8648/5734=>14 for source rasterSource: ERROR  Mapbox [error] MapLoad error Failed to load tile: ERROR  Mapbox [error] MapLoad error Failed to load tile:[MapboxCommon] [Error, maps-core]: {}[Style]: Failed to load tile 15/17298/11466=>15 for source rasterSource:[MapboxCommon] [Error, maps-core]: {}[Style]: Failed to load tile 15/17297/11466=>15 for source rasterSource: ERROR  Mapbox [error] MapLoad error Failed to load tile: ERROR  Mapbox [error] MapLoad error Failed to load tile:

This is how we add the WMS source to the map inside the Mapview component:

<MapboxGL.RasterSource          key="rasterSource"          id="rasterSource"          tileSize={256}          tileUrlTemplates={['https://vogis.cnv.at/mapserver/mapserv?map=i_luftbilder_r_wms.map&service=WMS&request=GetMap&version=1.3.0&crs=EPSG:3857&bbox={bbox-epsg-3857}&dpiMode=7&format=image/png&layers=ef2022_10cm&width=256&height=256&transparent=true',          ]}><MapboxGL.RasterLayer id="rasterLayer" sourceID="rasterSource" style="" /></MapboxGL.RasterSource>

Anyone experienced a similar issue or has any idea what could be the underlying problem?

Im trying to develop an app using react native, but im facing some issues on web version. In this particular case is the scroll not work properly on web browser, but on iOS simulator works well.

import React, { useState, useEffect } from 'react';import { View, Text, StyleSheet, FlatList, Image } from 'react-native';import { ListItem } from 'react-native-elements';import axios from 'axios';const OcorrenciasScreen = ({ navigation }) => {  const [emergencies, setEmergencies] = useState([]);  useEffect(() => {    axios.get('http://localhost:3000/api/data')      .then(response => {        const responseData = response.data;        const mappedData = responseData.incident.map(item => ({          id: item.id,          ocorrencia: item.morada,           description: item.desc_classificacao,           time: item.hora_alerta,          data_hora_alerta: item.data_hora_alerta,          morada: item.morada,          localidade_morada: item.localidade_morada,           desc_classificacao: item.desc_classificacao        }));        setEmergencies(mappedData);      })      .catch(error => {        console.error('Error:', error);      });  }, []);   const renderItem = ({ item }) => (<ListItem onPress={() => navigation.navigate('OcorrenciaDetail', { emergency: item })} containerStyle={styles.item}><Image source={require('./../assets/houseFireVector.png')} style={styles.image} /><ListItem.Content><ListItem.Title style={styles.title}>{item.ocorrencia}</ListItem.Title><ListItem.Subtitle style={styles.description}>{item.description}</ListItem.Subtitle></ListItem.Content><View style={styles.rightContainer}><Text style={styles.timestamp}>{item.time}</Text><ListItem.Chevron color="" /></View></ListItem>  );  return (<View style={styles.container}><FlatList        data={emergencies}        renderItem={renderItem}        keyExtractor={item => item.id}      /></View>  );};const styles = StyleSheet.create({  container: {    flex: 1,    backgroundColor: 'white',  },  item: {    backgroundColor: '#E0E0E0',    padding: 20,    marginVertical: 10,    marginHorizontal: 20,    borderColor: '#C0C0C0',    borderWidth: 1,    borderRadius: 5,  },  title: {    fontSize: 24,    paddingBottom: 10,  },  description: {    fontSize: 18,  },  rightContainer: {    flexDirection: 'row',    alignItems: 'center',  },  timestamp: {    marginRight: 10,    color: '#888',  },  image: {    width: 75,    height: 75,    resizeMode: 'contain',  },});export default OcorrenciasScreen;

Can you help me solve this issue? How i can manage the scroll view correctly on web? I need to have the web totaly functional as the iOS version.

Best regards

I am developing a bank react-native app, try to implement a feature that every time the app goes from background/inactive to active status, users need to verify TOUCHID.

What I did is to check the AppState:

    if (OldappState.match(/inactive|background/) &&      nextAppState === 'active'    ) {      checkLocalAuth()    }

It works fine, but I find a funny problem: when app ask permission, the AppState will become inactive, when user granted the permission the AppState becomes active, that is exactly the same with the behavior of the action described above.

But I don't want to ask for TOUCHID when asking permission, so how to differ the two situations?

We are currently developing an attendance management application and the core functionality is for the user to check in and check out through the app even when they're offline.

The problem we're facing right now is of the timestamp. User can change their device time and that changed time is reflected on the app manipulating the core purpose of the app. According to my research I don't think we can prevent it, just looking for ideas that how can we solve this problem or if is there any work around you guys can think of.

Thanks

I'm running a react native app and constantly running into the issue of the app not connecting to the code to do automatic updates.

Things I've tried:

• Reloading main.jsbundle via the following command: npx react-native bundle --entry-file index.js --platform ios --dev false --bundle-output ios/main.jsbundle --assets-dest ios/assets
• Completely removing node and react native from my computer
• Restarting my computer
• Running on a physical device and running on the simulator
• Cleaning derived data in Xcode

This is the screen on starting up, which offers the advice, "Connect to Metro to develop JavaScript."

From the metro bundler that automatically starts up, I get this message when I type 'r' to reload that says, "React Native: No apps connected."

I'm using 0.61 and always have been.

What else should I try?

EDIT

I was able to get it working by restarting my computer (again).

Every once in a while, a restart does the trick, yet most of the time it doesn't work. There still has to be a more reliable way of fixing this.

I am using a React Native Input box and below that a submit button to execute some action.But I am unable to click the submit button in 1st attempt.it takes two attempts to click the submit button.In 1st attemt the keyboard is getting closed and then only I am able to submit.

Here the code.<TextInputonlyNumeric = {true}

                    showErrorOnFocus = {false}                    value={inputValue}                    isFocus= {true}                    regex= {RegexConfig.MOBILE}                    type= {InputTypeToken.MOBILE}                    charLimit= {10}                    keyboardType= {KeyboardTypeToken.numberPad}                    placeholder= "Enter mobile number"                /></View><View style={{marginTop:8}}><Button                    label = {'Continue'}                    onPress = {() => {}}                /></View>

I'm building a app with expo and i want the app can be compatible with older version iphone and android ( for exemple i want my to be compatible with ios 12 till ios 17. some have idea? thanks

try documentation but no fund solution

React native, having problems navigating to the next screen.

import React from 'react';import { View, Text, StyleSheet, Image, Dimensions, ImageBackground, TouchableOpacity} from 'react-native';import { BASE_IMAGES } from '../../assets/BASE_IMAGES';const { width, height } = Dimensions.get('window');const SplashScreen = ({navigation}) => {  return (<View style={styles.container}><ImageBackground source={BASE_IMAGES.laxLogoBlack} resizeMode={'cover'} style={styles.logo}><TouchableOpacity style={styles.btn} onPress={() => navigation.navigate('SignInPage')}><Text style={styles.btnText}>Continue</Text></TouchableOpacity></ImageBackground></View>  );};const styles = StyleSheet.create({  container: {    flex: 1,    justifyContent: 'center',    alignItems: 'center',  },  logo: {    width: width,      height: height,   },  btn: {    backgroundColor: '#8A8A8A',    paddingHorizontal: 90,    paddingVertical: 10,    borderRadius: 10,    position: 'absolute',      bottom: 50,    alignSelf: 'center'  },  btnText: {    fontSize: 22,    color: '#000000',    textAlign: 'center',  }});export default SplashScreen;

My AppNavigator page is

import React from 'react';import { NavigationContainer } from '@react-navigation/native';import { createNativeStackNavigator } from '@react-navigation/native-stack';import SplashScreen from '../screens/SplashScreen';import SignInPage from '../screens/SignInPage';const Stack = createNativeStackNavigator();const AppNavigator = () => {  return (<NavigationContainer><Stack.Navigator initialRouteName="SplashScreen"><Stack.Screen          name="SplashScreen"          component={SplashScreen}          options={{ headerShown: false }}        /><Stack.Screen          name="SignInPage"          component={SignInPage}          options={{ headerShown: false }}        /></Stack.Navigator></NavigationContainer>  );};export default AppNavigator;

I have installed npm install @react-navigation/native, npm install react-native-screens react-native-safe-area-context and npm install @react-navigation/native-stack but no matter what I keep getting the same error Cannot read property 'navigate' of undefined. What am I doing wrong here?

When I run this command in my react-native expo project, eas build --profile preview --platform ios --local, I get this error:

[RUN_FASTLANE] ⚠️  Script has ambiguous dependencies causing it to run on every build.   To fix, go to: Xcode » MagicMusic/MagicMusic » Build Phases »'[CP-User] [RNFB] Core Configuration'   Either: Uncheck "Based on dependency analysis", or select output files to trigger the script

I'm not currently actively doing anything with Xcode and I'm not sure how to solve this problem.