Quantcast
Channel: Active questions tagged react-native+ios - Stack Overflow
Viewing all 17248 articles
Browse latest View live

Change AppDelegate.mm to AppDelegate.swift on React Native 0.71

$
0
0

I encountered the error "A moduleName is required to create an RCTROotView", and then the app was stuck on the startup page. Who can help me? thank you.

Step

  1. run 'npx react-native init RN0710RC3 --version 0.71.0-rc.3' to create a RN project
  2. create 'AppDelegate.swift''Bridging-Header.h' and delete 'AppDelegate.mm''AppDelegate.h''main.m'

AppDelegate.mm

#import "AppDelegate.h"#import <React/RCTBundleURLProvider.h>@implementation AppDelegate- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions{    self.moduleName = @"RN0710RC3";    return [super application:application didFinishLaunchingWithOptions:launchOptions];}- (NSURL *)sourceURLForBridge:(RCTBridge *)bridge{    #if DEBUG    return [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index"];    #else    return [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];    #endif}- (BOOL)concurrentRootEnabled{    return true;}@end

AppDelegate.swift

import Foundationimport UIKit@UIApplicationMainclass AppDelegate: RCTAppDelegate {  func application(application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {      CommonTheme.currentTheme.primaryColor = .red;      self.moduleName = "RN0710RC3";      return self.application(application, didFinishLaunchingWithOptions: launchOptions);  }  override func sourceURL(for bridge: RCTBridge!) -> URL! {      #if DEBUG      return RCTBundleURLProvider.sharedSettings()?.jsBundleURL(forBundleRoot: "index", fallbackResource: nil)      #else      return Bundle.main.url(forResource: "main", withExtension: "jsBundle")      #endif  }  func concurrentRootEnabled() -> Bool {      return true;  }}

Bridging-Header.h

#import <RCTAppDelegate.h>#import <React/RCTBundleURLProvider.h>

'RNSplashScreen.h' file not found

$
0
0

I recently purchased a new MacBook M2 Pro and cloned my React Native app onto it. However, I'm encountering an error stating that the 'RNSplashScreen.h' file cannot be found, even though I have not included the 'react-native-splash-screen' package in my project. Despite trying various solutions from online sources, the issue persists only on my system, while other developers using the same system do not face this problem. What could I be overlooking?enter image description here

Unable to build react native app on ios due to flipperkit

$
0
0

I am using React Native (0.73.2) and the app builds for android without issue. I am now at a stage where I am trying to test and build for ios however the build fails and this is the only information I have:

The following build commands failed:        CompileC /Users/user257599/Library/Developer/Xcode/DerivedData/###-cagfttfeertkgidamqciuaveliuz/Build/Intermediates.noindex/Pods.build/Debug-iphonesimulator/FlipperKit.build/Objects-normal/arm64/FlipperPlatformWebSocket.o /Users/user257599/Documents/###/###/ios/Pods/FlipperKit/iOS/FlipperKit/FlipperPlatformWebSocket.mm normal arm64 objective-c++ com.apple.compilers.llvm.clang.1_0.compiler (in target 'FlipperKit' from project 'Pods')(1 failure)

I really have no idea where to go from here. I have tried running pod update with no success

Measuring Distance from the Floor in Expo/React Native

$
0
0

I'm currently working on a project in Expo/React Native and need to create a control that will indicate whether the distance from the floor to device is appropriate—it can't be too large or too small. Does anyone know how to measure the distance from the floor within these frameworks? Any pointers or tips would be greatly appreciated!

Why navigation back close expo go IOS?

$
0
0

When I click on the button "Back" in the header or on the button "go home" in the details page my app close. So Why? But with the help of swipe I can return back.

screenshot of details screen

app.jsx file - only navigation

// Screensimport MainNavigation from "./src/routes/MainNavigation";export default function App() {  return (<MainNavigation />  );}

Navigation is like in documentationMainNavigation.tsx

// Navigationimport { NavigationContainer } from "@react-navigation/native";import { createNativeStackNavigator } from "@react-navigation/native-stack";// Screensimport HomeScreen from "../screens/HomeScreen/HomeScreen";import TodoDetailsScreen from "../screens/TodoDetailsScreen/TodoDetailsScreen";import { Button } from "react-native";// Keep the splash screen visible while we fetch resourcesconst Stack = createNativeStackNavigator();const MainNavigation = () => {  return (<NavigationContainer><Stack.Navigator initialRouteName="Home"><Stack.Screen name="Home" component={HomeScreen} /><Stack.Screen          name="Details"          component={TodoDetailsScreen}          options={            {              // headerBackVisible: false,            }          }        /></Stack.Navigator></NavigationContainer>  );};export default MainNavigation;

HomeScreen.tsx - just simple scrin with one redirection

import { Button, SafeAreaView, Text, View } from "react-native";import { NavigationProp, RouteProp } from "@react-navigation/native";const HomeScreen = ({  navigation,}: {  navigation: NavigationProp<any, any>;}) => {  return (<SafeAreaView><Text>Home screen</Text><Button        onPress={() => {          navigation.navigate("Details", { _id: "123" });        }}        title="go to details TODO"      /></SafeAreaView>  );};export default HomeScreen;

TodoDetailsScreen.tsx - simple screen

import { NavigationProp, RouteProp } from "@react-navigation/native";import { Button, Text, View } from "react-native";const TodoDetailsScreen = ({  navigation,  route,}: {  route: RouteProp<any, any>;  navigation: NavigationProp<any, any>;}) => {  const { _id } = route.params;  console.log("_id", _id);  return (<View><Text>TodoDetailsScreen</Text><Button        onPress={() => {          navigation.navigate("Home");        }}        title="go home"      /></View>  );};

package.json

{"name": "reactnative-ts","version": "1.0.0","main": "expo/AppEntry.js","scripts": {"start": "expo start","android": "expo start --android","ios": "expo start --ios","web": "expo start --web"  },"dependencies": {"@react-navigation/native": "^6.1.17","@react-navigation/native-stack": "^6.9.26","expo": "~51.0.2","expo-font": "^12.0.4","expo-splash-screen": "^0.27.4","expo-status-bar": "~1.12.1","react": "18.2.0","react-native": "0.74.1","react-native-safe-area-context": "^4.10.1","react-native-screens": "^3.31.1"  },"devDependencies": {"@babel/core": "^7.20.0","@types/react": "~18.2.45","typescript": "^5.1.3"  },"private": true}

Camera capture stopped working after upgrading from Expo SDK 50 -> 51

$
0
0

So I just upgraded from SDK 50 -> 51 which made my app crash all the time I go to component with a Camera, now i fixed it, my current "take picture" method does not work. Do you guys know how to fix this?

const captureImage = async () => {        if (camRef) {            try {                const imgData = await camRef.current.takePictureAsync({                    base64: false,                    imageType: ImageType.png,                });                setImage(imgData);            } catch (err) {                console.log(err);            }        }    }

I tried using other methods but doesnt work

Low volume when using AVAudioSessionCategoryPlayAndRecord

$
0
0

I am developing a react native app and encountering a problem with sound on iOS.

This app is a video conferencing app that play sounds during the meeting. For this, I use video-sdk which is build on top of web-rtc and react-native-track-player for sound playback.

My problem has to do with the management of the audio session.When playing sound with react-native-track-player, I have the ability to choose the AVAudioSessionCategory and Options. With AVAudioSessionCategoryPlayback, I have no volume problem. But I can't record and play sound at the same time during the meeting. However when using AVAudioSessionCategoryPlayAndRecord, the sound is super low.

I tried to activate DefaultSpeaker, MixWithOthers and basically tried every combinaison of categories and modes possible, without success.

I also tried to modify the native code of video-sdk to add MixWithOthers everywhere.And I also took a look at the code of react-native-web-rtc, which use AudioCaptureSession. I don't know if it interferes with the sound but I found the following option in the Apple docs.https://developer.apple.com/documentation/avfaudio/avaudiosession/2186370-setaggregatediopreference?language=objc

So basically, I'd like to know how to make all these AudioSession and CaptureSession work together to be able to play sound at full volume during a meeting.

I have very little knowledge of iOS development, so some things may be obvious for you, but not for me. So I am welcoming every insights :)

Thank you !

How to capture audio from other applications while using GetDisplayMedia for screen sharing in a React Native app?

$
0
0

I've implemented screen sharing using WebRTC in my React Native app, but I'm encountering an issue where the audio from other apps, such as YouTube, is not being captured during screen broadcasting.

Below is the React Native code snippet I'm using for screen sharing:

const screenShareStreamRef = useRef();const [screenShareStream, setScreenShareStream] = useState(null);const screenShareVideoProducer = useRef();const screenShareAudioProducer = useRef();let audioTrack, videoTrack, screenstream;  const startScreenStream = async () => {    try {      const displayStream = await mediaDevices.getDisplayMedia({ video: true });      videoTrack = displayStream.getVideoTracks()[0];      const audioStream = await mediaDevices.getUserMedia({ audio: true });      audioTrack = audioStream.getAudioTracks()[0];      // Combine video and audio tracks into a single MediaStream      screenstream = new MediaStream([videoTrack, audioTrack]);      screenShareStreamRef.current = screenstream;      setScreenShareStream(screenstream);    } catch (error) {      console.error(error);    }})

For both iOS and Android, I've followed the setup provided in this guide: Link to the setup guide.

Additionally, for iOS, I've added the necessary files into the project, as mentioned in the guide: Link to the files.

I'm looking for insights or solutions on how to capture audio from other apps during screen sharing. Any help would be appreciated. Thank you!


Could not find com.google.vr:sdk-base:1.180.0

$
0
0

I am trying to render panaroma image on my react-native application. Tried few packages, but most of the devs suggesting this https://github.com/lightbasenl/react-native-panorama-view.

Since, I have made some changes on build.gradlew for the package. I couldn't able to build the app. Is there anyway to fix this issue

build.gradle (app)

buildscript {    ext {        buildToolsVersion = "34.0.0"        minSdkVersion = 23        compileSdkVersion = 34        targetSdkVersion = 34        ndkVersion = "26.1.10909125"        kotlinVersion = "1.9.22"    }    repositories {        flatDir {            dirs 'libs'        }        google()        mavenCentral()    }    dependencies {        classpath("com.android.tools.build:gradle")        classpath("com.facebook.react:react-native-gradle-plugin")        classpath("org.jetbrains.kotlin:kotlin-gradle-plugin")    }}subprojects { subproject ->    if(project['name'] == 'lightbase_react-native-panorama-view'){        project.configurations { compile { } }    }}apply plugin: "com.facebook.react.rootproject"

build.gradle (react-native-panorama-view)

buildscript {    repositories {        google()        mavenCentral()    }    dependencies {        // Matches recent template from React Native (0.59)        // https://github.com/facebook/react-native/blob/0.59-stable/template/android/build.gradle#L16        classpath 'com.android.tools.build:gradle:3.3.2'    }}apply plugin: 'com.android.library'apply plugin: 'maven-publish'def safeExtGet(prop, fallback) {    rootProject.ext.has(prop) ? rootProject.ext.get(prop) : fallback}// Matches values in recent template from React Native (0.59)// https://github.com/facebook/react-native/blob/0.59-stable/template/android/build.gradle#L5-L9def DEFAULT_COMPILE_SDK_VERSION = 28def DEFAULT_BUILD_TOOLS_VERSION = "28.0.3"def DEFAULT_MIN_SDK_VERSION = 19def DEFAULT_TARGET_SDK_VERSION = 28android {  compileSdkVersion safeExtGet('compileSdkVersion', DEFAULT_COMPILE_SDK_VERSION)  buildToolsVersion safeExtGet('buildToolsVersion', DEFAULT_BUILD_TOOLS_VERSION)  defaultConfig {    minSdkVersion safeExtGet('minSdkVersion', DEFAULT_MIN_SDK_VERSION)    targetSdkVersion safeExtGet('targetSdkVersion', DEFAULT_TARGET_SDK_VERSION)    versionCode 1    versionName "1.0"  }  lintOptions {    abortOnError false  }}repositories {    maven {        // All of React Native (JS, Obj-C sources, Android binaries) is installed from npm        // Matches recent template from React Native (0.59)        // https://github.com/facebook/react-native/blob/0.59-stable/template/android/build.gradle#L30        url "$projectDir/../node_modules/react-native/android"    }    mavenCentral()}dependencies {    implementation 'com.facebook.react:react-native:+'    // Panorama    implementation "androidx.annotation:annotation:1.1.0"    implementation 'com.google.vr:sdk-base:1.180.0'    implementation 'com.google.vr:sdk-common:1.180.0'    implementation 'com.google.vr:sdk-commonwidget:1.180.0'    implementation 'com.google.vr:sdk-panowidget:1.180.0'    implementation 'commons-io:commons-io:2.5'}def configureReactNativePom(def pom) {    def packageJson = new groovy.json.JsonSlurper().parseText(file('../package.json').text)    pom.project {        name packageJson.title        artifactId packageJson.name        version = packageJson.version        group = "nl.lightbase"        description packageJson.description        url packageJson.repository.baseUrl        licenses {            license {                name packageJson.license                url packageJson.repository.baseUrl +'/blob/master/'+ packageJson.licenseFilename                distribution 'repo'            }        }        developers {            developer {                id packageJson.author.username                name packageJson.author.name            }        }    }}afterEvaluate { project ->    // some Gradle build hooks ref:    // https://www.oreilly.com/library/view/gradle-beyond-the/9781449373801/ch03.html    task androidJavadoc(type: Javadoc) {        source = android.sourceSets.main.java.srcDirs        classpath += files(android.bootClasspath)        classpath += files(project.getConfigurations().getByName('compile').asList())        include '**/*.java'    }    task androidJavadocJar(type: Jar, dependsOn: androidJavadoc) {        archiveClassifier  = 'javadoc'        from androidJavadoc.destinationDir    }    task androidSourcesJar(type: Jar) {        archiveClassifier  = 'sources'        from android.sourceSets.main.java.srcDirs        include '**/*.java'    }    android.libraryVariants.all { variant ->        def name = variant.name.capitalize()        def javaCompileTask = variant.javaCompileProvider.get()        task "jar${name}"(type: Jar, dependsOn: javaCompileTask) {            from javaCompileTask.destinationDir        }    }    artifacts {        archives androidSourcesJar        archives androidJavadocJar    }    task installArchives(type: Upload) {        configuration = configurations.archives        repositories{            mavenDeployer {                repository url: "file://${projectDir}/../android/maven"                configureReactNativePom pom            }}    }}

My Expo upgrade from 48 to 51 giving Problems

$
0
0

I am updating my expo project from expo 48 to expo 51 and I am getting same error again and again.

Error Image

And my package.json file after running, npm install expo@latest and npx expo install --fix command

{"name": "BelCitiSolSmartLighting","version": "1.0.0","scripts": {"start": "expo start --dev-client","android": "expo run:android","ios": "expo run:ios","web": "expo start --web","eject": "expo eject"  },"dependencies": {"@expo-google-fonts/pt-serif": "^0.2.2","@react-native-async-storage/async-storage": "1.23.1","@react-native-community/art": "^1.2.0","@react-native-community/datetimepicker": "7.7.0","@react-native-community/netinfo": "11.3.1","@react-native-picker/picker": "2.7.5","@react-navigation/bottom-tabs": "^6.3.1","@react-navigation/drawer": "^6.4.1","@react-navigation/native": "^6.1.6","@react-navigation/native-stack": "^6.6.2","axios": "^0.27.2","axios-auth-refresh": "^3.2.2","crypto-js": "^3.1.9-1","dotenv": "^16.0.1","exceljs": "^4.3.0","expo": "~51.0.4","expo-app-loading": "~2.0.0","expo-barcode-scanner": "~13.0.1","expo-build-properties": "~0.12.1","expo-camera": "~15.0.7","expo-constants": "~16.0.1","expo-crypto": "~13.0.2","expo-device": "~6.0.2","expo-file-system": "~17.0.1","expo-image-manipulator": "~12.0.4","expo-image-picker": "~15.0.4","expo-intent-launcher": "~11.0.1","expo-linking": "~6.3.1","expo-location": "~17.0.1","expo-media-library": "~16.0.3","expo-network": "~6.0.1","expo-permissions": "~14.1.1","expo-screen-orientation": "~7.0.4","expo-secure-store": "~13.0.1","expo-sharing": "~12.0.1","expo-splash-screen": "~0.27.4","expo-status-bar": "~1.12.1","expo-updates": "~0.25.11","fs": "0.0.1-security","link": "^1.5.1","material-icons": "^1.13.10","moment": "^2.29.3","native-base": "^3.4.4","react": "18.2.0","react-dom": "18.2.0","react-hook-form": "^7.45.4","react-native": "0.74.1","react-native-barcode-mask": "^1.2.4","react-native-calendars": "^1.1284.0","react-native-chart-kit": "^6.12.0","react-native-dotenv": "^3.3.1","react-native-dropdown-picker": "^5.4.2","react-native-elements": "^3.4.2","react-native-gesture-handler": "~2.16.1","react-native-indicator": "^1.2.2","react-native-keychain": "^8.0.0","react-native-maps": "1.14.0","react-native-material-menu": "^2.0.0","react-native-modern-datepicker": "^1.0.0-beta.91","react-native-paper": "^4.12.1","react-native-permissions": "^3.8.4","react-native-popable": "^0.4.3","react-native-popup-menu": "^0.15.12","react-native-qrcode-scanner": "^1.5.5","react-native-radio-buttons-group": "^3.0.3","react-native-reanimated": "~3.10.1","react-native-redash": "^16.3.0","react-native-root-siblings": "^4.1.1","react-native-root-toast": "^3.4.0","react-native-safe-area-context": "4.10.1","react-native-screens": "3.31.1","react-native-svg": "15.2.0","react-native-walkthrough-tooltip": "^1.3.1","react-native-web": "~0.19.10","react-navigation": "^4.4.4","recharts": "^2.1.9","rn-tooltip": "^3.0.1","safe-json-stringify": "^1.2.0","socket.io-client": "^2.0.4","victory-native": "^36.5.0"  },"devDependencies": {"@babel/core": "^7.24.0","@types/crypto-js": "^4.1.1","@types/react": "~18.2.79","@types/react-native": "~0.67.6","@types/react-native-vector-icons": "^6.4.10","@types/socket.io-client": "^3.0.0","react-native-vector-icons": "^9.2.0","typescript": "~5.3.3"  },"resolutions": {"@types/react": "~17.0.21","@types/react-native": "~0.64.12","crypto-js": "3.1.9-1","**/crypto-js": "3.1.9-1"  },"private": true,"rnpm": {"assets": ["./assests/fonts/"    ]  }}

Please provide me solution.

Also I unstalled one by one package to see what is problem but not getting solution

warning: Run script build phase '[CP-User] [Hermes] Replace Hermes for the right configuration

$
0
0

i'm getting this warnings react native project ,my project in VS code and i related to Xcodemy macOS is M1.

i try adding [CP-User][Hermes], but i have same warning.

warning: Run script build phase '[CP-User] [Hermes] Replace Hermes for the right configuration, if needed' will be run during every build because it does not specify any outputs. To address this warning, either add output dependencies to the script phase, or configure it to run in every build by unchecking "Based on dependency analysis" in the script phase. (in target 'hermes-engine' from project 'Pods')

React Native RCTFabric - No type or protocol named 'RCTDebuggingOverlayViewProtocol'

$
0
0

After upgrading to the latest version of react-native I've suddenly run into the issue with RCTFabric.

"react-native": "0.74.0",
1. No type or protocol named 'RCTDebuggingOverlayViewProtocol'2. Use of undeclared identifier 'DebuggingOverlayShadowNode'3. Use of undeclared identifier 'DebuggingOverlayShadowNode'4. Use of undeclared identifier 'RCTDebuggingOverlayHandleCommand'

Did anyone face something like this?

RCTFabric issue

APNS device token not set before retrieving FCM Token for Sender ID - React Native Firebase

$
0
0

I have been following this tutorial to set-up Remote Push notifications on my react-native application using react-native-firebase Version 5.2.0. After I configured everything and ran the application I get an error as:

APNS device token not set before retrieving FCM Token for Sender ID ''. Notifications to this FCM Token will not be delievered over APNS. Be sure to re-retrieve the FCM token once the APNS token is set.

Been trying to figure out how to solve this issue but wasn't quite successful.Running on react-native : 0.61.2, react-native-firebase: 5.2.0

Following is my AppDelegate.m

#import "AppDelegate.h"#import <React/RCTBridge.h>#import <React/RCTBundleURLProvider.h>#import <React/RCTRootView.h>#import <RNCPushNotificationIOS.h>#import <UserNotifications/UserNotifications.h>#import <Firebase.h>@import Firebase;@implementation AppDelegate- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions{  [FIRApp configure];  RCTBridge *bridge = [[RCTBridge alloc] initWithDelegate:self launchOptions:launchOptions];  RCTRootView *rootView = [[RCTRootView alloc] initWithBridge:bridge                                                   moduleName:@"helloworld"                                            initialProperties:nil];  rootView.backgroundColor = [[UIColor alloc] initWithRed:1.0f green:1.0f blue:1.0f alpha:1];  self.window = [[UIWindow alloc] initWithFrame:[UIScreen mainScreen].bounds];  UIViewController *rootViewController = [UIViewController new];  rootViewController.view = rootView;  self.window.rootViewController = rootViewController;  [self.window makeKeyAndVisible];  // define UNUserNotificationCenter  UNUserNotificationCenter *center = [UNUserNotificationCenter currentNotificationCenter];  center.delegate = self;  return YES;}- (NSURL *)sourceURLForBridge:(RCTBridge *)bridge{#if DEBUG  return [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index" fallbackResource:nil];#else  return [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];#endif}// Required to register for notifications- (void)application:(UIApplication *)application didRegisterUserNotificationSettings:(UIUserNotificationSettings *)notificationSettings{  [RNCPushNotificationIOS didRegisterUserNotificationSettings:notificationSettings];}// Required for the register event.- (void)application:(UIApplication *)application didRegisterForRemoteNotificationsWithDeviceToken:(NSData *)deviceToken{  [RNCPushNotificationIOS didRegisterForRemoteNotificationsWithDeviceToken:deviceToken];}// Required for the notification event. You must call the completion handler after handling the remote notification.- (void)application:(UIApplication *)application didReceiveRemoteNotification:(NSDictionary *)userInfofetchCompletionHandler:(void (^)(UIBackgroundFetchResult))completionHandler{  [RNCPushNotificationIOS didReceiveRemoteNotification:userInfo fetchCompletionHandler:completionHandler];}// Required for the registrationError event.- (void)application:(UIApplication *)application didFailToRegisterForRemoteNotificationsWithError:(NSError *)error{  [RNCPushNotificationIOS didFailToRegisterForRemoteNotificationsWithError:error];}// Required for the localNotification event.- (void)application:(UIApplication *)application didReceiveLocalNotification:(UILocalNotification *)notification{  [RNCPushNotificationIOS didReceiveLocalNotification:notification];}//Called when a notification is delivered to a foreground app.-(void)userNotificationCenter:(UNUserNotificationCenter *)center willPresentNotification:(UNNotification *)notification withCompletionHandler:(void (^)(UNNotificationPresentationOptions options))completionHandler{  NSLog(@"User Info : %@",notification.request.content.userInfo);  completionHandler(UNAuthorizationOptionSound | UNAuthorizationOptionAlert | UNAuthorizationOptionBadge);}@end

and token retrieval on my App.js:

const messaging = firebase.messaging();messaging.hasPermission()  .then((enabled) => {    if (enabled) {      messaging.getToken()        .then(token => { console.log("+++++ TOKEN ++++++"+ token) })        .catch(error => { console.log("+++++ ERROR GT +++++"+ error) })    } else {      messaging.requestPermission()        .then(() => { console.log("+++ PERMISSION REQUESTED +++++") })        .catch(error => { console.log("+++++ ERROR RP ++++"+ error) })    }  })  .catch(error => { console.log("+++++ ERROR +++++"+ error) });

Any help would be much appreciated! Thanks!

RTC Peer connection error when trying to accept live video call in WKWebView ran in Mac Catalyst

$
0
0

I am developing a WKWebView app that runs on both iOS and Mac Catalyst using a react website.

Currently, an admin user can send a call request in which the user gets a pop-up to answer. on iOS it works as intended, the user is asked to grant permission to utilize camera and microphone and the user is immediately connected upon accepting, however I never receive the pop-up when running in Mac Catalyst. I have ensured to enable permissions in sandbox settings as well as adding NSCamera and NSMic permissions in the property list

<key>NSCameraUsageDescription</key> <string>This application requires camera access to access live video chat</string> <key>NSMicrophoneUsageDescription</key> <string>This application requires microphone access to record audio.</string>

in the safari debugging console I receive this error upon clicking the accept call from the video chat, I do not receive this error when accepting the call on mobile

ReferenceError: Can't find variable: RTCPeerConnection

Ive attempted to use the webview callback requestMediaCapturePermissionFor, and this did not seem to trigger on attempting to answer the call. Is this an error on my development end? or is this an issue I should look to the react code for a fix. I appreciate any feedback possible. Thanks.

React Native Firebase - on iOS onMessage event is not firing in Foreground

$
0
0

This question was submitted in GitHub issues here - reposting with a hope to save time for others running into the same problem

Trying to change the push notifications package used by an old app to the latest React Native and Firebase messaging. I have set up a new app from scratch to isolate the issue - all new identifiers, bundle ids, certificates, etc. The only things installed in the new project are yarn add @react-native-firebase/app and @react-native-firebase/messaging

On Android everything works. On iOS background and killed state messages are also working, but onMessage event is never fired when in Foreground😢

I followed all the latest guides on https://reactnative.dev/docs/environment-setup , https://rnfirebase.io/ , https://rnfirebase.io/messaging/usage and https://rnfirebase.io/messaging/usage/ios-setup.

I am sending the notifications with AWS SNS.


React native TextInput selectionColor not working

$
0
0

The cursor color does not change using the selectedColor property.

It was working normally until I updated to expo sdk 51 and tested on ios 17.4.1. Still works on android.

There is no error message, it just doesn't change the color. The react native documentation for TextInput only indicates the use of selectionColor (for both ios and android).

I tried using other colors besides "#000000" and it still has the iOS default color.

If you need more information about the project please let me know.

<TextInput selectionColor={"#000000"} cursorColor={"#000000"} maxLength={7}/>

"expo": "^51.0.2","react": "18.2.0"

API not working on react-native without SSL

$
0
0

I have been looking for the solution of a similar question but I couldn't find any. So that's why I am asking it here.

So I have deployed my api's on an AWS instance and whenever I try to access the api's from the browser they work properly. i.e if I do http://25.234.23.53:3030 I get the success message, but for some reason I am not able to use the AWS instance IP and port to call the API's from my react native Ios simulator.

Whenever I am calling the API from my react-native app, I'm getting this:

Network Error

and referring to another similar question asked on stack overflow, I have also tried using this approach in my app's info.plist:

<key>NSAppTransportSecurity</key><dict><key>NSExceptionDomains</key><dict><key>NSAllowsArbitraryLoads</key><true/><key>localhost</key><dict><key>NSExceptionAllowsInsecureHTTPLoads</key><true/></dict></dict></dict>

"react-native version": "0.68.2",

Please guide me how can I allow my app to use http calls from my AWS instance?

prevent screenshot in ios device

$
0
0

I want to prevent screenshot in the ios app and I did this, now I want to test this feature in the simulator but I have no way to test the screenshot in the simulatorDoes anyone know how to test it ?

ITMS-91064 NSPrivacyTracking must be true if NSPrivacyTrackingDomains isn‘t empty. Keys and values

$
0
0

I have issue releasing a react-native project in appStore after I submit the app I get rejection from Apple

rejection msg:

ITMS-91064: Invalid tracking information - A PrivacyInfo.xcprivacy file contains invalid tracking information at the following path: “Frameworks/SASDisplayKit.framework/PrivacyInfo.xcprivacy”. NSPrivacyTracking must be true if NSPrivacyTrackingDomains isn‘t empty. Keys and values in your app’s privacy manifest must be valid. For more details about privacy manifest files

I added this snippet from react-native to my project in the PrivacyInfo.xcprivacy

<?xml version="1.0" encoding="UTF-8"?><!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd"><plist version="1.0"><dict><key>NSPrivacyTrackingDomains</key><array/><key>NSPrivacyCollectedDataTypes</key><array/><key>NSPrivacyAccessedAPITypes</key><array><dict><key>NSPrivacyAccessedAPIType</key><string>NSPrivacyAccessedAPICategoryFileTimestamp</string><key>NSPrivacyAccessedAPITypeReasons</key><array><string>C617.1</string></array></dict><dict><key>NSPrivacyAccessedAPIType</key><string>NSPrivacyAccessedAPICategoryUserDefaults</string><key>NSPrivacyAccessedAPITypeReasons</key><array><string>CA92.1</string></array></dict><dict><key>NSPrivacyAccessedAPIType</key><string>NSPrivacyAccessedAPICategorySystemBootTime</string><key>NSPrivacyAccessedAPITypeReasons</key><array><string>35F9.1</string></array></dict></array><key>NSPrivacyTracking</key><true/></dict></plist>

Note: I also update react-native-firebase/analytics to the latest version 19.2.2, because according to the issue in GitHub I need to update to the latest version, however that didn't fix it

this how the PrivacyInfo.xcprivacy looks from Xcodeenter image description here

any clue how to fix this issue?

Loading multiple JS bundles in React Native iOS

$
0
0

I'm trying to implement Code Splitting in a React Native app. Currently I managed to load multiple bundles in Android both in packager mode and in production mode.

However, on iOS I'm facing the following issue:Cannot initialize hmrClient twice.I'm trying to load the additional bundles using [bridge.batchedBridge executeSourceCode] which works in production mode but throws when using the packager.

When looking at the implementation of executeSourceCode I see that it indeed calls setupHMRClientWithBundleURL without checking if it was already initialized.

Is there any way to overcome this issue?

Viewing all 17248 articles
Browse latest View live